Сводка Глава 16.Summary of Chapter 16. привязка данных,Data binding

Загрузить образец загрузить примерDownload Sample Download the sample

Примечание

Заметки на этой странице указывать области, где различаются Xamarin.Forms материал, представленный в книге.Notes on this page indicate areas where Xamarin.Forms has diverged from the material presented in the book.

Программистов часто оказываются написания обработчиков событий, которые позволяют обнаружить при изменении свойства одного объекта и использовать его для изменения значения свойства в другой объект.Programmers often find themselves writing event handlers that detect when a property of one object has changed, and use that to change the value of a property in another object. Этот процесс можно автоматизировать при помощи метод привязки данных.This process can be automated with the technique of data binding. Привязки данных обычно определяется в XAML и становятся частью определения пользовательского интерфейса.Data bindings are usually defined in XAML and become part of the definition of the user interface.

Очень часто эти привязки данных соединиться с объектами пользовательского интерфейса базовых данных.Very often, these data bindings connect user-interface objects to underlying data. Это метод, который рассматривается в более Глава 18. MVVM.This is a technique that is explored more in Chapter 18. MVVM. Тем не менее привязки данных можно также подключиться два или более элементов пользовательского интерфейса.However, data bindings can also connect two or more user-interface elements. В большинстве примеров раннего связывания с данными в этой главе демонстрации этого метода.Most of the early examples of data binding in this chapter demonstrate this technique.

Основы привязкиBinding basics

Несколько свойств, методов и классов участвуют в привязке данных.Several properties, methods, and classes are involved in data binding:

Следующие два класса поддержки расширения разметки XAML для привязки:The following two classes support XAML markup extensions for bindings:

В привязке данных участвуют два интерфейса:Two interfaces are involved in data binding:

  • INotifyPropertyChanged в System.ComponentModel является пространство имен для реализации уведомлений при изменении свойстваINotifyPropertyChanged in the System.ComponentModel namespace is for implementing notification when a property changes
  • IValueConverter используется для определения небольших классов, которые преобразуют значения из одного типа в другой в привязках данныхIValueConverter is used to define small classes that convert values from one type to another in data bindings

Привязка данных связывает два свойства и тот же объект или (обычно) двух различных объектов.A data binding connects two properties of the same object, or (more commonly) two different objects. Эти свойства называются источника и целевой.These two properties are referred to as the source and the target. Как правило изменение свойства источника вызывает изменение в целевое свойство, но иногда задается обратное направление.Generally, a change in the source property causes a change to occur in the target property, but sometimes the direction is reversed. Независимо от того:Regardless:

  • целевой свойство должно поддерживаться BindablePropertythe target property must be backed by a BindableProperty
  • источника свойства обычно является членом класса, реализующего INotifyPropertyChangedthe source property generally is a member of a class that implements INotifyPropertyChanged

Класс, реализующий INotifyPropertyChanged активируется PropertyChanged событие при изменении значения свойства.A class that implements INotifyPropertyChanged fires a PropertyChanged event when a property changes value. BindableObject реализует INotifyPropertyChanged и автоматически запускает PropertyChanged событие, когда свойство BindableProperty изменения значения, но вы можете написать свои собственные классы, реализующие INotifyPropertyChanged не на основе BindableObject.BindableObject implements INotifyPropertyChanged and automatically fires a PropertyChanged event when a property backed by a BindableProperty changes values, but you can write your own classes that implement INotifyPropertyChanged without deriving from BindableObject.

Код и XAMLCode and XAML

OpacityBindingCode образце показано, как задать привязку данных в коде:The OpacityBindingCode sample demonstrates how to set a data binding in code:

  • Источником является Value свойство SliderThe source is the Value property of a Slider
  • Целевой объект — Opacity свойство LabelThe target is the Opacity property of a Label

Два объекта подключены, задав BindingContext из Label объект Slider объекта.The two objects are connected by setting the BindingContext of the Label object to the Slider object. Два свойства подключены, вызвав SetBinding метод расширения в Label ссылки на OpacityProperty свойство, используемое и Value свойство Slider выражается Строка.The two properties are connected by calling a SetBinding extension method on the Label referencing the OpacityProperty bindable property and the Value property of the Slider expressed as a string.

Управление Slider затем вызывает Label для исчезновения и появления.Manipulating the Slider then causes the Label to fade in and out of view.

OpacityBindingXaml является той же программе, с привязкой данных, задать в XAML.The OpacityBindingXaml is the same program with the data binding set in XAML. BindingContext Из Label присваивается x:Reference ссылки на расширения разметки Sliderи Opacity свойство Label присваивается Binding расширения разметки с его Path ссылается на свойство Value свойство Slider.The BindingContext of the Label is set to an x:Reference markup extension referencing the Slider, and the Opacity property of the Label is set to the Binding markup extension with its Path property referencing the Value property of the Slider.

