Практическое руководство. Привязка данных в конструкторе XAML

В конструкторе XAML можно задать свойства привязки данных с помощью монтажной панели и окна свойств. Пример в этом разделе показывает, как выполнить привязку данных к элементу управления. В частности, процедура показывает, как создать простой класс корзины с DependencyPropertyItemCount, а затем привязать свойство ItemCount к свойству Text элемента управления TextBlock.

Создание класса для использования в качестве источника данных

  1. Создайте проект C# или Visual Basic в шаблоне пустого приложения.

  2. Откройте MainPage.xaml.cs (или MainPage.xaml.vb) и добавьте следующий код. В C# добавьте код в пространстве имен ИмяПроекта (перед последней закрывающей скобкой в файле). В Visual Basic просто добавьте новый класс.

    public class ShoppingCart : DependencyObject
    {
        public int ItemCount
        {
            get { return (int)GetValue(ItemCountProperty); }
            set { SetValue(ItemCountProperty, value); }
        }
    
        public static readonly DependencyProperty ItemCountProperty =
             DependencyProperty.Register("ItemCount", typeof(int),
             typeof(ShoppingCart), new PropertyMetadata(0));
    }
    
    

    Этот код задает значение 0 как число элементов по умолчанию с помощью объекта PropertyMetadata.

    СоветСовет

    В Visual Studio можно добавить код заглушки для свойства зависимостей, введя propdp внутри класса ShoppingCart, а затем нажать клавишу TAB.

  3. В меню Построение выберите команду Построить решение.

Привязка свойства ItemCount к элементу управления TextBlock

  1. Правой кнопкой мыши щелкните MainPage.xaml и выберите пункт Конструктор представлений.

  2. В окне "Структура документа" выберите корневую панель сетки, которая отображается в окне [Grid].

  3. Выбрав элемент управления Grid, нажмите кнопку Создать рядом с свойством DataContext в окне свойств.

  4. В диалоговом окне Выбор объекта убедитесь, что флажок Показать все сборки снят, затем выберите ShoppingCart в пространстве имен ИмяПроекта и щелкните ОК.

    На следующем рисунке показано диалоговое окно Выбор объекта с выбранным элементом ShoppingCart.

    Диалоговое окно "Выбор объекта"
  5. В Панели инструментов дважды щелкните элемент управления TextBlock, чтобы добавить его на монтажную панель.

  6. Выбрав элемент управления TextBlock, щелкните метку свойства справа от свойства Text в разделе "Общие" в окне свойств. (Метка свойства выглядит как небольшой квадрат.)

  7. Щелкните Создать привязку данных в итоговом меню.

  8. При выбранном типе привязки Контекст данных, который используется по умолчанию в списке Тип привязки выберите свойство ItemCount в окне Путь, а затем нажмите кнопку ОК.

    На следующем рисунке показано диалоговое окно Создать привязку данных с выбранным свойством ItemCount.

    Диалоговое окно "Создание привязки данных"
  9. Нажмите клавишу F5, чтобы выполнить приложение.

    Элемент управления TextBlock должен отображать значение по умолчанию 0 как текст.

Добавления сообщества

Показ:
© 2014 Microsoft