Поделиться через

Практическое руководство. Создание горизонтального элемента управления ListBox

  • Статья

Обновлен: Ноябрь 2007

В этом примере демонстрируется создание горизонтального элемента управления ListBox путем определения стиля. Элементы управления ListBoxItem расположены по горизонтали и разделены пользовательскими разделителями. С помощью стиля для свойства ItemsPanel объекта ListBox устанавливается значение горизонтального элемента управления StackPanel. В следующем примере показаны стили для объектов Separator и ListBox.

Пример

<Grid.Resources>
  <Style TargetType="Separator">
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Separator}">
          <Border Width="2" Height="12" Margin="4" Background="Gray"/>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <Style TargetType="ListBox">
    <Setter Property="ItemsPanel">
      <Setter.Value>
        <ItemsPanelTemplate>
          <StackPanel Orientation="Horizontal"
                      VerticalAlignment="Center"
                      HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
      </Setter.Value>
    </Setter>
  </Style>

</Grid.Resources>


...


<ListBox Name="lb" 
         Margin="10, 10, 3, 3" Height="50"
         Grid.Column="0" Grid.Row="2"
         Grid.RowSpan="2"
         SelectionChanged="PrintText">
  <ListBoxItem>Item 1</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 2</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 3</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 4</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 5</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 6</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 7</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 8</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 9</ListBoxItem>
  <Separator/>
  <ListBoxItem>Item 10</ListBoxItem>
</ListBox>

Полный пример см. в разделе Пример горизонтального элемента управления ListBox.

Также можно создать горизонтальный элемент управления ListBox посредством создания нового элемента ControlTemplate. Дополнительные сведения см. в примере в разделе ItemsPanel.