xaml – Windows Phone 7 – 为所选ListBoxItem中的特定控件设置样式

让我说我有这样的事情：

<Grid>
    <ListBox x:Name="list" 
        ItemsSource="{Binding SomeCollection,Mode=TwoWay}" 
        SelectedItem="{Binding SomeItem,Mode=TwoWay}">                    
        <ListBox.ItemTemplate>
            <DataTemplate>
                <TextBlock x:Name="first" Text="{Binding SomeProperty}" />
                <TextBlock x:Name="second" Text="{Binding OtherProperty}" />
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</Grid>

现在,当ListBoxItem被选中时,我如何改变一些名为“second”的TextBlock的样式属性(f.ex.FontSize)？如果我想为所有ListBoxItem的内容设置FontSize,那么我没有问题.这种情况在这里以及网络上的其他地方都有很好的记录.

我不会给你一个确切的解决方案,但一个好的开始点：检查文件

C:\Program Files\Microsoft SDKs\Windows Phone\vX.Y\Design\System.Windows.xaml

您必须将X.Y调整为7.0 / 7.1以及您的设置.在那里,您将找到与WP7 / Silverlight的所有基本UI控件一起使用的完全相同的控件模板.在VisualStudio-or-whateverelse中打开它并搜索：

<Style TargetType="ListBoxItem">
  (... and immediatelly following ~40 lines of xaml)

啊,好吧,因为我打开了那个文件,就是这样

<!--x:Key="PhoneListBoxItem"-->
    <Style TargetType="ListBoxItem">
      <Setter Property="Background" Value="Transparent"/>
      <Setter Property="BorderThickness" Value="0" />
      <Setter Property="BorderBrush" Value="Transparent" />
      <Setter Property="Padding" Value="0" />
      <Setter Property="HorizontalContentAlignment" Value="Left"/>
      <Setter Property="VerticalContentAlignment" Value="Top"/>
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="ListBoxItem">
            <Border x:Name="LayoutRoot" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
              <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                  <VisualState x:Name="Normal"/>
                  <VisualState x:Name="MouSEOver" />
                  <VisualState x:Name="Disabled">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="Background">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/>
                      </ObjectAnimationUsingKeyFrames>
                      <DoubleAnimation Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Opacity" Duration="0" To=".5" />
                    </Storyboard>
                  </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="SelectionStates">
                  <VisualState x:Name="Unselected"/>
                  <VisualState x:Name="Selected">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneAccentBrush}"/>
                      </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                  </VisualState>
                </VisualStateGroup>
              </VisualStateManager.VisualStateGroups>
              <ContentControl x:Name="ContentContainer" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
                Margin="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Foreground="{TemplateBinding Foreground}" />
            </Border>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>

这是DEFAULT ListBoxItem的完整样式 – 您想要更改的内容.浏览代码并注意’ContentPresenter’和前面的’VisualStateGroup x：Name =“SelectionStates”’.

ContentPresenter将显示项目的DataTemplate.
该组中的VisualStates定义了在列表元素上触发“选定状态”时应发生的正常状态的更改.
一旦“选择状态”减弱,元素将自动返回到未选择状态,并且他的视觉效果会跟随.另请注意,Unselected视觉状态不会强制执行任何更改 – 因此它会保留您的纯DataTemplate样式.

最后要注意的是,这是ListBoxItem的样式,不适用于您的数据项,也不适用于您的数据模板.您的DataTemplate永远不会被触及,它由ContentPresenter直接显示. ListBox将所有项目包装在“ListBoxItem”实例中,然后显示这些ListBoxItem并将该样式应用于它们.

恕我直言,这是你必须要与之合作的重点.

您可能希望根据需要复制和更改此样式,然后将ListBox.ItemContainerStyle设置为该新样式.其中一种方法是：

<YourPage.Resources>
    <Style x:Key="mylistBoxitemoverride" .....
        ........
    </Style>
</YourPage.Resources>
...
...
<ListBox ......... ItemContainerStyle="{StaticResource mylistBoxitemoverride}"
    ...
    ...
</ListBox>

现在,诀窍是修改’Selected’VisualState,并使其改变而不是Foreground(这样做会重新设置你的TextBox！),但是其他一些属性只影响你的一个txbs.不幸的是,这可能更难/更丑.我当时不知道如何让它“更漂亮”而不是用DataTemplate替换ContentPresenter并在VisualState中引用你的确切叶子文本框,如下所示：

<Style .... TargetType="ListBoxItem">
      <Setter Property="Background" Value="Transparent"/>
      <Setter Property="BorderThickness" Value="0" />
      <Setter Property="BorderBrush" Value="Transparent" />
      <Setter Property="Padding" Value="0" />
      <Setter Property="HorizontalContentAlignment" Value="Left"/>
      <Setter Property="VerticalContentAlignment" Value="Top"/>
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="ListBoxItem">
            <Border x:Name="LayoutRoot" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
              <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                  <VisualState x:Name="Normal"/>
                  <VisualState x:Name="MouSEOver" />
                  <VisualState x:Name="Disabled">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="Background">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/>
                      </ObjectAnimationUsingKeyFrames>
                      <DoubleAnimation Storyboard.TargetName="SECOND" Storyboard.TargetProperty="Opacity" Duration="0" To=".5" /> <!-- #### RETARGETTED -->
                    </Storyboard>
                  </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="SelectionStates">
                  <VisualState x:Name="Unselected"/>
                  <VisualState x:Name="Selected">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="SECOND" Storyboard.TargetProperty="Foreground"> <!-- #### RETARGETTED -->
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneAccentBrush}"/>
                      </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                  </VisualState>
                </VisualStateGroup>
              </VisualStateManager.VisualStateGroups>

              <!-- #### INLINED YOUR DATATEMPLATE -->
              <StackPanel Orientation="Vertical"
                          Margin="{TemplateBinding Padding}"
                          DataContext="{TemplateBinding Content}">  <!-- #### careful with the bindings. the DataCtx may be needed or is spurIoUs. do check that! -->
                <TextBlock Text="{Binding SomeProperty}" />  <!-- #### referenced from nowhere,so I removed the name -->
                <TextBlock x:Name="SECOND" Text="{Binding OtherProperty}" />
              </StackPanel>

            </Border>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>

这几乎应该是您想要的,或者至少非常接近它.我没有测试它,你可能需要修改正确的数据绑定(我已经包含了一个DataContent =绑定：内容,但这是一个快速的猜测),可能你会想要添加自己的动画.我想你现在有很多东西要试验.玩的开心！

原文链接：https://www.f2er.com/windows/371535.html

xaml – Windows Phone 7 – 为所选ListBoxItem中的特定控件设置样式

猜你在找的Windows相关文章