Bagikan melalui

Pengikatan dasar

  • Artikel

Browse sample. Telusuri sampel

Pengikatan data .NET Multi-platform App UI (.NET MAUI) menautkan sepasang properti antara dua objek, setidaknya salah satunya biasanya merupakan objek antarmuka pengguna. Kedua objek ini disebut target dan sumbernya:

  • Target adalah objek (dan properti) tempat pengikatan data diatur.
  • Sumbernya adalah objek (dan properti) yang dirujuk oleh pengikatan data.

Dalam kasus paling sederhana, data mengalir dari sumber ke target, yang berarti bahwa nilai properti target diatur dari nilai properti sumber. Namun, dalam beberapa kasus, data dapat secara alternatif mengalir dari target ke sumber, atau di kedua arah.

Penting

Target selalu merupakan objek tempat pengikatan data diatur meskipun menyediakan data daripada menerima data.

Pengikatan dengan konteks pengikatan

Pertimbangkan contoh XAML berikut, yang niatnya adalah memutar dengan memanipulasi LabelSlider:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DataBindingDemos.BasicCodeBindingPage"
             Title="Basic Code Binding">
    <StackLayout Padding="10, 0">
        <Label x:Name="label"
               Text="TEXT"
               FontSize="48"
               HorizontalOptions="Center"
               VerticalOptions="Center" />

        <Slider x:Name="slider"
                Maximum="360"
                VerticalOptions="Center" />
    </StackLayout>
</ContentPage>

Tanpa pengikatan data, Anda akan mengatur ValueChanged peristiwa Slider ke penanganan aktivitas yang mengakses Value properti dan Slider menetapkan nilai tersebut ke Rotation properti .Label Pengikatan data mengotomatiskan tugas ini, sehingga penanganan aktivitas dan kode di dalamnya tidak lagi diperlukan.

Anda dapat mengatur pengikatan pada instans kelas apa pun yang berasal dari BindableObject, yang mencakup Elementturunan , , VisualElementView, dan View . Pengikatan selalu diatur pada objek target. Pengikatan mereferensikan objek sumber. Untuk mengatur pengikatan data, gunakan dua anggota kelas target berikut:

  • Properti BindingContext menentukan objek sumber.
  • Metode SetBinding menentukan properti target dan properti sumber.

Dalam contoh ini, Label adalah target pengikatan, dan Slider adalah sumber pengikatan. Perubahan sumber Slider memengaruhi rotasi Label target. Data mengalir dari sumber ke target.

Metode yang SetBinding ditentukan oleh BindableObject memiliki argumen jenis BindingBase dari mana Binding kelas berasal, tetapi ada metode lain SetBinding yang ditentukan oleh BindableObjectExtensions kelas. Kode belakang untuk XAML menggunakan metode ekstensi yang lebih SetBinding sederhana dari BindableObjectExtensions kelas :

public partial class BasicCodeBindingPage : ContentPage
{
    public BasicCodeBindingPage()
    {
        InitializeComponent();

        label.BindingContext = slider;
        label.SetBinding(Label.RotationProperty, "Value");
    }
}

Objek Label adalah target pengikatan sehingga itulah objek tempat properti ini diatur dan di mana metode dipanggil. Properti BindingContext menunjukkan sumber pengikatan, yaitu Slider. Metode SetBinding ini dipanggil pada target pengikatan tetapi menentukan properti target dan properti sumber. Properti target ditentukan sebagai BindableProperty objek: Label.RotationProperty. Properti sumber ditentukan sebagai string dan menunjukkan Value properti .Slider

Penting

Properti target harus didukung oleh properti yang dapat diikat. Oleh karena itu, objek target harus merupakan instans kelas yang berasal dari BindableObject. Untuk informasi selengkapnya, lihat Properti yang dapat diikat.

Properti sumber ditentukan sebagai string. Secara internal, refleksi digunakan untuk mengakses properti aktual. Namun, dalam hal ini, Value properti juga didukung oleh properti yang dapat diikat.