Источник и BindingContextSource and BindingContext

BindingSourceCode пример альтернативный подход в коде.The BindingSourceCode sample shows an alternative approach in code. Объект Binding объекта создается путем установки Source свойства Slider объекта и Path свойство «Value».A Binding object is created by setting the Source property to the Slider object and the Path property to "Value". SetBinding Метод BindableObject потом вызывается через Label объекта.The SetBinding method of BindableObject is then called on the Label object.

Binding Конструктор может также использоваться для определения Binding объекта.The Binding constructor could also have been used to define the Binding object.

BindingSourceXaml примере показан метод сопоставимых в XAML.The BindingSourceXaml sample shows the comparable technique in XAML. Opacity Свойство Label присваивается Binding расширения разметки с Path присвоено Value свойство и Source значение внедренные x:Reference расширение разметки.The Opacity property of the Label is set to a Binding markup extension with Path set to the Value property and Source set to an embedded x:Reference markup extension.

Таким образом существует два способа для ссылки на объект источника привязки:In summary, there are two ways to reference the binding source object:

  • Через BindingContext свойства целевого объектаThrough the BindingContext property of the target
  • Через Source свойство Binding сам объектThrough the Source property of the Binding object itself

Если указаны оба аргумента, второй имеет приоритет.If both are specified, the second takes precedence. Преимущество BindingContext — что она распространяется по визуальному дереву.The advantage of the BindingContext is that it is propagated through the visual tree. Это очень удобно в том случае, если несколько целевые свойства привязаны к тому же объекту источника.This is very handy if multiple target properties are bound to the same source object.

WebViewDemo программа демонстрирует этот прием с WebView элемент.The WebViewDemo program demonstrates this technique with the WebView element. Два Button элементы для перемещения назад и вперед наследуют BindingContext из своего родительского объекта, который ссылается на WebView.Two Button elements for navigating backwards and forwards inherit a BindingContext from their parent that references the WebView. IsEnabled Свойства двух кнопок затем имеют простой Binding расширения разметки, предназначенных для кнопки IsEnabled свойства на основе параметров из CanGoBack и CanGoForward только для чтения свойства WebView.The IsEnabled properties of the two buttons then have simple Binding markup extensions that target the button IsEnabled properties based on the settings of the CanGoBack and CanGoForward read-only properties of the WebView.

Режим привязкиThe binding mode

Задайте Mode свойство Binding члену BindingMode перечисления:Set the Mode property of Binding to a member of the BindingMode enumeration:

  • OneWay Чтобы изменения в свойство источника на целевой объектOneWay so that changes in the source property affect the target
  • OneWayToSource Чтобы изменения в целевом свойстве влияет на источникOneWayToSource so that changes in the target property affect the source
  • TwoWay Чтобы изменения в исходной и целевой влияют друг на другаTwoWay so that changes in the source and target affect each other
  • Default Чтобы использовать DefaultBindingMode указываться, если целевой объект BindableProperty был создан.Default to use the DefaultBindingMode specified when the target BindableProperty was created. Если не указаны, по умолчанию используется OneWay для обычного свойства для привязки и OneWayToSource для связывания свойства только для чтения.If none was specified, the default is OneWay for normal bindable properties, and OneWayToSource for read-only bindable properties.

Примечание

BindingMode Перечисления теперь также включает OnTime применения привязки только в том случае, при изменении контекста привязки, а не при изменении свойства источника.The BindingMode enumeration now also includes OnTime for applying a binding only when the binding context changes and not when the source property changes.

Свойства, которые могут быть целевыми для привязки данных в сценариях MVVM, обычно имеют DefaultBindingMode из TwoWay.Properties that are likely to be the targets of data bindings in MVVM scenarios generally have a DefaultBindingMode of TwoWay. Эти особые значения приведены ниже.These are:

  • Value Свойство Slider и StepperValue property of Slider and Stepper
  • IsToggled Свойство SwitchIsToggled property of Switch
  • Text Свойство Entry, Editor, и SearchBarText property of Entry, Editor, and SearchBar
  • Date Свойство DatePickerDate property of DatePicker
  • Time Свойство TimePickerTime property of TimePicker

BindingModes в нем демонстрируется режимы четыре привязки с привязкой данных, где целевой объект — FontSize свойство Label , а источник Value Свойство Slider.The BindingModes sample demonstrates the four binding modes with a data binding where the target is the FontSize property of a Label and the source is the Value property of a Slider. Это позволит каждой Slider для управления размером шрифта соответствующего Label.This allows each Slider to control the font size of the corresponding Label. Но Slider элементы не инициализирован, поскольку DefaultBindingMode из FontSize свойство OneWay.But the Slider elements are not initialized because the DefaultBindingMode of the FontSize property is OneWay.

