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

Главные темы настоящей главы:

□ привязка данных;

□ команды;

□ анимация;

□ 3-D;

□ интеграция Windows Forms.

Привязка данных

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

□ общий обзор;

□ привязка с XAML;

□ привязка простого объекта;

□ объектный поставщик данных;

□ привязка списка;

□ привязка к XML.

Общий обзор

В привязке данных WPF целью может быть любое свойство зависимости элемента WPF, и каждое свойство объекта CLR может служить источником. Поскольку элемент WPF реализован как класс .NET, каждый элемент WPF также может служить источником данных. На рис. 35.1 показана связь между источником и целью. Объект Binding определяет соединение.

Цель

Источник

Объект зависимости

Свойство зависимости

Привязка

Объект CLR

Свойство

Рис. 35.1. Связь между источником и цвелью

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

В табл. 35.1 перечислены режимы привязки и их требования.

Таблица 35.1. Режим привязки

Режим привязки

Описание

Однократная (OneTime)

Однонаправленная (OneWay)

Двунаправленная (TwoWay)

Однонаправленная к источнику

(OneWayToSource)

Привязка направлена от источника к цели и происходит лишь однажды, при запуске приложения или изменении контекста данных. Здесь вы получаете снимок данных.

Привязка направлена от источника к цели. Это удобно для доступа к данным, позволяющим только чтение, поскольку нет необходимости изменять исходные данные источника через пользовательский интерфейс. Чтобы получить обновления в пользовательский интерфейс, источник должен реализовать интерфейс INotifyPropertyChanged.

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

При однонаправленной привязке к источнику, если целевое свойство меняется, то обновляется исходный объект.

Привязка с XAML

Элемент WPF может не только служить целью для привязки данных, но с тем же успехом может служить и источником. Вы можете привязать некоторое свойство одного компонента WPF к цели из другого элемента wPf.

В следующем примере используется забавная рожица, которую мы создали ранее и которая состоит из фигур WPF; она привязывается к бегунку (slider), чтобы можно было двигать ее в пределах окна. Slider - элемент-источник по имени slider. Свойство Value дает действительное значение позиции бегунка. Целью привязки данных будет внутренний элемент Canvas . Внутренний элемент Canvas по имени FunnyFace содержит все фигуры, необходимые для рисования рожицы. Это полотно (canvas) содержится внутри внешнего элемента Canvas, так что ее можно позиционировать внутри внешнего элемента, изменяя присоединенные свойства. Присоединенное

свойство Canvas.Left устанавливает расширение маркировки Binding, ElementName устанавливается в slider для ссылки на WPF элемент-бегунок, а Path устанавливается в Value, чтобы получать значение из свойства Value.

<Window x:Class= DataBindingSample.Window1

xmlns= http: schemas.microsoft.com/winfx/20 06/xaml/presentation xmlns:x= http: schemas.microsoft.com/winfx/200 6/xaml Title= Data Binding Height= 345 Width= 310 > <StackPanel>

<Canvas Height= 210 Width= 280 > <Canvas Canvas.Top= 0

Canvas.Left= {Binding Path=Value, ElementName=slider} Name= FunnyFace Height= 210 Width= 230 > <Ellipse Canvas.Left= 20 Canvas.Top= 50 Width= 100 Height= 100

Stroke= Blue StrokeThickness= 4 Fill= Yellow /> <Ellipse Canvas.Left= 40 Canvas.Top= 65 Width= 25 Height= 25

Stroke= Blue StrokeThickness= 3 Fill= White /> <Ellipse Canvas.Left= 50 Canvas.Top= 75 Width= 5 Height= 5

Fill= Black /> <Path Name= mouth Stroke= Blue StrokeThickness= 4 Data= M 32,125 Q 65,122 72,108 />

StrokeThickness= 4 StrokeThickness= 4 Stroke= Blue StrokeThickness= 4

/> /> />

Y2= 168 Stroke= Blue StrokeThickness= 4 />

<Line X1= 94 X2= 102 Y1= 144 Y2= 166 Stroke= Blue

<Line X1= 84 X2= 103 Y1= 169 Y2= 166 Stroke= Blue <Line X1= 62 X2= 52 Y1= 146 Y2= 168 <Line X1= 38 X2= 53 Y1=

</Canvas> </Canvas>

<Slider Name= slider Orientation= Horizontal Value= 10 Maximum= 100 />

</StackPanel> </Window>

Запустив приложение, вы сможете перемещать бегунок, при этом рожица будет перемещаться, что можно видеть на рисунках 35.2 и 35.3.

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

<Canvas Canvas.Top= 0

Canvas.Left= {Binding Path=Value, ElementName=slider}

Name= FunnyFace Height= 210 Width= 230 >

При этом вам нужно будет создать новый объект Binding и установить свойства Path и Source. Свойство Source должно быть установлено на объект-источник. В данном случае это будет объект WPF slider. Path устанавливается в экземпляр PropertyPath, инициализируемый именем свойства объекта-источника - Value.

Рис. 35.2. Перемещение рожицы вправо

Рис. 35.3. Перемещение рожицы влево