ItemsControl.ItemContainerStyle 屬性

定義

命名空間:: System.Windows.Controls

組件:: PresentationFramework.dll

取得或設定 Style，它會套用到為每個項目所產生的容器項目。Gets or sets the Style that is applied to the container element generated for each item.

public:
 property System::Windows::Style ^ ItemContainerStyle { System::Windows::Style ^ get(); void set(System::Windows::Style ^ value); };

[System.ComponentModel.Bindable(true)]
public System.Windows.Style ItemContainerStyle { get; set; }

[<System.ComponentModel.Bindable(true)>]
member this.ItemContainerStyle : System.Windows.Style with get, set

Public Property ItemContainerStyle As Style

屬性值

Style

Style 會套用到為每個項目所產生的容器項目。The Style that is applied to the container element generated for each item. 預設值為 null。The default is null.

屬性: BindableAttribute

範例

下列範例示範如何使用這個屬性。The following example demonstrates how to use this property. 請考慮下列資料系結 ListBox ：Consider the following data-bound ListBox:

<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
         Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>

若要為包含資料項目的專案建立樣式，請建立 ListBoxItem 樣式，如下列範例所示。To create a style for the elements that contain the data items, create a ListBoxItem style, as shown in the following example. 樣式會套用至 ListBoxItem 定義樣式之範圍內的所有元素。The style is applied to all ListBoxItem elements within the scope the style is defined in.

<Style TargetType="ListBoxItem">
  <Setter Property="Opacity" Value="0.5" />
  <Setter Property="MaxHeight" Value="75" />
  <Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
      <Trigger.Setters>
        <Setter Property="Opacity" Value="1.0" />
      </Trigger.Setters>
    </Trigger>
    <EventTrigger RoutedEvent="Mouse.MouseEnter">
      <EventTrigger.Actions>
        <BeginStoryboard>
          <Storyboard>
            <DoubleAnimation
              Duration="0:0:0.2"
              Storyboard.TargetProperty="MaxHeight"
              To="90"  />
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger.Actions>
    </EventTrigger>
    <EventTrigger RoutedEvent="Mouse.MouseLeave">
      <EventTrigger.Actions>
        <BeginStoryboard>
          <Storyboard>
            <DoubleAnimation
              Duration="0:0:1"
              Storyboard.TargetProperty="MaxHeight"  />
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger.Actions>
    </EventTrigger>
  </Style.Triggers>
</Style>

ListBoxItem是控制項的容器元素 ListBox 。The ListBoxItem is the container element for the ListBox control. 因此，上述的替代方法是將的屬性設定 ItemContainerStyle ListBox 為已定義的樣式。Therefore, an alternative to the preceding is to set the ItemContainerStyle property of the ListBox to the defined style. 若要這麼做，請為樣式提供， ListBoxItem x:Key 讓它當做資源提供：To do that, give the ListBoxItem style an x:Key so it is available as a resource:

<Style TargetType="ListBoxItem" x:Key="ContainerStyle">
  <Setter Property="Opacity" Value="0.5" />
  <Setter Property="Opacity" Value="0.5" />
  <Setter Property="MaxHeight" Value="75" />
  <Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
      <Setter Property="Opacity" Value="1.0" />
    </Trigger>

接下來，將 ItemContainerStyle 屬性設定為資源，如下列範例所示：Next, set the ItemContainerStyle property to the resource, as in the following example:

<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
         ItemContainerStyle="{StaticResource ContainerStyle}" 
         Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>

上述兩種情況都會產生相同的結果。Both of the preceding scenarios produce the same result. 不過，將樣式當做資源提供的其中一個優點是您可以重複使用該樣式。However, one of the advantages of making the style available as a resource is that you can reuse the style. 明確設定 ItemContainerStyle 屬性也可以提供更高的可讀性。Setting the ItemContainerStyle property explicitly can also provide greater readability.

如需完整範例，請參閱樣式設定和範本化範例簡介。For the complete example, see Introduction to Styling and Templating Sample.

下列範例的設計目的是要說明所提供的不同樣式和範本相關屬性的功能 ItemsControl 。The following example is designed to illustrate the function of the different styling and templating related properties provided by the ItemsControl. ItemsControl這個範例中的會系結至物件的集合 Task 。The ItemsControl in this example is bound to a collection of Task objects. 為方便示範，這個範例中的樣式和範本都是內嵌宣告的。For demonstration purposes, the styles and templates in this example are all declared inline.

<ItemsControl Margin="10"
              ItemsSource="{Binding Source={StaticResource myTodoList}}">
  <!--The ItemsControl has no default visual appearance.
      Use the Template property to specify a ControlTemplate to define
      the appearance of an ItemsControl. The ItemsPresenter uses the specified
      ItemsPanelTemplate (see below) to layout the items. If an
      ItemsPanelTemplate is not specified, the default is used. (For ItemsControl,
      the default is an ItemsPanelTemplate that specifies a StackPanel.-->
  <ItemsControl.Template>
    <ControlTemplate TargetType="ItemsControl">
      <Border BorderBrush="Aqua" BorderThickness="1" CornerRadius="15">
        <ItemsPresenter/>
      </Border>
    </ControlTemplate>
  </ItemsControl.Template>
  <!--Use the ItemsPanel property to specify an ItemsPanelTemplate
      that defines the panel that is used to hold the generated items.
      In other words, use this property if you want to affect
      how the items are laid out.-->
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <WrapPanel />
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
  <!--Use the ItemTemplate to set a DataTemplate to define
      the visualization of the data objects. This DataTemplate
      specifies that each data object appears with the Priority
      and TaskName on top of a silver ellipse.-->
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <DataTemplate.Resources>
        <Style TargetType="TextBlock">
          <Setter Property="FontSize" Value="18"/>
          <Setter Property="HorizontalAlignment" Value="Center"/>
        </Style>
      </DataTemplate.Resources>
      <Grid>
        <Ellipse Fill="Silver"/>
        <StackPanel>
          <TextBlock Margin="3,3,3,0"
                     Text="{Binding Path=Priority}"/>
          <TextBlock Margin="3,0,3,7"
                     Text="{Binding Path=TaskName}"/>
        </StackPanel>
      </Grid>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
  <!--Use the ItemContainerStyle property to specify the appearance
      of the element that contains the data. This ItemContainerStyle
      gives each item container a margin and a width. There is also
      a trigger that sets a tooltip that shows the description of
      the data object when the mouse hovers over the item container.-->
  <ItemsControl.ItemContainerStyle>
    <Style>
      <Setter Property="Control.Width" Value="100"/>
      <Setter Property="Control.Margin" Value="5"/>
      <Style.Triggers>
        <Trigger Property="Control.IsMouseOver" Value="True">
          <Setter Property="Control.ToolTip"
                  Value="{Binding RelativeSource={x:Static RelativeSource.Self},
                          Path=Content.Description}"/>
        </Trigger>
      </Style.Triggers>
    </Style>
  </ItemsControl.ItemContainerStyle>
</ItemsControl>

下圖是範例呈現的畫面：The following is a screenshot of the example when it is rendered:

ItemsControl 範例螢幕擷取畫面 ItemsControl example screenshot

這裡未顯示的其他兩個與樣式相關的屬性 ItemsControl 為 GroupStyle 和 GroupStyleSelector 。Two other style-related properties of the ItemsControl that are not shown here are GroupStyle and GroupStyleSelector.

備註

您可以使用這個屬性（property）或 ItemContainerStyleSelector 屬性（property）來設定樣式，以影響包含資料項目之專案的外觀。You use this property or the ItemContainerStyleSelector property to set a style to affect the appearance of the elements that contain the data items. 例如，針對 ListBox ，產生的容器是 ListBoxItem 控制項; 若是，則為 ComboBox ComboBoxItem 控制項。For example, for ListBox, the generated containers are ListBoxItem controls; for ComboBox, they are ComboBoxItem controls.

ItemsControl提供視覺自訂的絕佳彈性，並提供許多樣式設定和範本化屬性。The ItemsControl provides great flexibility for visual customization and provides many styling and templating properties. 若要影響專案的版面配置，請使用 ItemsPanel 屬性。To affect the layout of the items, use the ItemsPanel property. 如果您在控制項上使用群組，您可以使用 GroupStyle 或 GroupStyleSelector 屬性。If you are using grouping on your control, you can use the GroupStyle or GroupStyleSelector property. 若要指定資料物件的視覺效果，請使用 ItemTemplate 或 ItemTemplateSelector 屬性。To specify the visualization of data objects, use the ItemTemplate or ItemTemplateSelector property. 如需何時指定的詳細資訊 ItemTemplate ，請參閱資料範本化總覽。For more information about when to specify an ItemTemplate, see Data Templating Overview.

XAML Attribute UsageXAML Attribute Usage

<object ItemContainerStyle="ResourceExtension StyleResourceKey"/>

XAML 值XAML Values

ResourceExtensionResourceExtension
下列其中一項： StaticResource 、或 DynamicResource 。One of the following: StaticResource, or DynamicResource. 除非樣式本身包含可能的執行時間參考（例如系統資源或使用者喜好設定）的參考，否則 StaticResource 通常建議使用樣式的參考來取得效能。Unless the styles themselves contain references to potential run-time references such as system resources or user preferences, StaticResource reference to a style is usually recommended for performance.

StyleResourceKeyStyleResourceKey
x:Key 參考當做資源要求之樣式的字串值。x:Key string value referring to the style being requested as a resource.

相依性屬性資訊Dependency Property Information


識別碼欄位Identifier field	ItemContainerStyleProperty
中繼資料屬性設定為 `true`Metadata properties set to `true`	無None

適用於

另請參閱

資料範本化範例簡介Introduction to Data Templating Sample