1

I have a TreeView in my XAML, each element of which is a StackPanel which allows each element to have an image and some text. They are orientated one atop the other as you can see here.

What I would like, and this may not be possible with a TreeView, is for the items (in this case 'FamilyMember') to appear horizontally rather than vertically. So, for example, you click the drop down for the family - you don't see them in a vertical list but in a horizontal one.

The XAML is as follows:

<TreeView Name="trvFamilies">
        <TreeView.Resources>
            <HierarchicalDataTemplate DataType="{x:Type self:Family}" ItemsSource="{Binding Members}">
                <StackPanel Orientation="Horizontal">
                    <Image Source="{StaticResource ImageGroup}" Margin="0,0,5,0" />
                    <TextBlock Text="{Binding Name}" />
                    <TextBlock Text=" [" Foreground="Blue" />
                    <TextBlock Text="{Binding Members.Count}" Foreground="Blue" />
                    <TextBlock Text="]" Foreground="Blue" />
                </StackPanel>
            </HierarchicalDataTemplate>
            <DataTemplate DataType="{x:Type self:FamilyMember}">

                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}" />
                    <TextBlock Text=" (" Foreground="Green" />
                    <TextBlock Text="{Binding Age}" Foreground="Green" />
                    <TextBlock Text=" years)" Foreground="Green" />
                </StackPanel>
            </DataTemplate>
        </TreeView.Resources>
    </TreeView>

Any attempts made within the DataTemplate element only apply to each of the vertically aligned elements.

Maybe my efforts are on the wrong track if this is my goal. If so, if an alternative panel or control is better than I will gladly use it.

Thanks!

TheFaithfulLearner
  • 673
  • 8
  • 31
  • Did you try Grid with column definitions for FamilyMember template? – Siva Gopal Feb 26 '17 at 18:22
  • You can't accomplish this by simply modifying the DataTemplate. You will need to modify the template of the TreeViewItem. Please refer to the following page for more information: http://stackoverflow.com/questions/364083/wpf-treeview-with-horizontal-orientation. – mm8 Feb 26 '17 at 18:28
  • Rotate the Stackpanel's with a layout transform either 90 or -90. – Michael Puckett II Feb 27 '17 at 21:10

0 Answers0