Язык программирования C#9 и платформа .NET5

Имейте в виду, что для того, чтобы разделитель был виден на экране, потребуется присвоить значение его свойству 
Width
 или 
Height
 (в зависимости от вертикального или горизонтального разделения). Ниже показана простая панель 
Grid
 с разделителем на первой колонке (
Grid.Column="0"
) из файла 
GridWithSplitter.xaml
:
<Grid Background ="LightSteelBlue">
<b>  &lt;!-- Определить колонки --&gt;</b>
  &lt;Grid.ColumnDefinitions&gt;
    &lt;ColumnDefinition Width =&quot;Auto&quot;/&gt;
    &lt;ColumnDefinition/&gt;
  &lt;/Grid.ColumnDefinitions&gt;
<b> &lt;!— Добавить метку в ячейку 0 --&gt;</b>
  &lt;Label x:Name=&quot;lblLeft&quot; Background =&quot;GreenYellow&quot;
         Grid.Column=&quot;0&quot; Content =&quot;Left!&quot;/&gt;
<b> &lt;!-- Определить разделитель —&gt;</b>
  &lt;GridSplitter Grid.Column =&quot;0&quot; Width =&quot;5&quot;/&gt;
<b>  &lt;!-- Добавить метку в ячейку 1 -- &gt;</b>
  &lt;Label x:Name=&quot;lblRight&quot; Grid.Column =&quot;1&quot; Content =&quot;Right!&quot;/&gt;
&lt;/Grid&gt;
Прежде всего, обратите внимание, что колонка, которая будет поддерживать разделитель, имеет свойство 
Width
, установленное в 
Auto
. Вдобавок элемент 
GridSplitter
 использует синтаксис присоединяемых свойств для указания, с какой колонкой он работает. В выводе (рис. 25.7) можно заметить 5-пиксельный разделитель, который позволяет изменять размер каждого элемента 
Label
. Из-за того, что для элементов 
Label
 не было задано свойство 
Height
 или 
Width
, они заполняют всю ячейку.
  
Позиционирование содержимого внутри панелей DockPanel
 
Панель 
DockPanel
 обычно применяется в качестве контейнера, который содержит любое количество дополнительных панелей для группирования связанного содержимого. Панели 
DockPanel
 используют синтаксис присоединяемых свойств (как было показано в типах 
Canvas
 и 
Grid
) для управления местом, куда будет пристыковываться каждый элемент внутри 
DockPanel
.
В файле 
SimpleDockPanel.xaml
 определена следующая простая панель 
DockPanel
, которая дает результат, показанный на рис. 25.8:
 
&lt;DockPanel LastChildFill =&quot;True&quot; Background=&quot;AliceBlue&quot;&gt;
  &lt;! -- Стыковать элементы к панели -- &gt;
  &lt;Label DockPanel.Dock =&quot;Top&quot; Name=&quot;lblInstruction&quot; FontSize=&quot;15&quot;
      Content=&quot;Enter Car 
Information&quot;/&gt;
  &lt;Label DockPanel.Dock =&quot;Left&quot; Name=&quot;lblMake&quot; Content=&quot;Make&quot;/&gt;
  &lt;Label DockPanel.Dock =&quot;Right&quot; Name=&quot;lblColor&quot; Content=&quot;Color&quot;/&gt;
  &lt;Label DockPanel.Dock =&quot;Bottom&quot; Name=&quot;lblPetName&quot; Content=&quot;Pet Name&quot;/&gt;
  &lt;Button Name=&quot;btnOK&quot; Content=&quot;OK&quot;/&gt;
&lt;/DockPanel&gt;
На заметку! Если добавить множество элементов к одной стороне 
DockPanel
, то они выстроятся вдоль указанной грани в порядке их объявления.
Преимущество применения типов 
DockPanel
 заключается в том, что при изменении пользователем размера окна каждый элемент остается прикрепленным к указанной (посредством 
DockPanel.Dock
) стороне панели. Также обратите внимание, что внутри открывающего дескриптора 
DockPanel
 в этом примере атрибут 
LastChildFill
 установлен в 
true
. Поскольку элемент 
Button
 на самом деле является "последним дочерним" элементом в контейнере, он будет растянут, чтобы занять все оставшееся пространство.
  
Включение прокрутки в типах панелей
 
Полезно упомянуть, что в рамках инфраструктуры WPF поставляется класс 
ScrollViewer
, который обеспечивает автоматическое поведение прокрутки данных внутри объектов панелей. Вот как он определяется в файле 
SimpleScrollViewer.xaml
:
&lt;ScrollViewer&gt;
  &lt;StackPanel&gt;
    &lt;Button Content =&quot;First&quot; Background = &quot;Green&quot; Height =&quot;50&quot;/&gt;
    &lt;Button Content =&quot;Second&quot; Background = &quot;Red&quot; Height =&quot;50&quot;/&gt;
    &lt;Button Content =&quot;Third&quot; Background = &quot;Pink&quot; Height =&quot;50&quot;/&gt;
    &lt;Button Content =&quot;Fourth&quot; Background = &quot;Yellow&quot; Height =&quot;50&quot;/&gt;
    &lt;Button Content =&quot;Fifth&quot; Background = &quot;Blue&quot; Height =&quot;50&quot;/&gt;