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


Упорядочивание объектов в макеты-контейнеры в конструкторе XAML

В этой статье описываются панели макета и элементы управления для конструктора XAML.

Представьте, где вы хотите, чтобы объекты отображались на странице — такие объекты, как изображения, кнопки и видео. Возможно, необходимо отобразить их в строку или в столбец, в одну линию по вертикали или по горизонтали или в фиксированных позициях.

После того как вы распланировали структуру страницы, выберите панель макета. Создание любой страницы начинается с одного и того же, поскольку необходима база, к которой будут добавляться все объекты. По умолчанию это Сетка, но этот параметр можно изменить.

Панели макета помогут упорядочить объекты на странице, а также предоставят дополнительные возможности. Они помогут разработать страницы с учетом различных размеров и разрешений экрана. При запуске приложения размер всех элементов на панели макета изменяется в соответствии с действительными размерами экрана данного устройства. Конечно, если вам не требуется изменения размера, то вы можете переопределить это поведение для части макета или всего макета. Для этого можно использовать свойства высоты и ширины.

Панели макета

Запустите страницу, выбрав одну из таких панелей макета. Ваша страница может иметь несколько панелей макета. Например, вы можете начать работу с панели макета Сетка, а затем добавить в определенную область Сетки элемент StackPanel, чтобы можно было расположить элементы управления по вертикали в этой области.

Следующие панели макета используются наиболее часто, но существуют и другие. Их можно найти на панели элементов в Visual Studio или на панели Ресурсы в Blend для Visual Studio.

Сетка

Упорядочивание объектов по строкам и столбцам.

Панель макета Grid

UniformGrid

Равномерное или однородное упорядочивание объектов в областях сетки. Эта панель отлично подходит для упорядочивания списка изображений.

(доступно только для проектов WPF)

Панель макета UniformGrid

Холст

Упорядочивание объектов любым образом При запуске приложения пользователями эти элементы будут иметь фиксированные позиции на экране.

Панель макета Canvas

StackPanel

Расположение объектов в одну линию по вертикали или по горизонтали.

Панель макета StackPanel

WrapPanel

Упорядочивание объектов последовательно в направлении слева направо. Когда место закончится и строка достигнет края справа, то панель перенесет содержимое на следующую строку, и так будет повторяться раз за разом слева направо и сверху вниз. Вы также можете задать вертикальную ориентацию панели с переносом, чтобы объекты переносились в другой очередности: сверху вниз и слева направо.

(доступно только для проектов WPF)

Панель макета WrapPanel

DockPanel

Размещение элементов происходит таким образом, чтобы они оставались или были закрепленными у одного края панели.

(доступно только для проектов WPF)

Панель макета DockPanel

Посмотрите короткое видео: Кнопка воспроизведения WPF - DockPanel

Элементы управления макета

Вы также можете добавить объекты к элементам управления. Они не так многофункциональны, как панель макета, но также могут оказаться полезными в определенных случаях.

Перечисленные ниже элементы управления макета используются наиболее часто, но существуют и другие. Их можно найти на панели элементов в Visual Studio или на панели Ресурсы в Blend для Visual Studio.

Граница

Создайте границу, фон или одновременно границу и фон вокруг объекта. Для границы можно добавить только один объект. Если вы хотите применить границу или фон для нескольких объектов, добавьте панель макета для границы. Затем добавьте объекты для панели или элемента управления.

Элемент управления макета Border

Отображение информации или параметров для пользователей в окне. Для элемента Всплывающее окно можно добавить только один объект. По умолчанию Всплывающее окно содержит параметр Сетка, но его можно изменить.

ScrollViewer

Предоставляет пользователям возможность прокручивать вниз страницу или часть страницы. Для элемента ScrollViewer можно добавить только один объект, поэтому важно добавить панель макета, например Сетка или StackPanel.

Элемент управления макета ScrollViewer

Viewbox

Масштабирование объектов способом, аналогичным масштабированию с помощью элемента управления масштабом. Для панели Viewbox можно добавить только один объект. Чтобы применить этот эффект к нескольким объектам, добавьте панель макета для ViewBox, а затем добавьте элементы управления для этой панели макета.

Элемент управления макета ViewBox