【问题标题】:Change background color of selected item in listbox更改列表框中所选项目的背景颜色
【发布时间】:2013-10-11 14:06:39
【问题描述】:

首先我在这里和网上搜索,我找到了很多解决方案,如何在 WPF 的列表框中更改所选项目的背景颜色,但在 Windows 商店应用程序中却没有。这个框架有点不同,我无法找到任何解决方案。

我在页面末尾使用这个:http://social.msdn.microsoft.com/Forums/windowsapps/en-US/91575930-2058-413a-99de-f3b31c74dfd9/change-itemtemplate-forground-when-listbox-is-focused?forum=winappswithcsharp 是一个很好的解决方案,但他这样设置项目模板: ItemTemplate="{StaticResource DataTemplate1}" 但我的列表框有 datateplate 所以我不知道如何通过 setter 或任何不同的方式设置 ItemTemplate 样式。

我的列表框:

<ListBox x:Name="lbMenu" ItemsSource="{Binding MyDataForLunchGrid}" Tapped="lbMenzaMenu_Tapped" Style="{StaticResource ListBoxStyle1}">
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="Style" Value="{StaticResource ListBoxItemStyle1}"/>
        </Style>
    </ListBox.ItemContainerStyle >
    <ListBox.ItemTemplate >
        <DataTemplate>
            <Grid>
                <TextBlock Foreground="#FF19536E"  x:Name="tbMenu" Text="{Binding launchItemName}"/>
                <TextBlock x:Name="tbMenuNumber" Text="{Binding launchNumber}"/>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

现在,当我按下列表框中的任何项目时,它具有深紫色(默认)颜色并且看起来很糟糕。

【问题讨论】:

    标签: c# windows-8 listbox windows-store-apps winrt-xaml


    【解决方案1】:

    如何更改列表框中所选项目的背景颜色

    我认为您想更改 ItemContainerStyle 的定义。试试这样的:

    <ListBox ItemContainerStyle="{StaticResource ListBoxItemStyle1}" ... 
    

    资源“ListBoxItemStyle1”应该包含ListBoxItem的控件模板:

    <Style TargetType="ListBoxItem" x:Name="ListBoxItemStyle1">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBoxItem">
                    <!-- template here --> 
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    

    控件模板依次定义“选定”视觉状态。在page you linked 中,“ListBoxItemStyle1”将视觉状态定义如下(黄色背景):

    <VisualState x:Name="Selected">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="InnerGrid">
                <DiscreteObjectKeyFrame KeyTime="0" Value="Yellow"/>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                <DiscreteObjectKeyFrame KeyTime="0" Value="Green"/>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
    

    请注意,默认情况下,ListBoxItem 的“选定”状态使用用户当前的“重音画笔”作为其背景,如下所示。这可能是您看到的深紫色的来源。 (您可以在Windows Phone SDK folder 中找到所有默认样式和模板。)

    <VisualState x:Name="Selected">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneAccentBrush}"/>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
    

    您可以根据需要对其进行修改 -- 从 Windows SDK 或链接页面复制粘贴默认样式,然后将背景和其他属性设置为您想要的任何内容。

    有关控件模板和视觉状态的更多背景信息,请参阅Customizing the Appearance of an Existing Control by Using a ControlTemplate

    【讨论】:

      【解决方案2】:

      我也遇到了同样的问题。选择项目时,我想摆脱默认的蓝紫色。即使有这篇文章作为帮助,我也花了一段时间才弄清楚ItemContainerStyle 中的哪个VisualState 我必须更改。所以我想我会把它贴在这里。这就是我所做的:

      <VisualStateManager.VisualStateGroups>        
          <VisualStateGroup x:Name="SelectionStates">        
              <VisualState x:Name="SelectedPointerOver">
                  <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="InnerGrid">
                          <DiscreteObjectKeyFrame KeyTime="0" Value="[NOT-PURPLE-BLUE-ANYMORE]">
                      </ObjectAnimationUsingKeyFrames>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                          <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxItemSelectedForegroundThemeBrush}"/>
                      </ObjectAnimationUsingKeyFrames>
                  </Storyboard>
              </VisualState>
          </VisualStateGroup>
      </VisualStateManager.VisualStateGroups>
      

      【讨论】:

        猜你喜欢
        • 2011-01-09
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2010-10-16
        • 1970-01-01
        • 2011-07-02
        • 1970-01-01
        相关资源
        最近更新 更多