ListBoxの背景色（XAML/WinRT/Metro）

Question

WinRTページ（XAML）の "ListBox"で背景色を変更しようとしています。 「Background」プロパティを使用すると、コントロールにフォーカスがないときの背景を変更します。それがフォーカスを取得すると、それは白に変更され、私はそれを無効にする方法を把握することはできません。

私の質問どのように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> 

、IセットハードコードされたhだけであるListBox LightGrayを使用して残りのスペースを埋めるために、その列の境界線を使用しました。私は本当にListBoxの背景色を常に設定したいと思いますが、これは可能ですか？

Answer 1

Visual Studio Blend 2012を使用してListBox ItemTemplateまたはそのテンプレートを編集すると、XAMLでハードコピーが作成され、プロパティを編集できます。

Answer 2

私は同じ問題に遭遇し、私は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に設定されているとき。

Answer 3

あなたは同じ原理でListBox、ListViewまたはGridView、彼らはすべての作業にItemsの色をカスタマイズする上でいくつかのより多くの助けが必要な場合は、単にTargetTypeプロパティを更新するようにしてください、私はヴィトを見たお勧めしますDeMercurioのブログ記事Styling a GridViewItem in WinRT

Answer 4

デフォルトのListBoxコントロールテンプレートの色をオーバーライドするには、XAMLリソースファイルに色のブラシオーバーライドを設定するだけです。

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