windows WinUI3,禁用的TreeView无法呈现禁用了颜色画笔的项目?为什么?

lsmd5eda  于 2023-03-19  发布在  Windows
关注(0)|答案(1)|浏览(135)

我一直在试用WinUI 3 Gallery应用程序。在XAML中,我将TreeView的IsEnabled属性设置为False。例如,我将IsEnabled="False"添加到xaml中:https://github.com/microsoft/WinUI-Gallery/blob/1d61342cd0a646d8d56758048315b34ef42864bf/WinUIGallery/ControlPages/TreeViewPage.xaml#L46
我的期望是TreeViewItem将使用下面定义的TreeViewItemForegroundDisbled笔刷来呈现它们自己:https://github.com/microsoft/microsoft-ui-xaml/blob/8390ab44f93e643434059d45aefb29b2f7070a87/dev/TreeView/TreeView_themeresources.xaml#L22
TreeView控件确实被禁用了,因为它不响应鼠标或键盘。但是TreeViewItem的呈现没有改变。视觉外观保持不变,这在我看来会误导/混淆用户。我希望它像其他控件一样显示为禁用,如TextBox、Button等。
作为一种绝望的行为,我还尝试将TreeViewItem的IsEnabled属性绑定到父TreeViewIsEnabled属性,如下所示:

<TreeView x:Name="treeNodes" Grid.Column="0" Margin="8" 
                  IsEnabled="False"
                  ItemsSource="{x:Bind RootNodes}" SelectedItem ="{x:Bind SelectedNode, Mode=TwoWay}">
            <TreeView.ItemTemplate>
                <DataTemplate x:DataType="vm:ConfigNodeVM">
                    <TreeViewItem ItemsSource="{x:Bind Children}" Content="{x:Bind Name}" 
                                  IsEnabled="{Binding ElementName=treeNodes, Path=IsEnabled, Mode=OneWay}"/>
                </DataTemplate>
            </TreeView.ItemTemplate>
        </TreeView>

但那也没用。
为什么TreeNodeItem没有呈现为“禁用”状态?当TreeViewIsEnabled="False"处于禁用状态时,我可以做些什么来使它们呈现为禁用状态?
(and,作为奖励,我可以在microsoft-ui-xaml repo的WinUI源代码中读到什么,这将使我理解为什么禁用的画笔没有像我期望的那样使用?)
谢谢。

2g32fytz

2g32fytz1#

我认为这是TreeView控件的问题。将TreeViewItem的IsEnabled设置为false时,VisualState无法正确更新。作为解决方法,您可以调用VisualStateManger.GoToState(item, "Disabled", true)或使用以下内容重写TreeViewItem的模板:

