XAML Pivot Headerless

Question

我正在努力改变我的枢轴样式，以便在标题中没有空格。

以下是我的网页图片：

蓝色部分是template10的控件头。

白色部分是枢轴标题的空白高度。

绿色部分是命令栏（这是在枢轴内）。

我无法在数据透视表中使用负边距，因为我的页面标题包含一个secundary菜单，并且此结果已被阻止。

我已经编写了一种样式来设置枢轴标题的高度而没有很好的结果。

<Page.Resources>
    <Style x:Key="PivotHeaderless" TargetType="PivotItem">
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Header" Value=""/>
        <Setter Property="Height" Value="0"/>
    </Style>
</Page.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <StackPanel>

        <Pivot x:Name="MainPivot">

            <PivotItem Style="{ThemeResource PivotHeaderless}"/>
        </Pivot>

    </StackPanel>
</Grid>

感谢任何帮助。

Answer 1

要实现这一点，您必须在控件本身的模板中进行更改。

如果您导航到C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\<SDKVERSION>\Generic\generic.xaml，您会发现Pivot控件的默认模板包含以下内容：

<PivotPanel x:Name="Panel" VerticalAlignment="Stretch">
<Grid x:Name="PivotLayoutElement">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <!-- ... more code -->
</Grid>

网格的第一行高度为Auto。这意味着它的高度设置为适应所包含的内容。但是这个标题不仅包含您的数据透视表项的标题，还包含两个用于分页的控制按钮 - 上一个：

<Button x:Name="PreviousButton"
Grid.Column="1"
Template="{StaticResource PreviousTemplate}"
Width="20"
Height="36"
... />
<Button x:Name="NextButton"
Grid.Column="1"
Template="{StaticResource PreviousTemplate}"
Width="20"
Height="36"
... />

正如您所看到的，这些按钮的高度硬编码为36像素，这意味着无论您做什么，如果您不对它们采取任何措施，标题的高度始终为最小的36像素。

解决方案

最简单的解决方案是创建Pivot控件的默认模板的副本（例如，通过复制Style文件中的generic.xaml定义）并设置第一个{{ 1}}行高为0.这将有效地隐藏它并使其不可见。为了使其更有效，您可以删除第一行中的所有控件，以便不构造它们并提高性能：

Grid

Answer 2

感谢MZetko我找到了完美的无头风格，你可以自己使用他的方法，或者如果你只想复制代码，这里是：

<Style TargetType="Pivot" x:Key="PivotHeaderless">
        <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"
                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalAlignment}"
                        Background="{TemplateBinding Background}">
                        <Grid.Resources>
                            <Style x:Key="BaseContentControlStyle" TargetType="ContentControl">
                                <Setter Property="FontFamily" Value="XamlAutoFontFamily" />
                                <Setter Property="FontWeight" Value="SemiBold" />
                                <Setter Property="FontSize" Value="15" />
                                <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>

                        </Grid.Resources>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="Orientation">
                                <VisualState x:Name="Portrait">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TitleContentControl" Storyboard.TargetProperty="Margin">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotPortraitThemePadding}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Landscape">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TitleContentControl" Storyboard.TargetProperty="Margin">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotLandscapeThemePadding}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>

                            <VisualStateGroup x:Name="HeaderStates">
                                <VisualState x:Name="HeaderDynamic" />
                                <VisualState x:Name="HeaderStatic">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Header" Storyboard.TargetProperty="Visibility">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="StaticHeader" Storyboard.TargetProperty="Visibility">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <ContentControl x:Name="TitleContentControl"
                            IsTabStop="False"
                            Margin="{StaticResource PivotPortraitThemePadding}"

                            Visibility="Collapsed"
                            Content="{TemplateBinding Title}"
                            ContentTemplate="{TemplateBinding TitleTemplate}" />
                        <Grid Grid.Row="1">

                            <ScrollViewer x:Name="ScrollViewer"
                                Margin="{TemplateBinding Padding}"
                                HorizontalSnapPointsType="MandatorySingle"
                                HorizontalSnapPointsAlignment="Center"
                                HorizontalScrollBarVisibility="Hidden"
                                VerticalScrollMode="Disabled"
                                VerticalScrollBarVisibility="Disabled"
                                VerticalSnapPointsType="None"
                                VerticalContentAlignment="Stretch"
                                ZoomMode="Disabled"
                                Template="{StaticResource ScrollViewerScrollBarlessTemplate}"
                                BringIntoViewOnFocusChange="False">
                                <!---->
                                    <PivotPanel x:Name="Panel" VerticalAlignment="Stretch">
                                        <Grid x:Name="PivotLayoutElement">
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="0" />
                                                <RowDefinition Height="*" />
                                            </Grid.RowDefinitions>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="Auto" />
                                            </Grid.ColumnDefinitions>
                                            <Grid.RenderTransform>
                                                <CompositeTransform x:Name="PivotLayoutElementTranslateTransform" />
                                            </Grid.RenderTransform>
                                            <ContentPresenter x:Name="LeftHeaderPresenter"
                                            Content="{TemplateBinding LeftHeader}"
                                            ContentTemplate="{TemplateBinding LeftHeaderTemplate}"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch" />
                                            <ContentControl x:Name="HeaderClipper"
                                            Grid.Column="1"
                                            UseSystemFocusVisuals="True"
                                            HorizontalContentAlignment="Stretch">
                                                <ContentControl.Clip>
                                                    <RectangleGeometry x:Name="HeaderClipperGeometry" />
                                                </ContentControl.Clip>
                                                <Grid Background="{ThemeResource PivotHeaderBackground}">
                                                    <Grid.RenderTransform>
                                                        <CompositeTransform x:Name="HeaderOffsetTranslateTransform" />
                                                    </Grid.RenderTransform>
                                                    <PivotHeaderPanel x:Name="StaticHeader" Visibility="Collapsed">
                                                        <PivotHeaderPanel.RenderTransform>
                                                            <CompositeTransform x:Name="StaticHeaderTranslateTransform" />
                                                        </PivotHeaderPanel.RenderTransform>
                                                    </PivotHeaderPanel>
                                                    <PivotHeaderPanel x:Name="Header">
                                                        <PivotHeaderPanel.RenderTransform>
                                                            <CompositeTransform x:Name="HeaderTranslateTransform" />
                                                        </PivotHeaderPanel.RenderTransform>
                                                    </PivotHeaderPanel>
                                                </Grid>
                                            </ContentControl>


                                            <ContentPresenter x:Name="RightHeaderPresenter"
                                            Grid.Column="2"
                                            Content="{TemplateBinding RightHeader}"
                                            ContentTemplate="{TemplateBinding RightHeaderTemplate}"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch" />
                                            <ItemsPresenter x:Name="PivotItemPresenter" Grid.Row="1" Grid.ColumnSpan="3">
                                                <ItemsPresenter.RenderTransform>
                                                    <TransformGroup>
                                                        <TranslateTransform x:Name="ItemsPresenterTranslateTransform" />
                                                        <CompositeTransform x:Name="ItemsPresenterCompositeTransform" />
                                                    </TransformGroup>
                                                </ItemsPresenter.RenderTransform>
                                            </ItemsPresenter>
                                        </Grid>
                                    </PivotPanel>
                                </ScrollViewer>
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>