代码之家 › 专栏 › 技术社区 › Codo

更改数据透视控件中标题和标题的背景

windows-phone-7 silverlight

Codo · 技术社区 · 14 年前

在我的Phone 7应用程序中,我使用了一个pivot控件。现在我想更改它的标题和标题区域的背景。我怎样才能做到这一点?

是否有可自定义的透视控件的总体模板?

我已经尝试将包含透视控件的网格的背景设置为标题颜色,然后将每个透视项的背景设置为原始背景颜色。第一眼看上去不错。但是,当您向左擦除数据透视项以显示第二个数据透视项时,两个数据透视项之间会出现一个标题颜色为的区域。所以这种方法行不通。

3 回复 | 直到 14 年前

Ostemar 14 年前

这是更改控件模板的变体。将Background=“Red”更改为所需的任何画笔。

<Style x:Key="PivotStyle1" TargetType="controls:Pivot">
  <Setter Property="Margin" Value="0"/>
  <Setter Property="Padding" Value="0"/>
  <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
  <Setter Property="Background" Value="Transparent"/>
  <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 Background="Red" CacheMode="BitmapCache" Grid.RowSpan="2" />
          <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"/>
          <ItemsPresenter x:Name="PivotItemPresenter"
                          Margin="{TemplateBinding Padding}" Grid.Row="2"/>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

....

<controls:Pivot Title="MY APPLICATION" Style="{StaticResource PivotStyle1}">

....

Ostemar 14 年前

你说得对,标题和标题模板只是实际的文本区域。也许可以重写Pivot控件的整个模板,但更简单的方法是在其后面添加一个彩色矩形。

<Grid x:Name="LayoutRoot" Background="Transparent">
  <Rectangle 
    VerticalAlignment="Top" HorizontalAlignment="Stretch" 
    Height="150" Fill="Red" />
  <controls:Pivot Title="MY APPLICATION">
    <controls:PivotItem Header="item1">
        <Grid/>
    </controls:PivotItem>
    <controls:PivotItem Header="item2">
        <Grid/>
    </controls:PivotItem>
  </controls:Pivot>
</Grid>

Den 14 年前

您可以修改头模板,这通常是一个更好的选项,因为您不必担心自定义定位和对齐:

<controls:Pivot>
  <controls:Pivot.HeaderTemplate>
    <DataTemplate>
       <Grid Background="White"><TextBloc>Your Header Here</TextBlock></Grid>
    </DataTemplate>
  </controls:Pivot.HeaderTemplate>
</controls:Pivot>

也就是说,你将背景应用到一个自动调整大小的网格-当然,你可以自己调整它的大小,以调整到正确的大小。同样的情况也适用于每个数据透视项,如果您想更改标题,只需将它们绑定到类似的数据模板。