如何在 Pivot header 中添加类似于 Windows 10 中 iOS 的页面控制器的图像?
How to add a image in Pivot header similar to page controller of iOS in Windows 10?
我目前正在使用 Windows 10 和 Pivot 控件。我知道我们可以通过添加图像或自定义 TextBlock 来自定义 header 模板。我知道如何自定义基本模板,如下所示
<Pivot.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}"
FontSize="22"/>
</Grid>
</DataTemplate>
</Pivot.HeaderTemplate>
这对于基本用途来说工作得很好,但我想获得类似于以下屏幕截图的输出。为每个 header 添加椭圆,它应该在页面的中心。
有人可以建议这是否可行吗?
更新
我添加了如下所示的 StackPanel。
<StackPanel HorizontalAlignment="Center" Grid.Row="1" Orientation="Horizontal">
<Ellipse Fill="Cyan"
Height="10"
Width="10"
Margin="10,0"/>
<Ellipse Fill="Gainsboro"
Height="10"
Width="10"
Margin="10,0"/>
<Ellipse Fill="Gainsboro"
Height="10"
Width="10"
Margin="10,0"/>
</StackPanel>
现在如何将 PivotHeaderForegroundSelectedBrush 和 PivotHeaderForegroundUnselectedBrush 分配给椭圆?
用于设计页面中心的椭圆。
选项 1
您可以通过绑定边距 属性 来完成。每次调整大小都需要更新此边距 属性。
选项2
否则指定一个 Stackpanel,其方向为水平、居中对齐并包含椭圆,这些椭圆会在 Pivot 选择更改时立即更新。您可以找到由 Jerry Nixon Pagination
创建的类似控件
至于椭圆颜色更改,您可以为不同的状态创建模板,使用触发器甚至覆盖当前的 Pivot header 模板
<SolidColorBrush x:Key="PivotHeaderForegroundSelectedBrush" Color="Blue" />
<SolidColorBrush x:Key="PivotHeaderForegroundUnselectedBrush" Color="White" />
我目前正在使用 Windows 10 和 Pivot 控件。我知道我们可以通过添加图像或自定义 TextBlock 来自定义 header 模板。我知道如何自定义基本模板,如下所示
<Pivot.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}"
FontSize="22"/>
</Grid>
</DataTemplate>
</Pivot.HeaderTemplate>
这对于基本用途来说工作得很好,但我想获得类似于以下屏幕截图的输出。为每个 header 添加椭圆,它应该在页面的中心。
有人可以建议这是否可行吗?
更新
我添加了如下所示的 StackPanel。
<StackPanel HorizontalAlignment="Center" Grid.Row="1" Orientation="Horizontal">
<Ellipse Fill="Cyan"
Height="10"
Width="10"
Margin="10,0"/>
<Ellipse Fill="Gainsboro"
Height="10"
Width="10"
Margin="10,0"/>
<Ellipse Fill="Gainsboro"
Height="10"
Width="10"
Margin="10,0"/>
</StackPanel>
现在如何将 PivotHeaderForegroundSelectedBrush 和 PivotHeaderForegroundUnselectedBrush 分配给椭圆?
用于设计页面中心的椭圆。
选项 1
您可以通过绑定边距 属性 来完成。每次调整大小都需要更新此边距 属性。
选项2
否则指定一个 Stackpanel,其方向为水平、居中对齐并包含椭圆,这些椭圆会在 Pivot 选择更改时立即更新。您可以找到由 Jerry Nixon Pagination
创建的类似控件
至于椭圆颜色更改,您可以为不同的状态创建模板,使用触发器甚至覆盖当前的 Pivot header 模板
<SolidColorBrush x:Key="PivotHeaderForegroundSelectedBrush" Color="Blue" />
<SolidColorBrush x:Key="PivotHeaderForegroundUnselectedBrush" Color="White" />