14

我正在尝试更改 WinRT 页面 (XAML) 上“列表框”的背景颜色。当我使用“背景”属性时，它会在控件没有焦点时更改我想要的背景。当它获得焦点时，它变为白色，我不知道如何覆盖它。

我的问题，如何强制 ListBox 的背景始终为灰色，无论它是否被选中/是否有焦点？

XAML #1：

    <ListBox x:Name="ListBoxMenu" Background="LightGray" Grid.Row="0" Grid.Column="0" Margin="0,0,0,0">
        <ListBoxItem>Menu Item 1</ListBoxItem>
        <ListBoxItem>Menu Item 2</ListBoxItem>
        <ListBoxItem>Menu Item 3</ListBoxItem>
    </ListBox>

XAML #2（还设置了每个项目）：

    <ListBox x:Name="ListBoxMenu" Background="LightGray" Grid.Row="0" Grid.Column="0" Height="124" VerticalAlignment="Top">
        <ListBoxItem Background="LightGray">Menu Item 1</ListBoxItem>
        <ListBoxItem Background="LightGray">Menu Item 2</ListBoxItem>
        <ListBoxItem Background="LightGray">Menu Item 3</ListBoxItem>
    </ListBox>

没有焦点时具有灰色背景的列表框

ListBox，当它获得焦点时将背景重置为白色

作为临时解决方案，我将 ListBox 设置为仅硬编码的高度，然后在该列上使用边框以使用 LightGray 填充其余空间。我真的很想总是在 ListBox 上设置背景颜色，这可能吗？

4

4 回答 4

6

您可以在 XAML 资源文件中放置一些颜色笔刷覆盖来覆盖默认的 ListBox 控件模板颜色。

<SolidColorBrush x:Key="ListBoxBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxFocusBackgroundThemeBrush" Color="Transparent" />
于 2013-04-14T05:10:39.220 回答
5

使用 Visual Studio Blend 2012 并编辑 ListBox ItemTemplate 或其模板，这将在 XAML 中创建一个硬拷贝，您可以在其中编辑它的属性。

于 2012-09-04T19:27:49.593 回答
3

我遇到了同样的问题，我使用了 Visual Studio Blend 的帮助。希望这可以帮助。

向 ListBoxMenu 添加样式，如下所示：

<ListBox x:Name="ListBoxMenu" Style="{StaticResource ListBoxStyle1} Background="LightGray" Grid.Row="0" Grid.Column="0" Height="124" VerticalAlignment="Top"> <ListBoxItem Background="LightGray">Menu Item 1</ListBoxItem> <ListBoxItem Background="LightGray">Menu Item 2</ListBoxItem> <ListBoxItem Background="LightGray">Menu Item 3</ListBoxItem> </ListBox>

然后指定样式如下：

<Style x:Key="ListBoxStyle1" TargetType="ListBox">
        <Setter Property="Foreground" Value="{StaticResource ListBoxForegroundThemeBrush}"/>
        <Setter Property="Background" Value="{StaticResource ListBoxBackgroundThemeBrush}"/>
        <Setter Property="BorderBrush" Value="{StaticResource ListBoxBorderThemeBrush}"/>
        <Setter Property="BorderThickness" Value="{StaticResource ListBoxBorderThemeThickness}"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"/>
        <Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="True"/>
        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Enabled"/>
        <Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="True"/>
        <Setter Property="ScrollViewer.ZoomMode" Value="Disabled"/>
        <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/>
        <Setter Property="ScrollViewer.BringIntoViewOnFocusChange" Value="True"/>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="TabNavigation" Value="Once"/>
        <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}"/>
        <Setter Property="FontSize" Value="{StaticResource ControlContentThemeFontSize}"/>
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <VirtualizingStackPanel/>
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBox">
                    <Border x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{StaticResource AppBarBackgroundThemeBrush}">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="LayoutRoot">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ListBoxDisabledForegroundThemeBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ScrollViewer">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Black"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                                <VisualState x:Name="Unfocused"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ScrollViewer x:Name="ScrollViewer">
                        <ItemsPresenter/>
                    </ScrollViewer>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

当焦点设置到 ListBox 时，上面的示例会将您的 List box 容器的背景替换为黑色。

于 2012-10-24T17:25:12.560 回答
2

Items如果您在自定义a或中的颜色时需要更多帮助ListBox，它们的工作原理相同，只需确保更新属性，我建议您查看 Vito DeMercurio 的博客文章在 WinRT 中设置 GridViewItem 样式ListViewGridViewTargetType

于 2012-11-20T19:50:56.550 回答