Raddock - custom images at the right-top

6 posts, 0 answers
  1. franchute
    franchute avatar
    28 posts
    Member since:
    Jan 2008

    Posted 16 Apr 2008 Link to this post

    Hi guys,

    Is there any way to change the images showed in the custom commands example at the right-top of the control ?

    Thanks in advance,

    François.
  2. Sophy
    Admin
    Sophy avatar
    636 posts

    Posted 17 Apr 2008 Link to this post

    Hi François,

    Please, refer to the Styling Custom Commands help article which describes how to change the images shown in RadDock's custom commands.

    All the best,
    Sophy
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. sam
    sam avatar
    31 posts
    Member since:
    Jan 2008

    Posted 11 Jun 2008 Link to this post

    hi sophy

    i am trying to add imge in command in title bar in rad dock object
    the folloing my code in HTML and its didn't work
    Commands>
    <cc1:RadDockableObjectCommand AutoPostBack="True" Name ="ViewTotalCallsForLoginUserReport" ToolTip = "ViewReport"
    Image="../../../ViewReport.gif" />
    </Commands> 


    thanx in advance
    Asmaa
  4. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 12 Jun 2008 Link to this post

    Hi sam,

    I am not quite sure what exactly is

    <cc1:RadDockableObjectCommand AutoPostBack="True" Name ="ViewTotalCallsForLoginUserReport" ToolTip = "ViewReport"   
    Image="../../../ViewReport.gif" /> 
     

    but I assume that this is a user control (.ascx). If I am right I want to note that you can not put such in the titlebar. Between the <Commands> tags you should define a <telerik:DockCommand>, which you can customize further as shown below:

       <telerik:DockCommand CssClass="MyCustomStyle" Name="Alert" OnClientCommand="MakeAnAlert" /> 


    In the OnClientCommand handler you specify what to happen when the icon is clicked. The icon image is associated with the command by the CSSClass property and in the corresponding class you set the image:

    .MyCustomStyle  
      {  
        width30px;  
        height10px;  
        background:url(alertIcon.gif);  
      } 

    For your convenience I am attaching a sample project which shows how to achieve the desired functionality.

    All the best,
    Svetlina
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. sam
    sam avatar
    31 posts
    Member since:
    Jan 2008

    Posted 16 Jun 2008 Link to this post

    Hi Svetlina  
    I tried the code u sent in previous post, its not work what i want is add an Image just like Expande and Collapse images in my commnad in my rad dock obj i am using Q1 20047.
     why in the following HTML the image property was not take the image path

    <%

    @ Register Assembly="RadDock.Net2" Namespace="Telerik.WebControls" TagPrefix="cc1" %>

    <cc1:RadDockableObject ID="TestObject" runat="server" Enabled ="true" DockingMode ="Dockable" Behavior =" Pin, Collapse " Text ="Test Obj" Width="200px" Height ="100" OnCommand = "TestObject_Command" BorderColor ="#cccc33"  >
    <ContentTemplate >
    <uc2:ucTest  ID="ucTest 1" runat="server" />
    </ContentTemplate>
    <Commands>
    <cc1:RadDockableObjectCommand AutoPostBack="True" Name ="TestTest"

    ToolTip ="xxx" Image="~/ViewReport.gif"/>
    <cc1:RadDockableObjectCommand Enabled="False" Name="Expand" ToolTip="Expand" />
    <cc1:RadDockableObjectCommand Enabled="False" Name="Collapse" ToolTip="Collapse" />
    </Commands> </cc1:RadDockableObject>

    thnx in advanc
    Asmaa
  6. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 17 Jun 2008 Link to this post

    Hello sam,

    Thank you for the provided code.

    I noticed that you are using RadDock for ASP.NET, not the RadDock for ASP.NET AJAX.

    The Image property should be set to the image's name, not to the corresponding URL. In order to achieve the desired behavior you should add your image (ViewReport.gif) to the folder RadControls\Dock\Skins\[Your_Skin_Name]\Img in your project.
     
    Let's assume that you use the default skin. In this case after you have added the image in the folder RadControls\Dock\Default\Img, you should modify your markup in the following manner:

    <cc1:RadDockingManager Skin="Default" ID="RadDockingManager1" runat="server" /> 
            <cc1:RadDockableObject  ID="TestObject" runat="server" Enabled="true" DockingMode="Dockable" 
                Behavior=" Pin, Collapse " Text="Test Obj" Width="200px" Height="100" > 
                <ContentTemplate> 
                </ContentTemplate> 
                <Commands> 
                    <cc1:RadDockableObjectCommand AutoPostBack="True" Name="TestTest" ToolTip="xxx" Image="ViewPort.gif" /> 
                    <cc1:RadDockableObjectCommand Enabled="False" Name="Expand" ToolTip="Expand" /> 
                    <cc1:RadDockableObjectCommand Enabled="False" Name="Collapse" ToolTip="Collapse" /> 
                </Commands> 
            </cc1:RadDockableObject> 


    All the best,
    Svetlina
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top