具有多个 TreeViewItemStyle 的 Silverlight 树视图答案

【问题标题】：Silverlight treeview with multiple TreeViewItemStyle具有多个 TreeViewItemStyle 的 Silverlight 树视图
【发布时间】：2012-05-09 01:51:16
【问题描述】：

取决于绑定的项目 - 我使用不同的数据模板来显示数据。现在我还需要修改树视图本身的行为/样式。是否可以根据对象属性切换项目的样式？现在只指定了一个：ItemContainerStyle="{StaticResource TreeViewItemStyleFolder}"

我想创建第二种样式TreeViewItemStyleDocument

当前 XAML（带有自定义样式和模板选择器）

<sdk:TreeView ItemsSource="{Binding Items}" 
                      Grid.Row="1" 
                      Style="{StaticResource TreeViewStyle1}" 
                      ItemContainerStyle="{StaticResource TreeViewItemStyleFolder}"
                      >
            <sdk:TreeView.ItemTemplate>
                <sdk:HierarchicalDataTemplate ItemsSource="{Binding SubItems}">
                    <DocumentManagement:DocumentTreeViewItemTemplateSelector 
                        Content="{Binding}">
                        <DocumentManagement:DocumentTreeViewItemTemplateSelector.FolderTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="24" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>

                                    <!-- FOLDER ICON AND CAPTION -->
                                    <Image Source="{Binding IconSource}" Width="24" Height="24" />
                                    <TextBlock VerticalAlignment="Center" HorizontalAlignment="Left" 
                                   Grid.Column="1" Margin="5,0"
                                   Text="{Binding Folder.FolderId}" FontSize="12" Foreground="#2C2C2C" />
                                </Grid>
                            </DataTemplate>
                        </DocumentManagement:DocumentTreeViewItemTemplateSelector.FolderTemplate>
                        <DocumentManagement:DocumentTreeViewItemTemplateSelector.DocumentTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="24" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>
                                    <StackPanel Grid.Column="1" Orientation="Horizontal">
                                        <TextBlock FontSize="10" Foreground="#2C2C2C">
                                            <Run Text="Added by" />
                                            <Run Text="{Binding Document.MEMUser.UserName}" />
                                            <Run Text=" on " />
                                            <Run Text="{Binding CreatedOn, Converter={StaticResource DateTimeToStringConverter}}" />
                                        </TextBlock>                                        
                                        <!--BIND COMMANDS TO PARENT ViewModel to process operations-->
                                        <Button Content="Delete" Command="{Binding DataContext.DeleteCommand, ElementName=LayoutRoot}" CommandParameter="{Binding}" />
                                        <Button Content="Download" Command="{Binding DataContext.DownloadCommand, ElementName=LayoutRoot}" CommandParameter="{Binding}" />
                                    </StackPanel>
                                </Grid>
                            </DataTemplate>
                        </DocumentManagement:DocumentTreeViewItemTemplateSelector.DocumentTemplate>
                    </DocumentManagement:DocumentTreeViewItemTemplateSelector>
                </sdk:HierarchicalDataTemplate>
            </sdk:TreeView.ItemTemplate>
        </sdk:TreeView>

编辑：

添加了基于属性切换 ItemContainerStyle 的触发器，但我认为问题在于我使用的是分层数据模板。如果我在 IsFolder 属性上放置断点 - 没有源对象。

<sdk:TreeView x:Name="DocumentsTreeView" ItemsSource="{Binding Items}" 
                      Grid.Row="1" 
                      Style="{StaticResource TreeViewStyleTransparent}">