<Style TargetType="TreeViewItem" BasedOn="{StaticResource DefaultListViewItemStyle}">
    <Setter Property="Padding" Value="0" />
    <Setter Property="Background" Value="{ThemeResource TreeViewItemBackground}" />
    <Setter Property="BorderBrush" Value="{ThemeResource TreeViewItemBorderBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource TreeViewItemBorderThemeThickness}" />
    <Setter Property="GlyphBrush" Value="{ThemeResource TreeViewItemForeground}" />
    <Setter Property="MinHeight" Value="{ThemeResource TreeViewItemMinHeight}" />
    <Setter Property="CornerRadius" Value="{ThemeResource ControlCornerRadius}" />
    <Setter Property="FocusVisualMargin" Value="0,-1,0,-1" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TreeViewItem">
                <Grid x:Name="ContentPresenterGrid" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Margin="{ThemeResource TreeViewItemPresenterMargin}" Padding="{ThemeResource TreeViewItemPresenterPadding}" CornerRadius="{TemplateBinding CornerRadius}">

                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="FocusedStates">
                            <VisualState x:Name="PointerFocused"/>
                            <VisualState x:Name="Focused"/>
                            <VisualState x:Name="Unfocused"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="MultiSelectStates">
                            <VisualState x:Name="MultiSelectEnabled"/>
                            <VisualState x:Name="MultiSelectDisabled"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="SelectionIndicatorState">
                            <VisualState x:Name="SelectionIndicatorEnabled" />
                            <VisualState x:Name="SelectionIndicatorDisabled" />
                        </VisualStateGroup>

                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />

                            <VisualState x:Name="PointerOver">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundPointerOver}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundPointerOver}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForegroundPointerOver}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundPointerOver}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundPointerOver}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushPointerOver}" />
                                    <Setter Target="SelectionIndicator.Opacity" Value="0" />

                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="Pressed">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundPressed}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundPressed}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForegroundPressed}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundPressed}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundPressed}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushPressed}" />
                                    <Setter Target="SelectionIndicator.Opacity" Value="0" />

                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundSelected}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundSelected}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForeground}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelected}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelected}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushSelected}" />
                                    <Setter Target="SelectionIndicator.Opacity" Value="1" />

                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="Disabled">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundDisabled}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundDisabled}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForegroundDisabled}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundDisabled}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundDisabled}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushDisabled}" />

                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="PointerOverSelected">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundSelectedPointerOver}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedPointerOver}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForegroundPointerOver}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedPointerOver}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedPointerOver}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushSelectedPointerOver}" />
                                    <Setter Target="SelectionIndicator.Opacity" Value="1" />

                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="PressedSelected">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundSelectedPressed}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedPressed}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForegroundPressed}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedPressed}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedPressed}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushSelectedPressed}" />
                                    <Setter Target="SelectionIndicator.Opacity" Value="1" />

                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="SelectedDisabled">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenterGrid.Background" Value="{ThemeResource TreeViewItemBackgroundSelectedDisabled}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedDisabled}" />
                                    <Setter Target="SelectionIndicator.Fill" Value="{ThemeResource TreeViewItemSelectionIndicatorForegroundDisabled}" />
                                    <Setter Target="CollapsedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedDisabled}" />
                                    <Setter Target="ExpandedGlyph.Foreground" Value="{ThemeResource TreeViewItemForegroundSelectedDisabled}" />
                                    <Setter Target="ContentPresenterGrid.BorderBrush" Value="{ThemeResource TreeViewItemBorderBrushSelectedDisabled}" />
                                    <Setter Target="SelectionIndicator.Opacity" Value="1" />

                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="ReorderedPlaceholder">

                                <Storyboard>
                                    <FadeOutThemeAnimation TargetName="MultiSelectGrid" />
                                </Storyboard>
                            </VisualState>

                        </VisualStateGroup>
                        <VisualStateGroup x:Name="TreeViewMultiSelectStates">
                            <VisualState x:Name="TreeViewMultiSelectDisabled" />
                            <VisualState x:Name="TreeViewMultiSelectEnabledUnselected">
                                <VisualState.Setters>
                                    <Setter Target="MultiSelectCheckBox.Visibility" Value="Visible" />
                                    <Setter Target="ExpandCollapseChevron.Padding" Value="0,0,14,0" />
                                    <Setter Target="ContentPresenterGrid.Padding" Value="0" />

                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="TreeViewMultiSelectEnabledSelected">
                                <VisualState.Setters>
                                    <Setter Target="MultiSelectCheckBox.Visibility" Value="Visible" />
                                    <Setter Target="MultiSelectGrid.Background" Value="{ThemeResource TreeViewItemBackgroundSelected}" />
                                    <Setter Target="MultiSelectGrid.BorderBrush" Value="{ThemeResource TreeViewItemMultiSelectBorderBrushSelected}" />
                                    <Setter Target="ExpandCollapseChevron.Padding" Value="0,0,14,0" />
                                    <Setter Target="ContentPresenterGrid.Padding" Value="0" />

                                </VisualState.Setters>
                            </VisualState>

                        </VisualStateGroup>

                        <VisualStateGroup x:Name="DragStates">
                            <VisualState x:Name="NotDragging" />

                            <VisualState x:Name="MultipleDraggingPrimary">
                                <VisualState.Setters>
                                    <Setter Target="MultiSelectCheckBox.Opacity" Value="0" />
                                    <Setter Target="MultiArrangeOverlayTextBorder.Visibility" Value="Visible" />

                                </VisualState.Setters>
                            </VisualState>

                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>
                    <Rectangle x:Name="SelectionIndicator" Width="3" Height="16" Fill="{ThemeResource TreeViewItemSelectionIndicatorForeground}" Opacity="0" HorizontalAlignment="Left" VerticalAlignment="Center" RadiusX="2" RadiusY="2" />
                    <Grid x:Name="MultiSelectGrid" Margin="{ThemeResource TreeViewItemMultiSelectSelectedItemBorderMargin}" Padding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TreeViewItemTemplateSettings.Indentation}" BorderBrush="Transparent" BorderThickness="{ThemeResource TreeViewItemBorderThemeThickness}" CornerRadius="{ThemeResource ControlCornerRadius}">

                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <Grid Grid.Column="0">
                            <CheckBox x:Name="MultiSelectCheckBox" Width="32" MinWidth="32" MinHeight="{ThemeResource TreeViewItemMultiSelectCheckBoxMinHeight}" Margin="10,0,0,0" VerticalAlignment="Center" Visibility="Collapsed" IsTabStop="False" AutomationProperties.AccessibilityView="Raw" />
                            <Border x:Name="MultiArrangeOverlayTextBorder" Visibility="Collapsed" IsHitTestVisible="False" MinWidth="20" Height="20" VerticalAlignment="Center" HorizontalAlignment="Center" Background="{ThemeResource SystemControlBackgroundAccentBrush}" BorderThickness="1" BorderBrush="{ThemeResource SystemControlBackgroundChromeWhiteBrush}" CornerRadius="{ThemeResource ControlCornerRadius}">
                                <TextBlock x:Name="MultiArrangeOverlayText" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TreeViewItemTemplateSettings.DragItemsCount}" Style="{ThemeResource CaptionTextBlockStyle}" Foreground="{ThemeResource SystemControlForegroundChromeWhiteBrush}" IsHitTestVisible="False" VerticalAlignment="Center" HorizontalAlignment="Center" AutomationProperties.AccessibilityView="Raw" />
                            </Border>
                        </Grid>
                        <Grid x:Name="ExpandCollapseChevron" Grid.Column="1" Padding="14,0" Width="Auto" Opacity="{TemplateBinding GlyphOpacity}" Background="Transparent">
                            <TextBlock x:Name="CollapsedGlyph" Foreground="{TemplateBinding GlyphBrush}" Width="12" Height="12" Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TreeViewItemTemplateSettings.CollapsedGlyphVisibility}" FontSize="{TemplateBinding GlyphSize}" Text="{TemplateBinding CollapsedGlyph}" FontFamily="{StaticResource SymbolThemeFontFamily}" Padding="2" VerticalAlignment="Center" AutomationProperties.AccessibilityView="Raw" IsTextScaleFactorEnabled="False" IsHitTestVisible="False" />
                            <TextBlock x:Name="ExpandedGlyph" Foreground="{TemplateBinding GlyphBrush}" Width="12" Height="12" Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TreeViewItemTemplateSettings.ExpandedGlyphVisibility}" FontSize="{TemplateBinding GlyphSize}" Text="{TemplateBinding ExpandedGlyph}" FontFamily="{StaticResource SymbolThemeFontFamily}" Padding="2" VerticalAlignment="Center" AutomationProperties.AccessibilityView="Raw" IsTextScaleFactorEnabled="False" IsHitTestVisible="False" />
                        </Grid>
                        <ContentPresenter x:Name="ContentPresenter" Grid.Column="2" ContentTransitions="{TemplateBinding ContentTransitions}" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" MinHeight="{ThemeResource TreeViewItemContentHeight}" Margin="{TemplateBinding Padding}" />

                    </Grid>

                </Grid>

            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

相关问题