【问题标题】:Windows phone WinRT Pivot remove header and title spaceWindows phone WinRT Pivot 删除标题和标题空间
【发布时间】:2014-12-18 00:42:38
【问题描述】:

当在 Windows phone 8.1 中使用 Winrt 工具包时,我想删除标题和标题在 Pivot 中通常占据的空间,以便 Pivotitem 的内容填满屏幕。

这是我尝试过的:

 <Page.Resources>
    <Thickness x:Key="PivotPortraitThemePadding">19,0,0,0</Thickness>
    <Thickness x:Key="PivotLandscapeThemePadding">19,25,0,0</Thickness>
    <Style x:Key="CustomPivotStyle" TargetType="Pivot">
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="Foreground" Value="{ThemeResource PhoneForegroundBrush}"/>
        <Setter Property="Background" Value="Transparent"/>
        <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.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="Orientation">
                                <VisualState x:Name="Portrait">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TitleContentControl">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotPortraitThemePadding}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Landscape">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TitleContentControl">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotLandscapeThemePadding}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentControl x:Name="TitleContentControl" ContentTemplate="{TemplateBinding TitleTemplate}" Content="{TemplateBinding Title}" Style="{StaticResource PivotTitleContentControlStyle}"/>
                        <ScrollViewer x:Name="ScrollViewer" HorizontalSnapPointsAlignment="Center" HorizontalSnapPointsType="MandatorySingle" HorizontalScrollBarVisibility="Hidden" Margin="{TemplateBinding Padding}" Grid.Row="1" Template="{StaticResource ScrollViewerScrollBarlessTemplate}" VerticalSnapPointsType="None" VerticalScrollBarVisibility="Disabled" VerticalScrollMode="Disabled" VerticalContentAlignment="Stretch" ZoomMode="Disabled">
                            <PivotPanel x:Name="Panel" VerticalAlignment="Stretch">
                                <PivotHeaderPanel x:Name="Header" Background="{TemplateBinding BorderBrush}">
                                    <PivotHeaderPanel.RenderTransform>
                                        <CompositeTransform x:Name="HeaderTranslateTransform" TranslateX="0"/>
                                    </PivotHeaderPanel.RenderTransform>
                                </PivotHeaderPanel>
                                <ItemsPresenter x:Name="PivotItemPresenter">
                                    <ItemsPresenter.RenderTransform>
                                        <TranslateTransform x:Name="ItemsPresenterTranslateTransform" X="0"/>
                                    </ItemsPresenter.RenderTransform>
                                </ItemsPresenter>
                            </PivotPanel>
                        </ScrollViewer>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>



<Pivot Style="{StaticResource CustomPivotStyle}">
    <Pivot.HeaderTemplate>
        <DataTemplate/>
    </Pivot.HeaderTemplate>
    <Pivot.TitleTemplate>
        <DataTemplate/>
    </Pivot.TitleTemplate>
    <PivotItem>
        <TextBlock Text="text1" FontSize="100"/>
    </PivotItem>
    <PivotItem>
        <TextBlock Text="text2" FontSize="100"/>
    </PivotItem>
</Pivot>

那没用。有没有其他方法可以做到这一点,还是我做错了? 仅将上边距设置为负值不是我的选择

【问题讨论】:

  • 你必须和the Style of your Pivot一起玩。
  • @Romasz 谢谢我已经看到并阅读了那篇文章我已经通过将 PivotPortraitThemePadding 中的顶部填充设置为 0 来更改样式,它确实有所帮助,但仍然存在差距
  • 然后你应该编辑你的问题并在那里放更多信息(尤其是代码) - 你已经做了什么。
  • 如果您使用的是 wp 8.1 winrt,flipview 可能是个不错的选择?
  • 试试这种风格让 Pivot 隐藏标题 - stackoverflow.com/a/28767442/1219241

标签: xaml windows-runtime winrt-xaml windows-phone-8.1


【解决方案1】:

[编辑]:fex 给我的提示似乎也可以使用翻转视图!

<FlipView>
    <FlipViewItem>
        <TextBlock Text="text1" FontSize="100"/>
    </FlipViewItem>
    <FlipViewItem>
        <TextBlock Text="text2" FontSize="100"/>
    </FlipViewItem>
</FlipView>

the link Romasz provided 解决了这个问题,我将 PivotPortraitThemePadding 设置为 0,然后在数据透视项内操纵项目的边距,使其与顶部齐平。

 <Page.Resources>
    <Thickness x:Key="PivotPortraitThemePadding">19,0,0,0</Thickness>
    <Thickness x:Key="PivotLandscapeThemePadding">19,25,0,0</Thickness>
    <Style x:Key="CustomPivotStyle" TargetType="Pivot">
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="Foreground" Value="{ThemeResource PhoneForegroundBrush}"/>
        <Setter Property="Background" Value="Transparent"/>
        <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.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="Orientation">
                                <VisualState x:Name="Portrait">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TitleContentControl">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotPortraitThemePadding}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Landscape">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TitleContentControl">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PivotLandscapeThemePadding}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentControl x:Name="TitleContentControl" ContentTemplate="{TemplateBinding TitleTemplate}" Content="{TemplateBinding Title}" Style="{StaticResource PivotTitleContentControlStyle}"/>
                        <ScrollViewer x:Name="ScrollViewer" HorizontalSnapPointsAlignment="Center" HorizontalSnapPointsType="MandatorySingle" HorizontalScrollBarVisibility="Hidden" Margin="{TemplateBinding Padding}" Grid.Row="1" Template="{StaticResource ScrollViewerScrollBarlessTemplate}" VerticalSnapPointsType="None" VerticalScrollBarVisibility="Disabled" VerticalScrollMode="Disabled" VerticalContentAlignment="Stretch" ZoomMode="Disabled">
                            <PivotPanel x:Name="Panel" VerticalAlignment="Stretch">
                                <PivotHeaderPanel x:Name="Header" Background="{TemplateBinding BorderBrush}">
                                    <PivotHeaderPanel.RenderTransform>
                                        <CompositeTransform x:Name="HeaderTranslateTransform" TranslateX="0"/>
                                    </PivotHeaderPanel.RenderTransform>
                                </PivotHeaderPanel>
                                <ItemsPresenter x:Name="PivotItemPresenter">
                                    <ItemsPresenter.RenderTransform>
                                        <TranslateTransform x:Name="ItemsPresenterTranslateTransform" X="0"/>
                                    </ItemsPresenter.RenderTransform>
                                </ItemsPresenter>
                            </PivotPanel>
                        </ScrollViewer>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>

<Pivot Style="{StaticResource CustomPivotStyle}">

    <PivotItem>
        <TextBlock Text="text1" FontSize="100" Foreground="White" Margin="0,-20,0,0"/>
    </PivotItem>
    <PivotItem>
        <ScrollViewer>
            <TextBlock Text="text2" FontSize="100" Margin="0,-20,0,0"/>
        </ScrollViewer>
    </PivotItem>
</Pivot>

【讨论】:

  • 请注意,因为您设置的边距来自字体本身。通过放置 &lt;Rectangle Width="300" Height="40" Margin="0" Fill="Blue" VerticalAlignment="Top"/&gt; 而不是 TextBlock 来检查它 - 使用这个边距,一些字母可能会被切断。
猜你喜欢
  • 1970-01-01
  • 2021-12-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-04-28
  • 1970-01-01
  • 2019-12-10
  • 2021-11-15
相关资源
最近更新 更多