Saat Anda memanipulasi Slider, rotasi Label yang sesuai:

Basic code binding.

Atau, pengikatan data dapat ditentukan dalam XAML:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DataBindingDemos.BasicXamlBindingPage"
             Title="Basic XAML Binding">
    <StackLayout Padding="10, 0">
        <Label Text="TEXT"
               FontSize="80"
               HorizontalOptions="Center"
               VerticalOptions="Center"
               BindingContext="{x:Reference Name=slider}"
               Rotation="{Binding Path=Value}" />

        <Slider x:Name="slider"
                Maximum="360"
                VerticalOptions="Center" />
    </StackLayout>
</ContentPage>

Sama seperti dalam kode, pengikatan data diatur pada objek target, yaitu Label. Dua ekstensi markup XAML digunakan untuk menentukan pengikatan data:

  • Ekstensi x:Reference markup diperlukan untuk mereferensikan objek sumber, yang bernama Sliderslider.
  • Ekstensi Binding markup menautkan Rotation properti ke LabelValue properti .Slider

Untuk informasi selengkapnya tentang ekstensi markup XAML, lihat Menggunakan ekstensi markup XAML.

Catatan

Properti sumber ditentukan dengan Path properti Binding ekstensi markup, yang sesuai dengan Path properti Binding kelas.

Ekstensi markup XAML seperti x:Reference dan Binding dapat memiliki atribut properti konten yang ditentukan, yang untuk ekstensi markup XAML berarti bahwa nama properti tidak perlu muncul. Properti Name adalah properti konten , x:Referencedan Path properti adalah properti konten dari Binding, yang berarti bahwa properti tersebut dapat dihilangkan dari ekspresi:

<Label Text="TEXT"
       FontSize="80"
       HorizontalOptions="Center"
       VerticalOptions="Center"
       BindingContext="{x:Reference slider}"
       Rotation="{Binding Value}" />

Pengikatan tanpa konteks pengikatan

Properti BindingContext adalah komponen penting dari pengikatan data, tetapi tidak selalu diperlukan. Objek sumber dapat ditentukan dalam SetBinding panggilan atau Binding ekstensi markup:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DataBindingDemos.AlternativeCodeBindingPage"
             Title="Alternative Code Binding">
    <StackLayout Padding="10, 0">
        <Label x:Name="label"
               Text="TEXT"
               FontSize="40"
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />

        <Slider x:Name="slider"
                Minimum="-2"
                Maximum="2"
                VerticalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>

Dalam contoh ini, Slider didefinisikan untuk mengontrol Scale properti .Label Untuk alasan itu Slider , diatur untuk rentang -2 hingga 2.

File code-behind mengatur pengikatan dengan SetBinding metode , dengan argumen kedua menjadi konstruktor untuk Binding kelas :

public partial class AlternativeCodeBindingPage : ContentPage
{
    public AlternativeCodeBindingPage()
    {
        InitializeComponent();

        label.SetBinding(Label.ScaleProperty, new Binding("Value", source: slider));
    }
}

Binding Konstruktor memiliki 6 parameter, sehingga source parameter ditentukan dengan argumen bernama. Argumen adalah slider objek .

Catatan

Kelas ini VisualElement juga mendefinisikan dan ScaleY properti, yang dapat menskalakan ScaleXVisualElement secara berbeda dalam arah horizontal dan vertikal.

Atau, pengikatan data dapat ditentukan dalam XAML:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DataBindingDemos.AlternativeXamlBindingPage"
             Title="Alternative XAML Binding">
    <StackLayout Padding="10, 0">
        <Label Text="TEXT"
               FontSize="40"
               HorizontalOptions="Center"
               VerticalOptions="Center"
               Scale="{Binding Source={x:Reference slider},
                               Path=Value}" />

        <Slider x:Name="slider"
                Minimum="-2"
                Maximum="2"
                VerticalOptions="Center" />
    </StackLayout>
