Unable to set RadTreeViewItem's expander style to a StaticResource?

9 posts, 2 answers
  1. Yanming
    Yanming avatar
    5 posts
    Member since:
    Feb 2014

    Posted 09 Feb 2014 Link to this post

    I learned how to set a RadTreeViewItem's expander style dynamically by WPF data binding, see the link below.
    http://blogs.telerik.com/blogs/11-01-17/controlling-treeview-s-expanderstyle-dynamically.aspx

    However, if I change ExpanderStyle to StaticResource, it doesn't work. (But it works for RadTreeView)
    <Style x:Key="ContainerStyle" TargetType="telerik:RadTreeViewItem">
        <Style.Setters>
            <!--<Setter Property="ExpanderStyle" Value="{Binding MyCustomExpanderStyle, Mode=TwoWay}"/>-->
            <Setter Property="ExpanderStyle" Value="{StaticResource ExpanderStyle_3}" />
        </Style.Setters>
    </Style>

    ​What's interesting is when I click "Clear Local Item Style", the style is applied.

    How can I set an item's expander style to static resource just like the tree view?
  2. Boris
    Admin
    Boris avatar
    276 posts

    Posted 11 Feb 2014 Link to this post

    Hello Yanming,

    In the WPF project in the article that Hristo Milyakov wrote he used an MVVM approach with a ViewModel(class SampleViewModel) which inherits an ObservableCollection with business objects (class BusinessItem) defined in it. In the class BusinessItem there is a MyCustomExpanderStyle property which is of type Style and it notifies the UI when it is changed. The style changes thanks to the binding of that property in MainWindow.xaml file and the INotifyPropertyChanged interface. In order to change the styles at run time, you also could use binding to the same property like it's shown in the WPF project in the blog post.

    On the other hand, I am not sure that I fully understand what you mean by saying: "But it works for RadTreeView". Could you please elaborate more on that?

    I'm looking forward to your response.

    Regards,
    Boris Penev
    Telerik

    Check out the new Telerik Platform - the only modular platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native apps. Register for the free online keynote and webinar to learn more about the Platform on Wednesday, February 12, 2014 at 11:00 a.m. ET (8:00 a.m. PT).

  3. UI for WPF is Visual Studio 2017 Ready
  4. Yanming
    Yanming avatar
    5 posts
    Member since:
    Feb 2014

    Posted 14 Feb 2014 in reply to Boris Link to this post

    Hi Boris,

    Thank you for your reply. Let me explain my problem more precisely.

    "It works for RadTreeView" means the ExpanderStyle property take effect for a RadTreeView. Take Hristo's code as an example, if I write the code below, myTreeView's expander will have the style "ExpanderStyle_1".
    <telerik:RadTreeView x:Name="myTreeView" Width="250" BorderThickness="1" BorderBrush="#FF989898"
                         ItemTemplate="{StaticResource ItemsTemplate}"
                         ExpanderStyle="{StaticResource ExpanderStyle_1}"
                         IsVirtualizing="True" />

    But when I tried to set ExpanderStyle for RadTreeViewItem like below, no expander style is applied.
    <telerik:RadTreeView x:Name="myTreeView" Width="250" BorderThickness="1" BorderBrush="#FF989898"
                            IsVirtualizing="True" >
        <telerik:RadTreeViewItem Header="Sport Categories" ExpanderStyle="{StaticResource ExpanderStyle_1}">
            <telerik:RadTreeViewItem Header="Football">
                <telerik:RadTreeViewItem Header="Futsal"/>
                <telerik:RadTreeViewItem Header="Soccer"/>
            </telerik:RadTreeViewItem>
        </telerik:RadTreeViewItem>
    </telerik:RadTreeView>

    Hristo's code work well through data binding. But I just want to apply the style at compile time.
    My initial objective is to hide the expand icon for root item (root item should be expanded by default), but preserve the icon for child items.
  5. Answer
    Boris
    Admin
    Boris avatar
    276 posts

    Posted 18 Feb 2014 Link to this post

    Hello Yanming,

    The ExpanderStyle_1 style isn't applying because you are setting the IsVirtualizing property of the RadTreeView to "True" while you aren't in a data bound scenario. If you remove this property the code snippet you posted should work and apply the style.

    More info about UI Virtualization  in RadTreeView you can find in these support resources:

    Please let us know if this helps you.

    Regards,
    Boris Penev
    Telerik
  6. Yanming
    Yanming avatar
    5 posts
    Member since:
    Feb 2014

    Posted 19 Feb 2014 in reply to Boris Link to this post

    Hi Boris,

    Removing the IsVirtualizing property exactly solved my problem!

    However, I found even I was in data bound scenario, expander style can't be applied to RadTreeViewItem if IsVirtualizing is set to True.
    So it seems to me that if I want to apply expander style for RadTreeViewItem by StaticResource, I can't utilize the Virtualization feature of RadTreeView?
  7. Boris
    Admin
    Boris avatar
    276 posts

    Posted 21 Feb 2014 Link to this post

    Hello Yanming,

    You can use the Virtualization feature of the RadTreeView in a data-bound scenario and apply the ExpanderStyle as StaticResource. If we use Hristo Milyakov's WPF example, which is using virtualization and applying the ExpanderStyles runtime we can change it to apply one of the ExpanderStyles by commenting the unnecessary code and doing something like this:

    <telerik:RadTreeView x:Name="myTreeView" Width="250" BorderThickness="1" BorderBrush="#FF989898"
                                 ItemTemplate="{StaticResource ItemsTemplate}"
                                 IsVirtualizing="True"
                                 ExpanderStyle="{StaticResource ExpanderStyle_3}"
                                 />
    And by doing so we are using a StaticResource which will be applied to all RadTreeViewItems on load. 

    I hope this helps.

    Regards,
    Boris Penev
    Telerik
  8. Yanming
    Yanming avatar
    5 posts
    Member since:
    Feb 2014

    Posted 22 Feb 2014 in reply to Boris Link to this post

    Hi Boris,

    I know ExpanderStyle can be applied to RadTreeView, but I want to apply it to RadTreeViewItem.
    Again take the WPF example. I define the ItemsTemplate as below.
    <Style x:Key="ContainerStyle" TargetType="telerik:RadTreeViewItem">
        <Style.Setters>
            <!--Successfully apply ExpanderStyle through data binding-->
            <!--<Setter Property="ExpanderStyle" Value="{Binding MyCustomExpanderStyle, Mode=TwoWay}"/>-->
     
            <!--Failed to apply this style by StaticResource-->
            <Setter Property="ExpanderStyle" Value="{StaticResource ExpanderStyle_3}" />
        </Style.Setters>
    </Style>
     
    <HierarchicalDataTemplate x:Key="ItemsTemplate" ItemsSource="{Binding Items}" ItemContainerStyle="{StaticResource ContainerStyle}">
        <TextBlock Text="{Binding Name}"/>
    </HierarchicalDataTemplate>

    As I commented, data binding works well, but ExpanderStyle_3 can't be applied as StaticResource, unless I set IsVitrualizing property as false.
    Can you tell me why ExpanderStyle's behavior is not consistent on RadTreeView and RadTreeViewItem?
  9. Answer
    Boris
    Admin
    Boris avatar
    276 posts

    Posted 26 Feb 2014 Link to this post

    Hello Yanming,

    It seams that we have misunderstood at first what you had in mind. We reviewed the RadTreeView control and we can confirm that the reported behavior is actually a bug. We logged it in our feedback portal where you can track its status. We also updated your telerik account points as a thanks for your cooperation in reporting this issue. 

    However, there is a possible workaround which you can examine in the attached project. In it we bind the ExpanderStyle property of every RadTreeViewItem and use a Converter - the ModelToExpanderStyleConverter which selects the correct ExpanderStyle based on the type of the ViewModel for the particular RadTreeViewItem.
    <Style TargetType="telerik:RadTreeViewItem" >           
               <Setter Property="ExpanderStyle" Value="{Binding Converter={StaticResource converter}}" />
               <Setter Property="IsExpanded" Value="True" />
           </Style>
    public class ModelToExpanderStyleConverter : IValueConverter
       {
           public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
           {
               if (value is League)
               {
                   return this.leagueStyle;
               }
               else if (value is Division)
               {
                   return this.divisionStyle;
    ....

    Could you please check out the workaround and let us if it is viable for your scenario?

    Regards,
    Boris Penev
    Telerik
  10. Yanming
    Yanming avatar
    5 posts
    Member since:
    Feb 2014

    Posted 27 Feb 2014 in reply to Boris Link to this post

    Hi Boris,

    We can apply this workaround in our project.
    The example is so detailed, I really appreciate your work!
Back to Top
UI for WPF is Visual Studio 2017 Ready