Стилизация дерева, содержащего несколько типов, на основе данных модели представления - PullRequest
Новая
       10

Стилизация дерева, содержащего несколько типов, на основе данных модели представления

0 голосов
/ 27 сентября 2018

У меня есть дерево, содержащее несколько разных типов предметов.Я дошел до того, что у меня есть отдельные модели просмотра для каждого типа и элементы, отображаемые в моем дереве.У меня есть общий TreeView.ItemContainerStyle, который выполняет основы привязки IsSelected и IsExpanded, а также устанавливает выделенный элемент в полужирный.), как я могу стилизовать текст в зависимости от данных из связанной ViewModel.

Чтобы попытаться объяснить лучше, вот основы моего дерева, которое в основном имеет иерархию Program |Задача |Бюджет: 

<TreeView ItemsSource="{Binding RootNodes}">
            <TreeView.ItemContainerStyle>
                <!--  This Style binds a TreeViewItem to a TreeViewItemViewModel.  -->
                <Style TargetType="{x:Type TreeViewItem}">
                    <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
                    <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
                    <Setter Property="FontWeight" Value="Normal" />
                    <Style.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="FontWeight" Value="Bold" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </TreeView.ItemContainerStyle>
            <TreeView.Resources>
                <HierarchicalDataTemplate DataType="{x:Type applayer:ProgrammeTreeViewModel}" ItemsSource="{Binding Children}" >
                    <StackPanel Orientation="Horizontal">
                        <!--Image Width="16" Height="16" Margin="3,0" Source="Images\Programme.png" / -->
                        <TextBlock Text="{Binding Programme.ProgrammeName}" />
                    </StackPanel>
                </HierarchicalDataTemplate>

                <HierarchicalDataTemplate DataType="{x:Type applayer:TaskTreeViewModel}" ItemsSource="{Binding Children}" >
                    <StackPanel Orientation="Horizontal">
                        <!--Image Width="16" Height="16" Margin="3,0" Source="Images\Task.png" / -->
                        <TextBlock Text="{Binding Task.Description}" />
                    </StackPanel>
                </HierarchicalDataTemplate>

                <DataTemplate DataType="{x:Type applayer:BudgetSummaryTreeViewModel}">
                    <StackPanel Orientation="Horizontal">
                        <!--Image Width="16" Height="16" Margin="3,0" Source="Images\Budget.png" / -->
                        <TextBlock Text="{Binding Budget.Description}" />
                    </StackPanel>
                </DataTemplate>
            </TreeView.Resources>
        </TreeView>

Теперь, например, я пытаюсь сделать следующее: Для элемента Program, если свойство ProgrammeTreeViewModel IsStarted имеет значение true, установите текст в зеленый, если IsLate равно true, установите для текста значениекрасный (в приоритете над IsStarted зеленым).

Тем не менее, для Задачи совершенно отдельно, если для свойства TaskTreeViewModel PeopleAssigned задано значение true, для текста задается зеленый или для значения false устанавливается красный.

Точно так же я хочу использовать различные атрибуты Budget ViewModel для стилизации записей buget.

Все это, сохраняя при этом общее выделение, если оно выбрано.

Я уверен, что я уверенблизко, и я уверен, что это должно быть относительно легко - я только что экспериментировал с каждым из HeirarchicalDataTemplates, но пока не радуюсь.

Любая помощь очень ценится!

1 Ответ

0 голосов
/ 28 сентября 2018

Как сказано в комментариях к вопросу @Aybe, просто используйте для этого триггер.

Это будет выглядеть примерно так: 

<HierarchicalDataTemplate DataType="{x:Type applayer:ProgrammeTreeViewModel}" ItemsSource="{Binding Children}" >
    <StackPanel Orientation="Horizontal">
        <!--Image Width="16" Height="16" Margin="3,0" Source="Images\Programme.png" / -->
        <TextBlock x:Name="myText" Text="{Binding Programme.ProgrammeName}" />
    </StackPanel>
    <HierarchicalDataTemplate.Triggers>
        <DataTrigger Binding="{Binding IsStarted}" Value="True">
            <Setter TargetName="myText" Property="Foreground" Value="Green" />
        </DataTrigger>
        <DataTrigger Binding="{Binding IsLate}" Value="True">
            <Setter TargetName="myText" Property="Foreground" Value="Red" />
        </DataTrigger>
    </HierarchicalDataTemplate.Triggers>
</HierarchicalDataTemplate>

Если оба значения IsStarted и IsLateверно, тогда оба будут выполняться.Сначала будет применен установщик для IsStarted, затем установщик для IsLate.Это важно иметь в виду, потому что если вы применяете несколько сеттеров в предыдущем триггере, вы получите смешанный результат.Чтобы справиться с этим, вы, вероятно, будете использовать MultiDataTrigger.

...