我想在我的应用中向我的数据透视表标题添加一些显示突出显示。但是我没有到达那里
以下是我的Pivot风格
<Style x:Key="PivotStyle1" TargetType="Pivot">
<Setter Property="Margin" Value="0"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Background" Value="{ThemeResource PivotBackground}"/>
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<Grid/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Pivot">
<Grid x:Name="RootElement" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
<Grid.Resources>
<Style x:Key="BaseContentControlStyle" TargetType="ContentControl">
<Setter Property="FontFamily" Value="Segoe UI"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="FontSize" Value="{ThemeResource PivotHeaderItemFontSize}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ContentControl">
<ContentPresenter Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Margin="{TemplateBinding Padding}"
ContentTransitions="{TemplateBinding ContentTransitions}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
OpticalMarginAlignment="TrimSideBearings"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="TitleContentControlStyle" TargetType="ContentControl" >
<Setter Property="FontWeight" Value="SemiLight"/>
<Setter Property="FontSize" Value="{ThemeResource PivotHeaderItemFontSize}"/>
</Style>
<Style TargetType="PivotHeaderItem">
<Setter Property="FontSize" Value="{ThemeResource PivotHeaderItemFontSize}" />
<Setter Property="FontFamily" Value="{ThemeResource PivotHeaderItemFontFamily}" />
<Setter Property="CharacterSpacing" Value="{ThemeResource PivotHeaderItemCharacterSpacing}" />
<Setter Property="Background" Value="Transparent" />
<Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseMediumHighBrush}" />
<Setter Property="Margin" Value="{ThemeResource PivotHeaderItemMargin}" />
<Setter Property="Height" Value="32" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="BorderBrush" Value="PaleGreen" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="PivotHeaderItem">
<Border x:Name="Grid"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="2,2,2,2"
Padding="16,0,16,0"
Margin="0"
>
<Border.Resources>
<Style x:Key="BaseContentPresenterStyle" TargetType="ContentPresenter">
<Setter Property="FontFamily" Value="Segoe UI"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="FontSize" Value="{ThemeResource PivotHeaderItemFontSize}"/>
<Setter Property="TextWrapping" Value="Wrap"/>
<Setter Property="LineStackingStrategy" Value="MaxHeight"/>
<Setter Property="TextLineBounds" Value="Full"/>
<Setter Property="OpticalMarginAlignment" Value="TrimSideBearings"/>
</Style>
<Style x:Key="BodyContentPresenterStyle" TargetType="ContentPresenter" BasedOn="{StaticResource BaseContentPresenterStyle}">
<Setter Property="FontWeight" Value="SemiLight"/>
<Setter Property="FontSize" Value="{ThemeResource PivotHeaderItemFontSize}"/>
</Style>
</Border.Resources>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="SelectionStates">
<VisualStateGroup.Transitions>
<VisualTransition From="Unselected" To="UnselectedLocked" GeneratedDuration="0:0:0.33" />
<VisualTransition From="UnselectedLocked" To="Unselected" GeneratedDuration="0:0:0.33" />
</VisualStateGroup.Transitions>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground" >
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseLowBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unselected" />
<VisualState x:Name="UnselectedLocked">
</VisualState>
<VisualState x:Name="Selected">
</VisualState>
<VisualState x:Name="UnselectedPointerOver">
</VisualState>
<VisualState x:Name="SelectedPointerOver">
<VisualState.Setters>
<Setter Target="Grid.(RevealBrush.State)" Value="PointerOver" />
<Setter Target="Grid.Background" Value="{ThemeResource ButtonRevealBackgroundPointerOver}" />
<Setter Target="ContentPresenter.BorderBrush" Value="{ThemeResource ButtonRevealBorderBrush}"/>
<Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ButtonForegroundPointerOver}" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="UnselectedPressed">
</VisualState>
<VisualState x:Name="SelectedPressed">
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ContentPresenter
x:Name="ContentPresenter"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Style="{StaticResource BodyContentPresenterStyle}">
<ContentPresenter.RenderTransform>
<TranslateTransform x:Name="ContentPresenterTranslateTransform" />
</ContentPresenter.RenderTransform>
</ContentPresenter>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
{... add here stuff from the standard template ... }
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
如果我将鼠标悬停在选定的页眉上,则背景会发生变化,但它会变为平面颜色,就像在NavigationView / Listview中一样。 BorderBrush也改变了颜色,但没有阴影。
P.S。:我怎样才能将Style修改为API识别。如果用户使FCU用户显示高亮显示,如果不使用平面颜色......
更新
非常感谢你的帮助
答案 0 :(得分:1)
Reveal是一种灯光效果,有助于为应用的互动元素带来深度和焦点。您似乎已经实现了PivotItem
的显示效果,您可以设置具有高对比度背景的数据透视来查看它,例如LightGray
。
如果你想让BorderBrush用阴影改变颜色,你应该改变代码中SelectedPointerOver
VisualState的Xaml,如下所示改变Grid
边框画笔而不是{{1 }},
ContentPresenter
您还可以使用x:Key,Color,Opacity(可选)和FallbackColor创建一个新的<VisualState x:Name="SelectedPointerOver">
<VisualState.Setters>
<Setter Target="Grid.(RevealBrush.State)" Value="PointerOver" />
<Setter Target="Grid.Background" Value="{ThemeResource ButtonRevealBackgroundPointerOver}" />
<Setter Target="Grid.BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrushPointerOver}"/>
<Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ButtonForegroundPointerOver}" />
</VisualState.Setters>
</VisualState>
,以便在Xaml中使用它。
MyRevealBorderBrush
然后你可以在VisualState中使用它,
<RevealBackgroundBrush x:Key="MyRevealBorderBrush" Color="PaleGreen" Opacity= "0.5" FallbackColor="PaleGreen"/>
至于修改要识别API的样式,您可以查看以下文档: https://docs.microsoft.com/en-us/windows/uwp/debug-test-perf/conditional-xaml#use-ifelse-conditions
- - - - 的更新强> ----
要实现类似的效果,您应该在<VisualState.Setters>
<Setter Target="Grid.(RevealBrush.State)" Value="PointerOver" />
<Setter Target="Grid.Background" Value="{ThemeResource ButtonRevealBackgroundPointerOver}" />
<Setter Target="Grid.BorderBrush" Value="{StaticResource MyRevealBorderBrush}"/>
<Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ButtonRevealBackgroundPointerOver}" />
</VisualState.Setters>
样式的UnselectedPointerOver
VisualState中添加setter,
PivotHeaderItem
至于颜色,你应该尝试你想要的。对于<VisualState x:Name="UnselectedPointerOver">
<VisualState.Setters>
<Setter Target="Grid.(RevealBrush.State)" Value="PointerOver" />
<Setter Target="Grid.Background" Value="{ThemeResource ButtonRevealBackgroundPointerOver}" />
<Setter Target="Grid.BorderBrush" Value="{StaticResource MyRevealBorderBrush}"/>
<Setter Target="ContentPresenter.Foreground" Value="{ThemeResource ButtonForegroundPointerOver}" />
</VisualState.Setters>
</VisualState>
,它应该使用NavigationView
ThemeResource。您也可以尝试查看效果。
NavigationViewItemBorderBrushPointerOver