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

Троелсен Эндрю

// Очистить все штрихи.

this.MyInkCanvas.Strokes.Clear;

}

Теперь должна появиться возможность сохранения данных в файле, их загрузки из файла и очистки

InkCanvas

от всех данных. Таким образом, работа с первой вкладкой элемента управления

TabControl

завершена, равно как и исследование интерфейса Ink API. Конечно, о технологии Ink API можно рассказать еще много чего, но теперь вы должны обладать достаточными знаниями,

чтобы продолжить изучение темы самостоятельно. Далее вы узнаете, как применять привязку данных WPF.

Введение в модель привязки данных WPF

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

• отмечать флажок элемента управления

Checkbox

на основе булевского свойства заданного объекта:

• отображать в элементах

TextBox

информацию, извлеченную из реляционной базы данных:

• подключать элемент

Label

к целому числу, представляющему количество файлов в папке.

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

CheckBox

или

TextBox

).

В дополнение к привязке традиционных данных инфраструктура WPF делает возможной привязку элементов, как было продемонстрировано в предшествующих примерах. Это значит, что можно привязать (скажем) видимость свойства к свойству состояния отметки флажка. Такое действие было определенно возможным в Windows Forms, но требовало реализации через код. Инфраструктура WPF предлагает развитую экосистему привязки данных, которая способна почти целиком поддерживаться в разметке. Она также позволяет обеспечивать синхронизацию источника и цели в случае изменения значений данных.

Построение вкладки Data Binding

В окне Document Outline замените элемент управления

Grid

во второй вкладке панелью

StackPanel

. Создайте следующую начальную компоновку с применением панели инструментов и окна Properties среды Visual Studio:

<TabItem x:Name="tabDataBinding" Header="Data Binding">

<StackPanel Width="250">

<Label Content="Move the scroll bar to see the current value"/>

<!-- Значение

линейки прокрутки является источником этой привязки данных -->

<ScrollBar x:Name="mySB" Orientation="Horizontal" Height="30"

Minimum = "1" Maximum = "100" LargeChange="1" SmallChange="1"/>

<!-- Содержимое метки будет привязано к линейке прокрутки -->

<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue"

BorderThickness="2" Content = "0"/>

</StackPanel>

</TabItem>

Обратите внимание, что объект

ScrollBar

(названный здесь

mySB

) сконфигурирован с диапазоном от

1

до

100

. Цель заключается в том, чтобы при изменении положения ползунка линейки прокрутки (либо по щелчку на символе стрелки влево или вправо) элемент

Label

автоматически обновлялся текущим значением. В настоящий момент значение свойства

Content

элемента управления

Label

установлено в

"0"

; тем не менее, оно будет изменено посредством операции привязки данных.

Установка привязки данных

Механизмом, обеспечивающим определение привязки в разметке XAML, является расширение разметки

{Binding}

. Хотя привязки можно определять посредством Visual Studio, это столь же легко делать прямо в разметке. Отредактируйте разметку XAML свойства

Content

элемента

Label

по имени

labelSBThumb

следующим образом:

<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2"

Content = "{Binding Path=Value, ElementName=mySB}"/>

Обратите внимание на значение, присвоенное свойству

Content

элемента

Label

. Конструкция

{Binding}

обозначает операцию привязки данных. Значение

ElementName

представляет источник операции привязки данных (объект

ScrollBar

), a

Path

указывает свойство, к которому осуществляется привязка (свойство

Value

линейки прокрутки).

Если вы запустите программу снова, то обнаружите, что содержимое метки обновляется на основе значения линейки прокрутки по мере перемещения ползунка.

Свойство DataContext

Для определения операции привязки данных в XAML может использоваться альтернативный формат, при котором допускается разбивать значения, указанные расширением разметки

{Binding}

, за счет явной установки свойства

DataContext

в источник операции привязки: