Silverlight vs WPF - Treeview with HierarchialDataTemplate

故事扮演 提交于 2020-01-04 15:17:27

问题


So, the following is easy enough in WPF, but how would you do it in Silverlight?

Please note that the trick here is to display both Groups, and Entries on the same level. Additonally you dont know how deep the entries are nested, they might be on the first, or the nth level. This is hard in Silverlight because you lack the DataType="{x:Type local:Group}" property in the H.DataTemplate (or any DataTemplate). Building my own custom DataTempalteSelector also didnt work, because the Hierarchial ItemsSource gets lost. (Which just gave me a new idea which I will investigate shortly)


Example:

Group1
--Entry
--Entry
Group2
--Group4
----Group1
------Entry
------Entry
----Entry
----Entry
--Entry
--Entry
Group3
--Entry
--Entry

Your Classes:

public class Entry
{
    public int Key { get; set; }
    public string Name { get; set; }
}

public class Group
{
    public int Key { get; set; }
    public string Name { get; set; }

    public IList<Group> SubGroups { get; set; }
    public IList<Entry> Entries { get; set; }
}

Your xaml:

   <TreeView Name="GroupView" Grid.Row="0" Grid.Column="0" ItemsSource="{Binding}">
        <TreeView.Resources>
            <HierarchicalDataTemplate DataType="{x:Type local:Group}" ItemsSource={Binding Items}">
                <TextBlock Text="{Binding Path=Name}" />
            </HierarchicalDataTemplate>
            <DataTemplate DataType="{x:Type local:Entry}" >
                <TextBlock Text="{Binding Path=Name}" />
            </DataTemplate>
        </TreeView.Resources>
    </TreeView>

回答1:


The TreeView control from the Silverlight toolkit supports hierarchical data templates.

Check out this article for sample usage, but it looks identical to me to the WPF built in one.

You can download the Silverlight toolkit here.




回答2:


Here is an example of using the HierarchicalDataTemplate with a HeaderedItemsControl in Silverlight (Songhay.Silverlight.BiggestBox.Views.ClientView.xaml):

<UserControl x:Class="Songhay.Silverlight.BiggestBox.Views.ClientView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"
    xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" 
    xmlns:sdk="clr-namespace:System.Windows;assembly=System.Windows.Controls"
    xmlns:sdkctrls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
    xmlns:uriMapper="clr-namespace:System.Windows.Navigation;assembly=System.Windows.Controls.Navigation"
    xmlns:v="clr-namespace:Songhay.Silverlight.BiggestBox.Views"
    xmlns:m="clr-namespace:Songhay.Silverlight.BiggestBox.ViewModels">
    <UserControl.Resources>

        <Style x:Key="StackPanelRoot" TargetType="StackPanel">
            <Setter Property="Background" Value="Seashell" />
            <Setter Property="Height" Value="598" />
            <Setter Property="Width" Value="1024" />
        </Style>

        <Style x:Key="GridRoot" TargetType="Grid">
            <Setter Property="Height" Value="570" />
        </Style>

        <Style x:Key="ClientGridSplitter" TargetType="sdkctrls:GridSplitter">
            <Setter Property="Background" Value="#FFE0EEE0" />
            <Setter Property="Height" Value="8" />
            <Setter Property="HorizontalAlignment" Value="Stretch" />
        </Style>

        <m:ClientViewModel x:Key="ClientViewModelDataSource" d:IsDataSource="True"/>

        <Style TargetType="sdkctrls:HeaderedItemsControl">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="sdkctrls:HeaderedItemsControl">
                        <StackPanel>
                            <ItemsPresenter Margin="10,0,0,0" />
                        </StackPanel>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="ScrollViewerIndexItems" TargetType="ScrollViewer">
            <Setter Property="Margin" Value="10" />
            <Setter Property="VerticalScrollBarVisibility" Value="Auto" />
        </Style>

        <Style x:Key="StackPanelIndexItems" TargetType="StackPanel">
            <Setter Property="Background" Value="#ff9" />
            <Setter Property="Orientation" Value="Horizontal" />
        </Style>

    </UserControl.Resources>

    <UserControl.DataContext>
        <Binding Source="{StaticResource ClientViewModelDataSource}"/>
    </UserControl.DataContext>

    <Border BorderBrush="Black" BorderThickness="1" VerticalAlignment="Center">
        <StackPanel x:Name="RootPanel" Style="{StaticResource StackPanelRoot}">
            <Grid Style="{StaticResource GridRoot}">
                <Grid.RowDefinitions>
                    <RowDefinition MinHeight="128" MaxHeight="360" Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="1.5*" />
                </Grid.RowDefinitions>
                <v:HeaderView Grid.Row="0" />
                <sdkctrls:GridSplitter Grid.Row="1" Style="{StaticResource ClientGridSplitter}" />
                <StackPanel Grid.Row="2"
                    Orientation="Horizontal"
                    Style="{StaticResource StackPanelIndexItems}">
                    <ScrollViewer Style="{StaticResource ScrollViewerIndexItems}">
                        <sdkctrls:HeaderedItemsControl
                            Header="{Binding IndexTitle}"
                            ItemsSource="{Binding Outlines}">
                            <sdkctrls:HeaderedItemsControl.HeaderTemplate>
                                <DataTemplate>
                                    <TextBlock FontSize="24" FontWeight="Bold" Text="{Binding}" />
                                </DataTemplate>
                            </sdkctrls:HeaderedItemsControl.HeaderTemplate>
                            <sdkctrls:HeaderedItemsControl.ItemTemplate>
                                <sdk:HierarchicalDataTemplate>
                                    <StackPanel>
                                        <TextBlock FontSize="12" FontWeight="Bold" Margin="0,10,0,0" Text="{Binding Text}" />
                                        <sdkctrls:HeaderedItemsControl ItemsSource="{Binding Outlines}" Margin="10,0,10,0">
                                            <sdkctrls:HeaderedItemsControl.ItemTemplate>
                                                <sdk:HierarchicalDataTemplate>
                                                    <HyperlinkButton
                                                        ClickMode="Press"
                                                        Command="{Binding IndexItemCommand, Source={StaticResource ClientViewModelDataSource}}"
                                                        CommandParameter="{Binding Url}"
                                                        FontSize="12">
                                                        <HyperlinkButton.Content>
                                                            <TextBlock Text="{Binding Text}" />
                                                        </HyperlinkButton.Content>
                                                    </HyperlinkButton>
                                                </sdk:HierarchicalDataTemplate>
                                            </sdkctrls:HeaderedItemsControl.ItemTemplate>
                                        </sdkctrls:HeaderedItemsControl>
                                    </StackPanel>
                                </sdk:HierarchicalDataTemplate>
                            </sdkctrls:HeaderedItemsControl.ItemTemplate>
                        </sdkctrls:HeaderedItemsControl>
                    </ScrollViewer>
                    <navigation:Frame x:Name="IndexFrame" Width="685">
                    </navigation:Frame>
                </StackPanel>
            </Grid>
            <v:FooterView Height="30" />
        </StackPanel>
    </Border>
</UserControl>


来源:https://stackoverflow.com/questions/4319358/silverlight-vs-wpf-treeview-with-hierarchialdatatemplate

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!