ReverseBinding пример задает привязки на Value свойство Slider ссылки на FontSize свойства каждого Label.The ReverseBinding sample sets the bindings on the Value property of the Slider referencing the FontSize property of each Label. Это кажется обратной, но лучше работает в инициализации Slider элементы поскольку Value свойство Slider имеет DefaultBindingMode из TwoWay.This appears to be backwards, but it works better in initialzing the Slider elements because the Value property of the Slider has a DefaultBindingMode of TwoWay.

Тройной снимок обратная привязкаTriple screenshot of Reverse Binding

Это аналогично определение привязки в MVVM и будем использовать этот тип привязки, часто.This is analogous to how bindings are defined in MVVM, and you'll use this type of binding frequently.

Форматирование строкиString formatting

Если целевое свойство имеет тип string, можно использовать StringFormat свойство, определенное BindingBase для преобразования источника в string.When the target property is of type string, you can use the StringFormat property defined by BindingBase to convert the source to a string. Задайте StringFormat свойства форматирования строки, которая использовалась бы с помощью статического .NET String.Format формата для отображения объекта.Set the StringFormat property to a .NET formatting string that you would use with the static String.Format format to display the object. При использовании этой строки форматирования внутри расширения разметки, заключите его в одинарные кавычки, не означает расширение разметки, внедренного, фигурные скобки.When using this formatting string within a markup extension, surround it with single quotation marks so the curly braces won't be mistaken for an embedded markup extension.

ShowViewValues образце показано, как использовать StringFormat в XAML.The ShowViewValues sample demonstrates how to use StringFormat in XAML.

WhatSizeBindings в нем демонстрируется отображение размер страницы с помощью привязки к Width и Height свойства ContentPage.The WhatSizeBindings sample demonstrates displaying the size of the page with bindings to the Width and Height properties of the ContentPage.

Почему он называется «Путь»?Why is it called "Path"?

Path Свойство Binding так называемых, так как это может быть ряд свойств и индексаторов, разделенных точками.The Path property of Binding is so called because it can be a series of properties and indexers separated by periods. BindingPathDemos примере показано несколько примеров.The BindingPathDemos sample shows several examples.

Привязка преобразователей значенийBinding value converters

Когда исходные и целевые свойства привязки расположены в различных типов, можно преобразовать с помощью привязки преобразователя типов.When the source and target properties of a binding are different types, you can convert between the types using a binding converter. Это класс, реализующий IValueConverter интерфейс, а также содержит два метода: Convert для преобразования источника к целевому объекту, и ConvertBack для преобразования целевой объект в источнике.This is a class that implements the IValueConverter interface and contains two methods: Convert to convert the source to the target, and ConvertBack to convert the target to the source.

IntToBoolConverter В класс Xamarin.FormsBook.Toolkit библиотеки является примером для преобразования int для bool.The IntToBoolConverter class in the Xamarin.FormsBook.Toolkit library is an example for converting an int to a bool. Он демонстрируется путем ButtonEnabler образец, который позволяет Button Если хотя бы один символ вводилось в Entry.It is demonstrated by the ButtonEnabler sample, which only enables the Button if at least one character has been typed into an Entry.

BoolToStringConverter Класса преобразует bool для string и определяет два свойства, чтобы указать, какой текст должны быть возвращены для false и true значения.The BoolToStringConverter class converts a bool to a string and defines two properties to specify what text should be returned for false and true values. BoolToColorConverter Похож.The BoolToColorConverter is similar. SwitchText образце показано использование этих двух преобразователи для отображения разных текстов в разные цвета на основе Switch параметр.The SwitchText sample demonstrates using these two converters to display different texts in different colors based on a Switch setting.

Универсальный BoolToObjectConverter можно заменить BoolToStringConverter и BoolToColorConverter и служить обобщенный bool-к-преобразователю отображаемых объектов любого типа.The generic BoolToObjectConverter can replace the BoolToStringConverter and BoolToColorConverter and serve as a generalized bool-to-object converter of any type.

Привязки и пользовательские представленияBindings and custom views

Вы можете упростить пользовательских элементов управления, с помощью привязки данных.You can simplify custom controls using data bindings. NewCheckBox.cs Файл кода определяет Text, TextColor, FontSize, FontAttributes, и IsChecked свойства, но не имеет логики для визуальных элементов элемента управления.The NewCheckBox.cs code file defines Text, TextColor, FontSize, FontAttributes, and IsChecked properties, but has no logic at all for the visuals of the control. Вместо этого NewCheckBox.cs.xaml файл содержит всю разметку для визуальных элементов элемента управления через привязки данных на Label элементы на основании свойства, определенные в файле кода.Instead the NewCheckBox.cs.xaml file contains all the markup for the control's visuals through data bindings on the Label elements based on the properties defined in the code-behind file.

NewCheckBoxDemo в нем демонстрируется NewCheckBox пользовательского элемента управления.The NewCheckBoxDemo sample demonstrates the NewCheckBox custom control.