WrapPanel

86

WrapPanel позволяет определить содержимое, которое обтекает панель при изменении размеров окна. При позиционировании элементов в WrapPanel вы не указываете положение относительно верхней, левой, нижней и правой границ, как это обычно делается с Canvas. Однако для каждого подэлемента могут быть определены значения Height и Width (наряду с другими значениями свойств) для управления общим размером контейнера.

Поскольку содержимое внутри WrapPanel не стыкуется к определенной стороне панели, порядок определения элементов важен (содержимое визуализируется от первого элемента к последнему).

Панель WrapPanel располагает элементы управления в доступном пространстве — по одной строке или колонке за раз. По умолчанию свойство WrapPanel.Orientation установлено в Horizontal; элементы управления располагаются слева направо, затем — в следующих строках. Установка значения Vertical для свойства WrapPanel.Orientation приводит к размещению элементов в нескольких колонках.

Подобно StackPanel, панель WrapPanel действительно предназначена для управления мелкими деталями пользовательского интерфейса, а не компоновкой всего окна. Например, WrapPanel можно использовать для удержания вместе кнопок в элементе управления, подобном панели инструментов.

Ниже приведен пример:

<WrapPanel Background="LightSteelBlue">
        <Label Content="MyWrapPanel" Width="330" />
        <Label Content="Label 1" />
        <TextBox Width="190"></TextBox>
        <Label Content="Label2"></Label>
        <TextBox Width="190"></TextBox>
        <Label Content="Label3"></Label>
        <TextBox Width="190"></TextBox>
        <Button Width="80">OK</Button>
</WrapPanel>
WrapPanel

По умолчанию содержимое WrapPanel перетекает слева направо. Однако если изменить значение свойства Orientation на Vertical, то содержимое будет располагаться сверху вниз.

Панель WrapPanel (как и некоторые другие типы панелей) может быть объявлена с указанием значений ItemWidth и ItemHeight, которые управляют размером по умолчанию каждого элемента. Если подэлемент не предоставляет собственные значения Height и/или Width, он позиционируется относительно размера установленного для него панелью. Рассмотрим следующую разметку:

<WrapPanel Background="LightSteelBlue" ItemWidth="200" ItemHeight="30">
        <Label Content="MyWrapPanel" FontSize="15" />
        <Label Content="Label 1" />
        <TextBox></TextBox>
        <Label Content="Label2"></Label>
        <TextBox></TextBox>
        <Label Content="Label3"></Label>
        <TextBox></TextBox>
        <Button Width="80">OK</Button>
</WrapPanel>
WrapPanel устанавливает ширину и высоту каждого заданного элемента

Взглянув на рисунок, трудно не согласиться с тем, что WrapPanel — обычно не лучший выбор для непосредственного расположения содержимого в окне, поскольку его элементы могут перемешиваться, когда пользователь изменяет размеры окна. В большинстве случаев WrapPanel будет подэлементом панели другого типа, позволяя небольшой области окна заворачивать свое содержимое при изменении размера (как, например, элемент управления Toolbar).

Пройди тесты
Лучший чат для C# программистов