Упражнение 8. Панель Grid

В панели UniformGrid все ячейки имеют одинаковый размер. В некоторых случаях этого может быть недостаточно, тогда применяют более развитую панель Grid, у которой соседние строки могут иметь разную высоту, а соседние столбцы - разную ширину. Элемент Grid самый гибкий и универсальный из всех менеджеров размещения. Он восполняет применительно к окнам широко используемую в HTML функциональность элемента Table. Недаром мастер заготовки WPF -приложения первоначально включает в разметку именно элемент Grid.

Размещение в сетке Grid состоит из двух этапов: вначале выполняется определение строк и столбцов, а затем производится задание потомков и распределение их по слотам. Самый простой способ использования Grid, это задать свойства RowDefinitions и ColumnDefinitions, добавить несколько дочерних элементов и с помощью присоединенных к ним свойств Grid.Row и Grid.Column указать, какого потомка в какой слот (заготовленное место, ячейка) поместить. Но существуют и более тонкие настройки Grid, которые мы и рассмотрим в данном упражнении.

Создание заготовки приложения

  • Добавьте к решению новый проект WpfApp8 типа WPF Application и назначьте его стартовым
  • Заполните файл разметки Window1.xaml следующим кодом
<Window x:Class="WpfApp8.Window1" xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" Title="Упражнение 8. Панель Grid" Height="300" Width="300" Background="LightGray" > <TabControl> <TabItem Header="Grid 0"> </TabItem> <TabItem Header="Grid 1"> </TabItem> <TabItem Header="Grid 2"> </TabItem> <TabItem Header="Grid 3"> </TabItem> <TabItem Header="Grid 4"> </TabItem> <TabItem Header="Grid 5"> </TabItem> <TabItem Header="Grid 6"> </TabItem> <TabItem Header="Grid 7"> </TabItem> </TabControl></Window>
  • Запустите приложение

Первоначальный код является заготовкой для демонстрации вариантов работы с панелью Grid и в данном упражнении мы последовательно заполним все вкладки заготовки, изучая и иллюстрируя ее свойства. В ячейки сетки будем помещать кнопки и другие контейнеры, чтобы ощутить ее реакцию. Но нестоит забывать, что сама сетка как контейнер остается невидимой (если не задать ее фон), видна только выполнямая ею работа по размещению потомков.


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: