Przewodnik: wiązanie z danymi w projektancie XAML

W Projektant XAML można ustawić właściwości powiązania danych przy użyciu tablicy grafiki i okno Właściwości. W przykładzie w tym przewodniku pokazano, jak powiązać dane z kontrolką. W szczególności przewodnik pokazuje, jak utworzyć prostą klasę koszyka zakupów, która ma właściwość DependencyProperty o nazwie ItemCount, a następnie powiązać ItemCount właściwość z właściwością Text kontrolki TextBlock.

Aby utworzyć klasę do użycia jako źródło danych

1. W menu Plik wybierz pozycję Nowy>projekt.

2. W oknie dialogowym Nowy projekt wybierz węzeł Visual C# lub Visual Basic, rozwiń węzeł Pulpit systemu Windows, a następnie wybierz szablon Aplikacja WPF.

3. Nadaj projektowi nazwę BindingTest, a następnie wybierz przycisk OK .

4. Otwórz plik MainWindow.xaml.cs (lub MainWindow.xaml.vb) i dodaj następujący kod. W języku C#dodaj kod w BindingTest przestrzeni nazw (przed końcowym nawiasem zamykającym w pliku). W języku Visual Basic wystarczy dodać nową klasę.

   C#

   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));
   }
   

   VB

   Public Class ShoppingCart
       Inherits DependencyObject
   
       Public Shared ReadOnly ItemCountProperty As DependencyProperty = DependencyProperty.Register(
            "ItemCount", GetType(Integer), GetType(ShoppingCart), New PropertyMetadata(0))
       Public Property ItemCount As Integer
           Get
               ItemCount = CType(GetValue(ItemCountProperty), Integer)
           End Get
           Set(value As Integer)
               SetValue(ItemCountProperty, value)
           End Set
       End Property
   End Class
   

   Ten kod ustawia wartość 0 jako domyślną liczbę elementów przy użyciu obiektu PropertyMetadata .

5. W menu Plik wybierz pozycję Kompiluj rozwiązanie kompilacji>.

Aby powiązać właściwość ItemCount z kontrolką TextBlock

1. W Eksplorator rozwiązań otwórz menu skrótów dla pliku MainWindow.xaml i wybierz pozycję Wyświetl Projektant.

2. W przyborniku wybierz kontrolkę Siatka i dodaj ją do formularza.

3. Po wybraniu wartości Grid w okno Właściwości wybierz przycisk Nowy obok właściwości DataContext.

4. W oknie dialogowym Wybieranie obiektu upewnij się, że pole wyboru Pokaż wszystkie zestawy zostało wyczyszczone, wybierz pozycję ShoppingCart w obszarze Przestrzeni nazw BindingTest, a następnie wybierz przycisk OK.

   Na poniższej ilustracji przedstawiono okno dialogowe Wybieranie obiektu z wybraną pozycją ShoppingCart .

   

5. W przyborniku wybierz kontrolkęTextBlock, aby dodać ją do formularza.

6. Po wybraniu TextBlock kontrolki w okno Właściwości wybierz znacznik właściwości po prawej stronie właściwości Text, a następnie wybierz pozycję Utwórz powiązanie danych. (Znacznik właściwości wygląda jak małe pole).

7. W oknie dialogowym Tworzenie powiązania danych w polu Ścieżka wybierz właściwość ItemCount : (int32), a następnie wybierz przycisk OK .

   Na poniższej ilustracji przedstawiono okno dialogowe Tworzenie powiązania danych z wybraną właściwością ItemCount .

   

8. Naciśnij klawisz F5 , aby uruchomić aplikację.

   Kontrolka TextBlock powinna wyświetlać wartość domyślną 0 jako tekst.

Napiwek

Aby uzyskać więcej informacji na temat powiązania danych, zobacz Wiązanie kontrolek z danymi w programie Visual Studio.

Powiązana zawartość

• Tworzenie interfejsu użytkownika przy użyciu projektanta XAML
• Okno dialogowe Dodawanie konwertera wartości