RadPanelBar

7 posts, 0 answers
  1. Vicki
    Vicki avatar
    3 posts
    Member since:
    Oct 2012

    Posted 29 Oct 2012 Link to this post

    I would like to change custom style for RadpanelBar to display the arrow on the left instead of on the right side.
    How can I customize it?  Also, when the row is expanded, the arrow will display differently.

  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 01 Nov 2012 Link to this post

    Hello Vicki,

    In order to implement your requirements, you need to edit the default ControlTemplate of the RadPanelBarItem. In it you can reorganize the elements positions and place the arrow element at most-left part of the control. Also, you can edit the VIsualStates to implement the expanded state change in the arrow.

    I attached a sample solution to demonstrate how to move the arrow at the left of the RadPanelBarItem control. I hope the project will be a good starting point for you.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. UI for WPF is Visual Studio 2017 Ready
  4. Vicki
    Vicki avatar
    3 posts
    Member since:
    Oct 2012

    Posted 01 Nov 2012 Link to this post

    Thank you very much for the response.

    I have the following questions:

    1. Did you update the RadPanelBarItem style in Expression Blend?  

    2. I assume the answer for the question #1 is yes.
    When I am in the Expression Blend, how can I update the style for RadPanelBarItem?
    Should I choose Object -> Edit Style?  or Edit Template?  or Edit Additional Template?
    Under Edit Additional Template, there are 6 different options that I can choose from.
    It will be helpful that you can show/describe to me how did you do it.

    Thanks again,
    Vicki
  5. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 01 Nov 2012 Link to this post

    Hello Vicki,

    Yes, you're right, I did edit the style of the control in Blend. You can take a look at this article for more informaiton on how to edit the RadControls ControlTemplates in Blend.

    Basically, you can choose Edit Style to edit the style resources of the control. After clicking 'OK', Expression Blend will generate the default style of the RadPanelBarItem control in the Resources section of your Window (or in a separate ResourceDictionary - based on your choice in the Edit Style dialog window). The properties available for the style will be loaded in the 'Properties' pane and you will be able to modify their default values.

    You can modify these properties to achieve the desired appearance. However most of the visual parts of the RadPanelBarItem have to be styled in its template. To modify it, select the style in the 'Objects and Timeline' pane, right-click on it and choose Edit Template -> Edit Current. In the same pane the element parts for the RadPanelBarItem 's template will get loaded.

    Choosing Object->Eidt Template will generate the style and the template toghether and will load the the element parts for the RadPanelBarItem 's template in the 'Objects and Timeline' pane.

    Object->Edit Additional Styles/Templates allows you to edit additional styles/templates exposed by the RadPanelBarItem class but in this case, you don't have to use any of the options provided in that list.

    I hope this information helps.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  6. Ram
    Ram avatar
    20 posts
    Member since:
    Nov 2014

    Posted 16 Dec 2014 in reply to Tina Stancheva Link to this post

    Hi,

    I created the style in the App.xaml as described above using blend. Without any modification I get an error after clicking the header to expand -

    'directionRotation' name cannot be found in the name scope of 'System.Windows.Controls.Grid'. Please advise.

    Thanks
  7. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 19 Dec 2014 Link to this post

    Hello Ram,

    We already answered this question in this forum thread.

    Regards,
    Petar Mladenov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  8. Ram
    Ram avatar
    20 posts
    Member since:
    Nov 2014

    Posted 19 Dec 2014 in reply to Petar Mladenov Link to this post

    Thanks for helping in fixing the arrow position

    But now Telerik themes cannot be applied after extracting the style. I have provided the screenshot with "Expression_Dark" theme and a sample xaml in the same forum.

    Thanks
Back to Top
UI for WPF is Visual Studio 2017 Ready