Icon and Title in one TitlebarContainer

3 posts, 1 answers
  1. Malichone
    Malichone avatar
    8 posts
    Member since:
    Nov 2009

    Posted 08 Jan 2010 Link to this post

    Is there any way to have an icon AND the title text visible in a single docks titlebarContainer? 
  2. Answer
    Pero
    Admin
    Pero avatar
    1156 posts

    Posted 12 Jan 2010 Link to this post

    Hi Malichone,

    Depending on your specific scenario you could try the following suggestions:
    • Use a custom DockCommand to serve as an icon. You need to apply the following CSS class to the DockCommand and the custom image will be applied:
      <style type="text/css">
          .MyCustomStyle
          {
              width: 19px;
              height: 19px;
              background: url(Icons/zoom_in.png) no-repeat !important;
          }
      </style>
      To add custom DockCommand use the dock's <Commands> tag.
    • Place an <image> or <asp:Image> in the TitlebarContainer that will serve as an icon and <asp:Label> to contain the Title text.

    Please do not hesitate to contact us, in case you have any other questions.


    All the best,
    Pero
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Malichone
    Malichone avatar
    8 posts
    Member since:
    Nov 2009

    Posted 12 Jan 2010 Link to this post

    "Place an <image> or <asp:Image> in the TitlebarContainer that will serve as an icon and <asp:Label> to contain the Title text."

    This led us into the direction that we implemented. In our extended radDock control we added the following:
            private Image _widgetIcon;  
            public Image widgetIcon  
            {  
                get 
                { return _widgetIcon; }  
            }  
     
            private Label _WidgetTitle;  
            public Label WidgetTitle  
            {  
                get 
                { return _WidgetTitle; }  
            }  
     
            public NCSBlackRadDock() : base()  
            {  
                // INCLUDE A WIDGET SPECIFIC ICON (IF AVAILABLE)  
                _widgetIcon             = new Image();  
                _widgetIcon.ID          = "WidgetIcon";  
                _widgetIcon.ImageUrl    = String.Empty;  
                _widgetIcon.CssClass    = "WidgetIcon";  
                this.TitlebarContainer.Controls.Add(_widgetIcon);  
     
                // INCLUDE A WIDGET SPECIFIC TITLE (IF AVAILABLE)  
                _WidgetTitle            = new Label();  
                _WidgetTitle.ID         = "WidgetTitle";  
                _WidgetTitle.Text       = String.Empty;  
                this.TitlebarContainer.Controls.Add(_WidgetTitle);  
            }  
     

    and in our web page we consume these objects like:
     NCSBlackRadDock dock = new NCSBlackRadDock();  
     dock.widgetIcon.ImageUrl = "~/Prototype/Modules/HttpWebRequest/Images/Config.png";  
     dock.WidgetTitle.Text = "Critical Printers";  
     

    to get the icon and the title on the widget titlebar.
Back to Top