Màu nền của ListBox (XAML/WinRT/Metro)

Question

Tôi đang cố gắng thay đổi màu nền trên "ListBox" trên trang WinRT (XAML). Khi tôi sử dụng thuộc tính "Nền", nó thay đổi nền như thế nào tôi muốn nó khi điều khiển không có tiêu điểm. Khi nó được lấy nét, nó chuyển sang màu trắng và tôi không thể tìm ra cách để ghi đè lên nó.

Câu hỏi của tôi, làm cách nào để buộc nền của ListBox luôn là Màu xám cho dù nó được chọn/có tập trung hay không?

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 (với mỗi mục cũng set):

<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> 

giải pháp Như tạm thời, tôi đặt ListBox chỉ là một mã được mã hóa cứng tám, sau đó sử dụng một đường viền trên cột đó để điền vào phần còn lại của không gian với LightGray. Tôi thực sự muốn chỉ luôn luôn thiết lập màu nền trên ListBox mặc dù, là điều này có thể?

Answer 1

Sử dụng Visual Studio Blend 2012 và chỉnh sửa ItemBox ItemTemplate hoặc mẫu của nó, sẽ tạo bản sao cứng trong XAML, nơi bạn có thể chỉnh sửa thuộc tính của nó.

Answer 2

Tôi đã gặp sự cố tương tự và tôi đã sử dụng trợ giúp của Visual studio Blend. Hi vọng điêu nay co ich.

Thêm một phong cách cho ListBoxMenu như sau:

<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>

Sau đó, xác định phong cách như sau:

<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> 

Các ví dụ trên sẽ thay thế nền của bạn Liệt kê chứa hộp đen khi tiêu điểm được đặt thành ListBox.

Answer 3

Nếu bạn cần một số trợ giúp về tùy chỉnh màu sắc của Items trong một ListBox, ListView hoặc GridView, tất cả họ đều làm việc trên cùng một nguyên tắc, chỉ cần chắc chắn để cập nhật các TargetType tính, tôi muốn khuyên bạn nên có một cái nhìn tại Vito Bài đăng trên blog của DeMercurio Styling a GridViewItem in WinRT

Answer 4

Bạn chỉ có thể đặt một số ghi đè màu trong tệp tài nguyên XAML của mình để ghi đè màu mẫu kiểm soát ListBox mặc định.

<SolidColorBrush x:Key="ListBoxBackgroundThemeBrush" Color="Transparent" /> 
<SolidColorBrush x:Key="ListBoxFocusBackgroundThemeBrush" Color="Transparent" />