<!--            ItemContainerStyle="{StaticResource TreeViewItemStyleFolders}"-->
            <i:Interaction.Triggers>
                <ei:DataTrigger Value="False" Binding="{Binding IsFolder}">
                    <ei:ChangePropertyAction TargetName="DocumentTreeView" PropertyName="ItemContainerStyle"                
                                             Value="{StaticResource TreeViewItemStyleFolders}" />
                </ei:DataTrigger>
                <ei:DataTrigger Value="True" Binding="{Binding IsFolder}">
                    <ei:ChangePropertyAction TargetName="DocumentTreeView" PropertyName="ItemContainerStyle" 
                                             Value="{StaticResource TreeViewItemStyleDocuments}" />
                </ei:DataTrigger>
            </i:Interaction.Triggers>
            <sdk:TreeView.ItemTemplate>
                <sdk:HierarchicalDataTemplate ItemsSource="{Binding SubItems}">

                    <DocumentManagement:DocumentTreeViewItemTemplateSelector 
                        Content="{Binding}">
                        <DocumentManagement:DocumentTreeViewItemTemplateSelector.FolderTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="24" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>

                                    <!-- FOLDER ICON AND CAPTION -->
                                    <Image Source="{Binding IconSource}" Width="24" Height="24" />
                                    <TextBlock VerticalAlignment="Center" HorizontalAlignment="Left" 
                                   Grid.Column="1" Margin="5,0"
                                   Text="{Binding Folder.FolderId}" FontSize="12" Foreground="#2C2C2C" />
                                </Grid>
                            </DataTemplate>
                        </DocumentManagement:DocumentTreeViewItemTemplateSelector.FolderTemplate>
                        <DocumentManagement:DocumentTreeViewItemTemplateSelector.DocumentTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="24" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>
                                    <StackPanel Grid.Column="1" Orientation="Horizontal">
                                        <TextBlock FontSize="10" Foreground="#2C2C2C">
                                            <Run Text="Added by" />
                                            <Run Text="{Binding Document.MEMUser.UserName}" />
                                            <Run Text="on" />
                                            <Run Text="{Binding Document.CreatedOn, Converter={StaticResource DateTimeToStringConverter}}" />
                                        </TextBlock>                                        
                                        <!--BIND COMMANDS TO PARENT ViewModel to process operations-->
                                        <Button Content="Delete" Command="{Binding DataContext.DeleteCommand, ElementName=LayoutRoot}" CommandParameter="{Binding}" />
                                        <Button Content="Download" Command="{Binding DataContext.DownloadCommand, ElementName=LayoutRoot}" CommandParameter="{Binding}" />
                                    </StackPanel>
                                </Grid>
                            </DataTemplate>
                        </DocumentManagement:DocumentTreeViewItemTemplateSelector.DocumentTemplate>
                    </DocumentManagement:DocumentTreeViewItemTemplateSelector>
                </sdk:HierarchicalDataTemplate>
            </sdk:TreeView.ItemTemplate>
        </sdk:TreeView>

【问题讨论】：

什么对象属性将决定样式模板的选择？根据您的描述，您可以设置一个触发器以将带有 targetname 的属性更改为您的树视图，并可能使用 changepropertyaction / datatrigger 即时翻转您的 ItemContainerStyle 但在我尝试提供一些代码之前想要更多信息。
假设它将是属性IsFolder，当它为true时应该触发一个模板，而false将是另一个模板。请记住，这是 Silverlight，而不是 WPF

标签： c# silverlight xaml styles

【解决方案1】：

如果我理解正确，您希望样式根据属性值动态更改，并且您希望在引用给定样式的页面上的每个项目上全局执行此操作？

如果是这种情况，我建议您查看 Expression Blend 中的情节提要和状态。我没有看到你在描述中提到混合。你在用吗？树视图有许多可以定制的项目，有些更难。上周我遇到了一个问题，即嵌套在树视图中的超链接无法有效地更改字体颜色。我可能会花更多时间在设计上，但我改变了设计意图。

根据我的安装，Silverlight 5 的 Blend 预览版在 2013 年 6 月之前是免费的。 http://www.microsoft.com/en-us/download/details.aspx?id=9503

祝你好运，

【讨论】：