</ContentPage>

Dalam contoh ini, Binding ekstensi markup memiliki dua kumpulan properti, Source dan Path, dipisahkan oleh koma. Properti Source diatur ke ekstensi markup tersemat x:Reference yang jika tidak memiliki sintaks yang sama dengan mengatur BindingContext.

Properti Binding konten ekstensi markup adalah Path, tetapi Path= bagian dari ekstensi markup hanya dapat dihilangkan jika ini adalah properti pertama dalam ekspresi. Untuk menghilangkan bagian tersebut Path= , Anda perlu menukar dua properti:

Scale="{Binding Value, Source={x:Reference slider}}" />

Meskipun ekstensi markup XAML biasanya dibatasi oleh kurung kurawal, ekstensi markup XAML juga dapat diekspresikan sebagai elemen objek:

<Label Text="TEXT"
       FontSize="40"
       HorizontalOptions="Center"
       VerticalOptions="Center">
    <Label.Scale>
        <Binding Source="{x:Reference slider}"
                 Path="Value" />
    </Label.Scale>
</Label>

Dalam contoh ini, Source properti dan Path adalah atribut XAML reguler. Nilai muncul dalam tanda kutip dan atribut tidak dipisahkan oleh koma. Ekstensi x:Reference markup juga dapat menjadi elemen objek:

<Label Text="TEXT"
       FontSize="40"
       HorizontalOptions="Center"
       VerticalOptions="Center">
    <Label.Scale>
        <Binding Path="Value">
            <Binding.Source>
                <x:Reference Name="slider" />
            </Binding.Source>
        </Binding>
    </Label.Scale>
</Label>

Sintaks ini tidak umum, tetapi terkadang diperlukan ketika objek kompleks terlibat.

Contoh yang diperlihatkan sejauh ini mengatur BindingContext properti dan Source properti ke Bindingx:Reference ekstensi markup untuk mereferensikan tampilan lain di halaman. Kedua properti ini berjenis Object, dan dapat diatur ke objek apa pun yang mencakup properti yang cocok untuk sumber pengikatan. Anda juga dapat mengatur BindingContext properti atau Source ke x:Static ekstensi markup untuk mereferensikan nilai properti atau bidang statis, atau StaticResource ekstensi markup untuk mereferensikan objek yang disimpan dalam kamus sumber daya, atau langsung ke objek, yang sering merupakan instans viewmodel.

Catatan

BindingContext Properti juga dapat diatur ke Binding objek sehingga Source properti dan Path menentukan Binding konteks pengikatan.

Pewarisan konteks pengikatan

Anda dapat menentukan objek sumber menggunakan BindingContext properti atau Source properti Binding objek. Jika keduanya diatur, Source properti yang Binding lebih diutamakan daripada BindingContext.

Penting

Nilai BindingContext properti diwariskan melalui pohon visual.

Contoh XAML berikut menunjukkan pewarisan konteks pengikatan:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DataBindingDemos.BindingContextInheritancePage"
             Title="BindingContext Inheritance">
    <StackLayout Padding="10">
        <StackLayout VerticalOptions="Fill"
                     BindingContext="{x:Reference slider}">

            <Label Text="TEXT"
                   FontSize="80"
                   HorizontalOptions="Center"
                   VerticalOptions="End"
                   Rotation="{Binding Value}" />

            <BoxView Color="#800000FF"
                     WidthRequest="180"
                     HeightRequest="40"
                     HorizontalOptions="Center"
                     VerticalOptions="Start"
                     Rotation="{Binding Value}" />
        </StackLayout>

        <Slider x:Name="slider"
                Maximum="360" />
    </StackLayout>
</ContentPage>

Dalam contoh ini, BindingContext properti diatur StackLayout ke slider objek . Konteks pengikatan ini diwariskan oleh Label dan BoxView, yang keduanya memiliki properti yang Rotation diatur ke Value properti Sliderdari :

Binding context inheritance.