Click here to Skip to main content
15,891,905 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I have a treeview with two root nodes. The first node item is designed in my XAMl code and the second node items are loaded from the database. I changed little bit in default template by adding images for the arrow icon and also i added a class in my C#.
Now my problem is my template works for the icons in the first node, but not working for the second node.

What I have tried:

My code in Xaml :
HTML
<pre><Window.Resources>
        <i:TreeViewLineConverter x:Key="myconvert" />
        <Style x:Key="ExpandCollapseToggleStyle" TargetType="ToggleButton">
            <Setter Property="Focusable" Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Image x:Name="image" Source="images/arrowcollapse.png" />
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="true">
                                <Setter TargetName="image" Property="Source" Value="images/arrowexpand.png" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- TreeViewItem -->
        <Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Padding" Value="1,0,0,0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TreeViewItem}">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition MinWidth="19" Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>

                            <!-- Connecting Lines -->
                            <Rectangle x:Name="HorLn" Margin="9,1,0,0" Height="1" Stroke="#DCDCDC" SnapsToDevicePixels="True"/>
                            <Rectangle x:Name="VerLn" Width="1" Stroke="#DCDCDC" Margin="0,0,1,0" Grid.RowSpan="2" SnapsToDevicePixels="true" Fill="White"/>
                            <ToggleButton Margin="-1,0,0,0" x:Name="Expander" Style="{DynamicResource ExpandCollapseToggleStyle}" IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/>
                            <Border Name="Bd" Grid.Column="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="True">
                                <ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" MinWidth="20"/>
                            </Border>
                            <ItemsPresenter x:Name="ItemsHost" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"/>
                        </Grid>
                        <ControlTemplate.Triggers>

                           
                            <Trigger Property="IsExpanded" Value="false">
                                <Setter TargetName="ItemsHost" Property="Visibility" Value="Collapsed"/>
                            </Trigger>
                            <Trigger Property="HasItems" Value="false">
                                <Setter TargetName="Expander" Property="Visibility" Value="Hidden"/>
                            </Trigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="HasHeader" Value="false"/>
                                    <Condition Property="Width" Value="Auto"/>
                                </MultiTrigger.Conditions>
                                <Setter TargetName="PART_Header" Property="MinWidth" Value="75"/>
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="HasHeader" Value="false"/>
                                    <Condition Property="Height" Value="Auto"/>
                                </MultiTrigger.Conditions>
                                <Setter TargetName="PART_Header" Property="MinHeight" Value="19"/>
                            </MultiTrigger>
                            <Trigger Property="IsSelected" Value="true">
                                <Setter TargetName="Bd" Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                            </Trigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true"/>
                                    <Condition Property="IsSelectionActive" Value="false"/>
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="Green"/>
                                <Setter Property="Foreground" Value="White"/>
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>


    </Window.Resources>
    <Grid>
        <TreeView x:Name="mytreeview" >
            <TreeViewItem Header="Drinks">
                <TreeViewItem Header="Coffee">
                    <TreeViewItem Header="Cappucino"/>
                    <TreeViewItem Header="Black Coffee"/>
                    <TreeViewItem Header="Latte"/>
                </TreeViewItem>
                <TreeViewItem Header="Tea">
                    <TreeViewItem Header="Ginger"/>
                    <TreeViewItem Header="Lemon"/>
                    <TreeViewItem Header="Mint"/>
                </TreeViewItem>
            </TreeViewItem>
        </TreeView>
    </Grid>

My Code in C#
<pre lang="c#"><pre lang="c#"> 
class TreeViewLineConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            TreeViewItem item = (TreeViewItem)value;
            ItemsControl ic = ItemsControl.ItemsControlFromItemContainer(item);
            return ic.ItemContainerGenerator.IndexFromContainer(item) == ic.Items.Count - 1;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            return false;
        }
    }
Posted
Updated 14-Mar-19 8:52am
v3
Comments
[no name] 13-Mar-19 10:18am    
There's the "default" template and "your" template. Why don't you tell us which part you changed?
Priya Karthish 13-Mar-19 10:37am    
I think this will draw an arrow. Am I right or wrong?
<path x:name="CollapsedArrow" horizontalalignment="Center" verticalalignment="Center" data="M 0 0 L 4 4 L 8 0 Z">
<path.fill>
<solidcolorbrush color="DarkGreen">


<path x:name="ExpandedArrow" horizontalalignment="Center" verticalalignment="Center" visibility="Collapsed" data="M 0 4 L 4 0 L 8 4 Z">
<path.fill>
<solidcolorbrush color="DarkGreen">

Priya Karthish 13-Mar-19 15:57pm    
Can Someone help in this issue. Default template is not changing the triangle icon
Graeme_Grant 13-Mar-19 20:15pm    
I'm not understanding the problem that you're having. Have you checked the default template that works?

TreeView Styles and Templates | Microsoft Docs[^]

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900