0

Blend を使用して、ピボット アイテム ヘッダーのテンプレートを変更しました。結果は素晴らしいように見えますが、結果のマークアップがわかりません。

データがヘッダーの上に浮いているように見えるので、データをピボット項目にバインドしているときに問題が発生します。マージンを設定することでこれを回避できますが、ピボット アイテムごとにこれを行うのではなく、スタイル マークアップを理解し、できればそこで修正したいと考えています。

<Style x:Key="PivotStyle1" TargetType="controls:Pivot">
<Setter Property="Margin" Value="0"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Background" Value="White"/>
<Setter Property="ItemsPanel">
    <Setter.Value>
        <ItemsPanelTemplate>
            <Grid/>
        </ItemsPanelTemplate>
    </Setter.Value>
</Setter>
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="controls:Pivot">
            <Grid HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Grid CacheMode="BitmapCache" Grid.RowSpan="2" >
                    <Grid.Background>
                        <LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
                            <GradientStop Color="#FFD7E9F1"/>
                            <GradientStop Color="#FF1BA1E2" Offset="1"/>
                        </LinearGradientBrush>
                    </Grid.Background>
                </Grid>
                <Grid Background="{TemplateBinding Background}" CacheMode="BitmapCache" Grid.Row="2" />
                <ContentPresenter ContentTemplate="{TemplateBinding TitleTemplate}"
                    Content="{TemplateBinding Title}" Margin="24,17,0,-7"/>
                <controlsPrimitives:PivotHeadersControl x:Name="HeadersListElement" Grid.Row="1" Foreground="White" />
                <ItemsPresenter x:Name="PivotItemPresenter" Margin="0,2,0,8" Grid.RowSpan="3"/>
            </Grid>
        </ControlTemplate>
    </Setter.Value>
</Setter>

以下でショーンが提案するように Pivot.HeaderTemplate を設定するのははるかに簡単ですが、ヘッダー項目間の背景色にギャップが生じます。

<controls:Pivot>
        <controls:Pivot.HeaderTemplate>
            <DataTemplate>
                <StackPanel>
                    <StackPanel.Background>
                        <LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
                            <GradientStop Color="#FFD7E9F1"/>
                            <GradientStop Color="#FF1BA1E2" Offset="1"/>
                        </LinearGradientBrush>
                    </StackPanel.Background>

                    <TextBlock Text="{Binding}" FontSize="{StaticResource PhoneFontSizeExtraExtraLarge}" Foreground="White" />

                </StackPanel>
            </DataTemplate>
        </controls:Pivot.HeaderTemplate>
4

1 に答える 1

2

ヘッダーを変更しようとしているだけの場合は、ヘッダーを変更するだけです

<controls:Pivot>
    <controls:Pivot.HeaderTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}" FontSize="{StaticResource PhoneFontSizeExtraExtraLarge}"
                       Margin="24,17,0,-7" Foreground="White" />
        </DataTemplate>
    </controls:Pivot.HeaderTemplate>
    <controls:PivotItem Title="item one"/>
</controls:Pivot>

最新の更新に基づいて、何をしようとしているのかがわかります。ページのリソースに以下を追加します

            <Style TargetType="controlsPrimitives:PivotHeadersControl">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="controlsPrimitives:PivotHeadersControl">
                            <Grid>
                                <Grid.Background>
                                    <LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
                                        <GradientStop Color="#FFD7E9F1"/>
                                        <GradientStop Color="#FF1BA1E2" Offset="1"/>
                                    </LinearGradientBrush>
                                </Grid.Background>
                                <Canvas x:Name="Canvas">
                                    <ItemsPresenter/>
                                </Canvas>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

次の名前空間を定義する必要があります

xmlns:controlsPrimitives="clr-namespace:Microsoft.Phone.Controls.Primitives;assembly=Microsoft.Phone.Controls"

私のブログwww.VisuallyLocated.comの詳細

于 2012-05-22T19:32:59.007 に答える