Файл: Федеральное государственное бюджетное образовательное учреждение высшего профессионального.docx

Скачать файл
Заказать решение

ВУЗ: Не указан

Категория: Не указан

Дисциплина: Не указана

Добавлен: 10.01.2024

Просмотров: 33

Скачиваний: 1

ВНИМАНИЕ! Если данный файл нарушает Ваши авторские права, то обязательно сообщите нам.

МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ РФ


Федеральное государственное бюджетное образовательное учреждение высшего профессионального образования

«Дагестанский государственный университет»

Методические указания к лабораторной работе №2


«Диспетчеры компоновки»

по дисциплине «Технологии программирования»



Окно WPF-приложения обычно представлено корневым элементом Window. Дочерним элементом корневого элемента является диспетчер компоновки, который в свою очередь содержит любое количество элементов (в том числе, вложенных диспетчеров компоновки), определяющих пользовательский интерфейс. Диспетчер компоновки является объектом класса, унаследованного от абстрактного класса System.Windows.Controls.Panel.

Основные панели (диспетчеры компоновки, контейнерные элементы управления) WPF:

Canvas
Элементы остаются в точности там, где были размещены во время проектирования

DockPanel
Привязывает содержимое к определенной стороне панели (Тор (верхняя), Bottom (нижняя), Left (левая) или Right (правая))

Grid
Располагает содержимое внутри серии ячеек, расположенных в табличной сетке

StackPanel
Выводит содержимое по вертикали или горизонтали, в зависимости от значения свойства Orientation

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



Диспетчер компоновки Canvas


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

Панель Canvas обладает следующим недостатком: элементы внутри Canvas не изменяются динамически при применении стилей или шаблонов.
Рассмотрим панель Canvas со следующим содержимым:




У элементов управления Label, TextBox, Button отсутствуют атрибуты Left и Top, поэтому для определения положения элементов на панели используется синтаксис присоединяемых свойств.



Пример работы приложения:




Для дочернего элемента необходимо указать привязку по вертикали (Canvas.Top или Canvas.Bottom) и привязку по горизонтали (Canvas.Left или Canvas.Right). Также можно (не обязательно) задать ширину и высоту элемента с помощью атрибутов Width и Height.

Таким образом, положение дочернего элемента управления можно задать относительно любого угла окна. Например, в следующем примере положение кнопки задано относительно нижнего правого угла окна:



...





Порядок объявления дочерних элементов управления определяет порядок их вывода на экран. В приведенном выше примере кнопка выводится перед текстовыми полями, т.к. она была объявлена в файле XAML последней.

Диспетчер компоновки WrapPanel



Панель WrapPanel выводит дочерние элементы последовательно слева направо (либо сверху вниз, если для атрибута Orientation установлено значение “Vertical”) и при достижении границы окна переходит на новую строку (столбец). При изменении размеров окна панель перераспределяет компоненты таким образом, чтобы они находились в окне.

Рассмотрим панель WrapPanel со следующим содержимым:




Пример работы приложения:








Диспетчер компоновки StackPanel



Панель StackPanel располагает содержащиеся в нем элементы управления либо в вертикальном столбце (по умолчанию), либо в горизонтальной строке (если в атрибут Orientation записано значение “Vertical”). Если в панель StackPanel добавлено больше элементов управления, чем может быть отображено по ширине/высоте StackPanel, лишние элементы обрезаются и не отображаются.

При выводе элементов сверху вниз элементы по умолчанию растягиваются по горизонтали. Это поведение можно изменить с помощью свойств HorizontalAlignment и VerticalAlignment.

Рассмотрим панель StackPanel со следующим содержимым:

HorizontalAlignment="Center">


Пример работы приложения:



Диспетчер компоновки DockPanel


Панель DockPanel пристыковывает дочерние элементы к различным сторонам панели: Top, Bottom, Left, Right. Атрибут LastChildFill по умолчанию имеет значение True, что означает, что последний дочерний элемент управления будет занимать всё оставшееся пространство панели.

Рассмотрим панель DockPanel со следующим содержимым:

LastChildFill="False">


Пример работы приложения:



Диспетчер компоновки Grid


Подобно HTML-таблице, панель Grid может состоять из набора ячеек, каждая из которых имеет свое содержимое. При определении панели Grid выполняются следующие шаги:

  1. Определение и конфигурирование каждого столбца.

  2. Определение и конфигурирование каждой строки.

  3. Назначение содержимого каждой ячейке сетки с использованием синтаксиса присоединяемых свойств.

Если не определить никаких строк и столбцов, то по умолчанию панель Grid будет состоять из одной ячейки, занимающей всю поверхность окна. Кроме того, если не указать ячейку для дочернего элемента, то он разместится в столбце 0 и строке 0.

Определение столбцов и строк выполняются за счет использования элементов и , которые содержат коллекции элементов и , соответственно.

Каждый дочерний элемент прикрепляется к ячейке сетки, используя присоединяемые свойства Grid.Row и Grid.Column. Левая верхняя ячейка определяется с помощью Grid.Column="0" и Grid.Row="0".

Рассмотрим панель Grid со следующим содержимым:

<Grid>


















Пример работы приложения:






Объединение ячеек осуществляется с помощью присоединяемых свойств Grid.ColumnSpan и Grid.RowSpan аналогично объединению ячеек в HTML-таблицах.

Рассмотрим панель Grid со следующим содержимым:

























Пример работы приложения:


При определении ряда можно задать его высоту с помощью атрибута Height, а при определении столбца можно задать его ширину с помощью атрибута Width. Значение этих атрибутов может быть следующим:

  • "Auto" - высота строчки (или ширина колонки) определяется её содержимым;

  • "Число" - высота строчки (или ширина колонки) равна указанному числу точек;

  • "*" - высота строчки (или ширина колонки) занимает всё свободное пространство. Если строчек (колонок) с таким значением атрибута несколько, то свободное пространство перераспределяется между ними.



Задание



Разработать приложение WPF со следующим графическим интерфейсом:

Смотрите также файлы