GridSplitter - разделенные окна

33

Каждый пользователь Windows встречался с разделительными полосами — перемещаемыми разделителями, которые отделяют одну часть окна от другой. Например, в проводнике Windows слева находится список папок, а справа — список файлов. Перетаскивая разделительную полосу, можно устанавливать пропорции между этими двумя панелями в окне.

В WPF полосы разделителей представлены классом GridSplitter и являются средствами Grid. Добавляя GridSplitter к Grid, вы предоставляете пользователю возможность изменения размеров строк и колонок.

Большинство программистов считают GridSplitter наиболее интуитивно понятной частью WPF. Чтобы разобраться, как использовать его для получения требуемого эффекта, нужно лишь немного поэкспериментировать. Ниже предлагается несколько подсказок:

Изменить поведение установки размеров можно через свойства ResizeDirection и ResizeBehavior объекта GridSplitter. Однако проще поставить это поведение в зависимость от установок выравнивания, что и принято по умолчанию.

Еще не запутались? Чтобы закрепить эти правила, стоит взглянуть на реальный код примера:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Элемент Grid" Height="250" Width="380">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition Width="auto"></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Button>Button1</Button>
        <Button Grid.Column="2">Button2</Button>
        <Button Grid.Row="1">Button3</Button>
        <Button Grid.Row="1" Grid.Column="2">Button4</Button>
        <GridSplitter Grid.Row="0" Grid.Column="1" Grid.RowSpan="2" Width="5"
                      VerticalAlignment="Stretch" HorizontalAlignment="Center"></GridSplitter>
    </Grid>
</Window>
GridSplitter

Эта разметка включает одну дополнительную деталь. Когда объявляется GridSplitter, свойство ShowsPreview устанавливается в false. В результате, когда полоса разделителя перетаскивается от одной стороны к другой, колонки немедленно изменяют свой размер. Но если установить ShowsPreview в true, то при перетаскивании отображается лишь серая тень, следующая за курсором мыши, которая показывает, куда попадет разделитель после отпускания кнопки мыши. Вплоть до этого момента колонки изменять размеры не будут. После получения фокуса элементом GridSplitter для изменения размера можно также использовать клавиши со стрелками.

ShowsPreview — не единственное свойство GridSplitter, которое доступно для установки. Можно также изменить свойство DragIncrement, если полоса разделителя должна перемещаться "шагами" (например, по 10 единиц за раз). Для управления минимально и максимально допустимыми размерами колонок просто устанавливаются соответствующие свойства в разделе ColumnDefinitions, как было показано в предыдущем примере.

Обычно Grid содержит не более одного GridSplitter. Тем не менее, можно вкладывать один Grid в другой, и при этом каждый из них будет иметь собственный GridSplitter. Это позволяет создавать окна, которые разделены на две области (например, на левую и правую панель), одна из которых (скажем, правая), в свою очередь, также разделена на два раздела (на верхний и нижний с изменяемыми размерами).

CodeChick.io - Задачи по программированию с автоматической проверкой
Пройди тесты
Лучший чат для C# программистов