Perilaku

Telusuri sampel

Perilaku .NET Multi-platform App UI (.NET MAUI) memungkinkan Anda menambahkan fungsionalitas tambahan ke kontrol antarmuka pengguna, seperti Button atau Entry, tanpa harus mensubkelas kontrol. Sebagai gantinya, fungsionalitas tambahan diimplementasikan di kelas Behavior dan dilampirkan ke kontrol.

Perilaku dapat digunakan untuk menambahkan fungsionalitas yang berbeda ke kontrol UI, seperti:

• Validasi input. Perilaku dapat digunakan dengan kontrol input untuk memastikan data valid. Misalnya, Anda dapat menulis perilaku untuk Entry untuk memastikan bahwa nomor telepon atau alamat email dalam format yang benar.
• Meningkatkan UI. Perilaku dapat digunakan untuk meningkatkan kontrol UI di aplikasi Anda. Misalnya, Anda dapat menulis instruksi untuk Button agar bergetar saat diklik, atau untuk mengubah warnanya.
• Respon waktu proses. Perilaku dapat digunakan untuk membuat kontrol bereaksi terhadap situasi yang berbeda. Misalnya, Anda mungkin secara otomatis menyimpan input pengguna dalam Entry saat pengguna selesai mengetik.

.NET MAUI mendukung tiga jenis perilaku yang berbeda:

• Perilaku terlampir adalah kelas static yang memiliki satu atau lebih properti terlampir. Untuk informasi lebih lanjut tentang perilaku terlampir, lihat Perilaku Terlampir.
• Perilaku MAUI .NET adalah kelas yang berasal dari kelas Behavior atau Behavior<T>, di mana T adalah jenis kontrol tempat perilaku tersebut diterapkan. Untuk informasi selengkapnya, lihat .NET MAUI Behaviors.
• Perilaku platform adalah kelas yang berasal dari kelas PlatformBehavior<TView> atau PlatformBehavior<TView,TPlatformView>. Perilaku ini dapat menanggapi kondisi dan peristiwa arbitrer pada elemen kontrol bawaan. Untuk informasi selengkapnya, lihat perilaku platform .

Perilaku terkait

Perilaku terlampir adalah kelas statis dengan satu atau beberapa properti terlampir. Properti terlampir adalah jenis properti khusus yang dapat diikat. Mereka didefinisikan dalam satu kelas tetapi dilampirkan ke objek lain, dan dapat dikenali dalam XAML sebagai atribut yang berisi kelas dan nama properti yang dipisahkan oleh titik. Untuk informasi selengkapnya tentang properti terlampir, lihat di Properti Terlampir.

Properti terlampir dapat mendefinisikan delegasi propertyChanged yang akan dijalankan ketika nilai properti berubah, misalnya ketika properti tersebut ditetapkan pada pengendali. Saat delegasi propertyChanged dijalankan, diberikan referensi ke kontrol tempat itu dilampirkan, serta parameter yang berisi nilai lama dan baru untuk properti tersebut. Delegasi ini dapat digunakan untuk menambahkan fungsionalitas baru ke kontrol yang terkait dengan properti tersebut dengan memanipulasi referensi yang diteruskan, seperti berikut:

1. Delegasi propertyChanged mentransmisikan referensi kontrol, yang diterima sebagai BindableObject, ke jenis kontrol yang dirancang untuk meningkatkan perilaku.
2. Delegasi propertyChanged memodifikasi properti kontrol, memanggil metode kontrol, atau mendaftarkan penanganan aktivitas untuk peristiwa yang diekspos oleh kontrol, untuk mengimplementasikan fungsionalitas perilaku inti.

Membuat perilaku terlampir

Perilaku terlampir dapat diimplementasikan dengan membuat kelas statis yang berisi properti terlampir yang menentukan delegasi propertyChanged.

Contoh berikut menunjukkan kelas AttachedNumericValidationBehavior, yang menyoroti nilai yang dimasukkan oleh pengguna ke dalam kontrol Entry berwarna merah jika bukan double:

public static class AttachedNumericValidationBehavior
{
    public static readonly BindableProperty AttachBehaviorProperty =
        BindableProperty.CreateAttached("AttachBehavior", typeof(bool), typeof(AttachedNumericValidationBehavior), false, propertyChanged: OnAttachBehaviorChanged);

    public static bool GetAttachBehavior(BindableObject view)
    {
        return (bool)view.GetValue(AttachBehaviorProperty);
    }

    public static void SetAttachBehavior(BindableObject view, bool value)
    {
        view.SetValue(AttachBehaviorProperty, value);
    }

    static void OnAttachBehaviorChanged(BindableObject view, object oldValue, object newValue)
    {
        Entry entry = view as Entry;
        if (entry == null)
        {
            return;
        }

        bool attachBehavior = (bool)newValue;
        if (attachBehavior)
        {
            entry.TextChanged += OnEntryTextChanged;
        }
        else
        {
            entry.TextChanged -= OnEntryTextChanged;
        }
    }

    static void OnEntryTextChanged(object sender, TextChangedEventArgs args)
    {
        double result;
        bool isValid = double.TryParse(args.NewTextValue, out result);
        ((Entry)sender).TextColor = isValid ? Colors.Black : Colors.Red;
    }
}

Dalam contoh ini, kelas AttachedNumericValidationBehavior berisi properti terlampir bernama AttachBehavior dengan getter dan setter static, yang mengontrol penambahan atau penghapusan perilaku ke kontrol yang akan dilampirkan. Properti terlampir ini mendaftarkan metode OnAttachBehaviorChanged yang akan dijalankan ketika nilai properti berubah. Metode ini mendaftarkan atau membatalkan pendaftaran penanganan aktivitas untuk peristiwa TextChanged, berdasarkan nilai properti terlampir AttachBehavior. Fungsionalitas inti perilaku disediakan oleh metode OnEntryTextChanged, yang mengurai nilai yang dimasukkan dalam Entry dan mengatur properti TextColor menjadi merah jika nilainya bukan double.

Mengonsumsi perilaku terasosiasi

Perilaku terlampir dapat dikonsumsi dengan mengatur properti terlampirnya pada kontrol target.

Contoh berikut menunjukkan penggunaan kelas AttachedNumericValidationBehavior pada Entry dengan menambahkan properti terlampir AttachBehavior ke Entry:

<ContentPage ...
             xmlns:local="clr-namespace:BehaviorsDemos">
    <Entry Placeholder="Enter a System.Double" local:AttachedNumericValidationBehavior.AttachBehavior="true" />
</ContentPage>

Entry yang setara dalam C# ditampilkan dalam contoh kode berikut:

Entry entry = new Entry { Placeholder = "Enter a System.Double" };
AttachedNumericValidationBehavior.SetAttachBehavior(entry, true);

Cuplikan layar berikut menunjukkan perilaku terlampir yang merespons input yang tidak valid:

Menghapus perilaku tergantung

Kelas AttachedNumericValidationBehavior dapat dihapus dari kontrol dengan mengatur properti terlampir AttachBehavior ke false:

<Entry Placeholder="Enter a System.Double" local:AttachedNumericValidationBehavior.AttachBehavior="false" />

Pada waktu proses, metode OnAttachBehaviorChanged akan dieksekusi ketika nilai properti terpasang AttachBehavior ditetapkan menjadi false. Metode OnAttachBehaviorChanged kemudian akan membatalkan pendaftaran penanganan aktivitas untuk peristiwa TextChanged, memastikan bahwa perilaku tidak dijalankan saat Anda berinteraksi dengan kontrol.

Perilaku MAUI .NET

Perilaku MAUI .NET dibuat dengan berasal dari kelas Behavior atau Behavior<T>.

Proses untuk membuat perilaku MAUI .NET adalah sebagai berikut:

1. Buat kelas yang mewarisi dari kelas Behavior atau Behavior<T>, di mana T adalah jenis kontrol tempat perilaku harus diterapkan.
2. Ambil alih metode OnAttachedTo untuk melakukan penyiapan yang diperlukan.
3. Timpa metode OnDetachingFrom untuk melakukan pembersihan yang diperlukan.
4. Terapkan fungsionalitas inti perilaku.

Ini menghasilkan struktur yang ditunjukkan dalam contoh berikut:

public class MyBehavior : Behavior<View>
{
    protected override void OnAttachedTo(View bindable)
    {
        base.OnAttachedTo(bindable);
        // Perform setup
    }

    protected override void OnDetachingFrom(View bindable)
    {
        base.OnDetachingFrom(bindable);
        // Perform clean up
    }

    // Behavior implementation
}

Metode OnAttachedTo dipanggil segera setelah perilaku dilampirkan ke kontrol. Metode ini menerima referensi ke kontrol yang dilampirkan, dan dapat digunakan untuk mendaftarkan penanganan aktivitas atau melakukan penyiapan lain yang diperlukan untuk mendukung fungsionalitas perilaku. Misalnya, Anda dapat berlangganan peristiwa pada kontrol. Fungsionalitas perilaku kemudian akan diimplementasikan di penanganan aktivitas untuk peristiwa tersebut.

Metode OnDetachingFrom dipanggil ketika perilaku dihapus dari kontrol. Metode ini menerima referensi ke kontrol yang dilampirkan, dan digunakan untuk melakukan pembersihan yang diperlukan. Misalnya, Anda dapat berhenti berlangganan dari peristiwa pada kontrol untuk mencegah kebocoran memori.

Perilaku kemudian dapat dikonsumsi dengan melampirkannya ke koleksi kontrol Behaviors.

Membuat Perilaku .NET MAUI

Perilaku MAUI .NET dapat diimplementasikan dengan membuat kelas yang berasal dari kelas Behavior atau Behavior<T>, dan mengambil alih metode OnAttachedTo dan OnDetachingFrom.

Contoh berikut menunjukkan kelas NumericValidationBehavior, yang menyoroti nilai yang dimasukkan oleh pengguna ke dalam kontrol Entry berwarna merah jika bukan double:

public class NumericValidationBehavior : Behavior<Entry>
{
    protected override void OnAttachedTo(Entry entry)
    {
        entry.TextChanged += OnEntryTextChanged;
        base.OnAttachedTo(entry);
    }

    protected override void OnDetachingFrom(Entry entry)
    {
        entry.TextChanged -= OnEntryTextChanged;
        base.OnDetachingFrom(entry);
    }

    void OnEntryTextChanged(object sender, TextChangedEventArgs args)
    {
        double result;
        bool isValid = double.TryParse(args.NewTextValue, out result);
        ((Entry)sender).TextColor = isValid ? Colors.Black : Colors.Red;
    }
}

Dalam contoh ini, kelas NumericValidationBehavior berasal dari kelas Behavior<T>, di mana T adalah Entry. Metode OnAttachedTo mendaftarkan penanganan aktivitas untuk peristiwa TextChanged, dengan metode OnDetachingFrom membatalkan pendaftaran peristiwa TextChanged untuk mencegah kebocoran memori. Fungsionalitas inti perilaku disediakan oleh metode OnEntryTextChanged, yang mengurai nilai yang dimasukkan dalam Entry dan mengatur properti TextColor menjadi merah jika nilainya bukan double.

Mengonsumsi perilaku MAUI .NET

Setiap kontrol MAUI .NET memiliki koleksi Behaviors, di mana satu atau beberapa perilaku dapat ditambahkan:

<Entry Placeholder="Enter a System.Double">
    <Entry.Behaviors>
        <local:NumericValidationBehavior />
    </Entry.Behaviors>
</Entry>

Entry yang setara dalam C# ditampilkan dalam contoh kode berikut:

Entry entry = new Entry { Placeholder = "Enter a System.Double" };
entry.Behaviors.Add(new NumericValidationBehavior());

Cuplikan layar berikut menunjukkan perilaku MAUI .NET yang merespons input yang tidak valid:

Mengonsumsi perilaku MAUI .NET dengan gaya

Perilaku MAUI .NET dapat dikonsumsi dengan gaya eksplisit atau implisit. Namun, membuat gaya untuk mengatur properti Behaviors dari kontrol tidak dimungkinkan karena properti ini hanya dapat dibaca. Solusinya adalah menambahkan properti terlampir ke kelas perilaku yang mengontrol penambahan dan penghapusan perilaku. Prosesnya adalah sebagai berikut:

1. Tambahkan properti terlampir ke kelas perilaku yang akan digunakan untuk mengontrol penambahan atau penghapusan perilaku ke kontrol tempat perilaku akan dilampirkan. Pastikan bahwa properti terlampir mendaftarkan delegasi propertyChanged yang akan dijalankan saat nilai properti berubah.
2. Buat static getter dan setter untuk properti terlampir.
3. Terapkan logika di delegasi propertyChanged untuk menambahkan dan menghapus perilaku.

Contoh berikut menunjukkan kelas NumericValidationStyleBehavior, yang memiliki properti terlampir yang mengontrol penambahan dan penghapusan perilaku:

public class NumericValidationStyleBehavior : Behavior<Entry>
{
    public static readonly BindableProperty AttachBehaviorProperty =
        BindableProperty.CreateAttached("AttachBehavior", typeof(bool), typeof(NumericValidationStyleBehavior), false, propertyChanged: OnAttachBehaviorChanged);

    public static bool GetAttachBehavior(BindableObject view)
    {
        return (bool)view.GetValue(AttachBehaviorProperty);
    }

    public static void SetAttachBehavior(BindableObject view, bool value)
    {
        view.SetValue(AttachBehaviorProperty, value);
    }

    static void OnAttachBehaviorChanged(BindableObject view, object oldValue, object newValue)
    {
        Entry entry = view as Entry;
        if (entry == null)
        {
            return;
        }

        bool attachBehavior = (bool)newValue;
        if (attachBehavior)
        {
            entry.Behaviors.Add(new NumericValidationStyleBehavior());
        }
        else
        {
            Behavior toRemove = entry.Behaviors.FirstOrDefault(b => b is NumericValidationStyleBehavior);
            if (toRemove != null)
            {
                entry.Behaviors.Remove(toRemove);
            }
        }
    }

    protected override void OnAttachedTo(Entry entry)
    {
        entry.TextChanged += OnEntryTextChanged;
        base.OnAttachedTo(entry);
    }

    protected override void OnDetachingFrom(Entry entry)
    {
        entry.TextChanged -= OnEntryTextChanged;
        base.OnDetachingFrom(entry);
    }

    void OnEntryTextChanged(object sender, TextChangedEventArgs args)
    {
        double result;
        bool isValid = double.TryParse(args.NewTextValue, out result);
        ((Entry)sender).TextColor = isValid ? Colors.Black : Colors.Red;
    }
}

Dalam contoh ini, kelas NumericValidationStyleBehavior berisi properti terlampir bernama AttachBehavior dengan getter dan setter static, yang mengontrol penambahan atau penghapusan perilaku ke kontrol yang akan dilampirkan. Properti terlampir ini mendaftarkan metode OnAttachBehaviorChanged yang akan dijalankan ketika nilai properti berubah. Metode ini menambahkan atau menghapus perilaku ke kontrol, berdasarkan nilai properti terlampir AttachBehavior.

Contoh kode berikut menunjukkan gaya eksplisit untuk yang menggunakan properti terlampir , dan yang dapat diterapkan ke kontrol :

<Style x:Key="NumericValidationStyle" TargetType="Entry">
    <Style.Setters>
        <Setter Property="local:NumericValidationStyleBehavior.AttachBehavior" Value="true" />
    </Style.Setters>
</Style>

Style dapat diterapkan ke Entry dengan mengatur properti Style ke gaya menggunakan ekstensi markup StaticResource:

<Entry Placeholder="Enter a System.Double" Style="{StaticResource NumericValidationStyle}">

Untuk informasi selengkapnya tentang gaya, lihat Styles.

Menghapus perilaku MAUI .NET

Metode OnDetachingFrom dipanggil ketika perilaku dihapus dari kontrol, dan digunakan untuk melakukan pembersihan yang diperlukan seperti berhenti berlangganan dari peristiwa untuk mencegah kebocoran memori. Namun, perilaku tidak secara implisit dihapus dari kontrol kecuali koleksi Behaviors kontrol dimodifikasi oleh metode Remove atau Clear:

Behavior toRemove = entry.Behaviors.FirstOrDefault(b => b is NumericValidationStyleBehavior);
if (toRemove != null)
{
    entry.Behaviors.Remove(toRemove);
}

Atau, Behaviors dari koleksi kontrol dapat dihapuskan:

entry.Behaviors.Clear();

Perilaku platform

Perilaku platform didapatkan dengan membuat turunan dari kelas PlatformBehavior<TView> atau PlatformBehavior<TView,TPlatformView>. Mereka menanggapi kondisi dan peristiwa acak pada elemen kontrol bawaan.

Perilaku platform dapat diimplementasikan melalui kompilasi kondisional, atau kelas parsial. Pendekatan yang diadopsi di sini adalah menggunakan kelas parsial, di mana perilaku platform biasanya terdiri dari kelas parsial lintas platform yang mendefinisikan API perilaku, dan kelas parsial asli yang mengimplementasikan perilaku pada setiap platform. Pada saat build, multi-targeting menggabungkan kelas parsial untuk membangun perilaku pada setiap platform.

Proses untuk membuat perilaku platform adalah sebagai berikut:

1. Buat kelas parsial lintas platform yang menentukan API untuk perilaku platform.

2. Buat kelas parsial asli di setiap platform tempat aplikasi Anda dibangun, yang memiliki nama yang sama dengan kelas parsial lintas platform. Kelas parsial asli ini harus mewarisi dari kelas PlatformBehavior<TView> atau PlatformBehavior<TView,TPlatformView>, yang mana TView adalah kontrol lintas platform yang harus menerapkan perilaku tersebut, dan TPlatformView adalah tampilan asli yang mengimplementasikan kontrol lintas platform pada platform tertentu.

   Nota

   Meskipun diperlukan untuk membuat kelas parsial asli di setiap platform tempat aplikasi Anda dibangun, tidak diharuskan untuk mengimplementasikan fungsionalitas perilaku platform di setiap platform. Misalnya, Anda dapat membuat perilaku platform yang memodifikasi ketebalan batas kontrol asli pada beberapa platform, tetapi tidak semua.

3. Di setiap kelas parsial bawaan yang Anda perlukan untuk mengimplementasikan perilaku platform, Anda harus:

   1. Ambil alih metode OnAttachedTo untuk melakukan penyiapan apa pun.
   2. Ambil alih metode OnDetachedFrom untuk melakukan pembersihan apa pun.
   3. Terapkan fungsionalitas inti perilaku platform.

Perilaku kemudian dapat dikonsumsi dengan melampirkannya ke koleksi kontrol Behaviors.

Menetapkan perilaku platform

Untuk membuat perilaku platform, Anda harus terlebih dahulu membuat kelas parsial lintas platform yang menentukan API untuk perilaku platform:

namespace BehaviorsDemos
{
    public partial class TintColorBehavior
    {
        public static readonly BindableProperty TintColorProperty =
            BindableProperty.Create(nameof(TintColor), typeof(Color), typeof(TintColorBehavior));

        public Color TintColor
        {
            get => (Color)GetValue(TintColorProperty);
            set => SetValue(TintColorProperty, value);
        }
    }
}

Perilaku platform adalah kelas parsial yang implementasinya akan diselesaikan pada setiap platform yang diperlukan dengan kelas parsial tambahan yang menggunakan nama yang sama. Dalam contoh ini, kelas TintColorBehavior mendefinisikan satu properti yang dapat diikat, TintColor, yang akan mewarnai gambar dengan warna yang ditentukan.

Setelah membuat kelas parsial lintas platform, Anda harus membuat kelas parsial asli di setiap platform tempat Anda membuat aplikasi. Ini dapat dicapai dengan menambahkan kelas parsial ke folder anak yang diperlukan dalam folder Platforms:

Atau Anda dapat mengonfigurasi proyek Anda untuk mendukung penargetan multi berbasis nama file, atau penargetan multi berbasis folder, atau keduanya. Untuk informasi selengkapnya tentang multi-penargetan, lihat Konfigurasi multi-penargetan.

Kelas parsial asli harus mewarisi dari kelas PlatformBehavior<TView> atau kelas PlatformBehavior<TView,TPlatformView>, di mana TView adalah kontrol lintas platform yang menerapkan perilaku, dan TPlatformView adalah tampilan asli yang mengimplementasikan kontrol lintas platform pada suatu platform tertentu. Di setiap kelas parsial asli yang Anda perlukan untuk menerapkan perilaku platform, Anda harus mengambil alih metode OnAttachedTo dan metode OnDetachedFrom, dan menerapkan fungsionalitas inti perilaku platform.

Metode OnAttachedTo dipanggil segera setelah perilaku platform dilampirkan ke kontrol lintas platform. Metode ini menerima referensi ke kontrol lintas platform yang dilampirkan, dan secara opsional referensi ke kontrol asli yang mengimplementasikan kontrol lintas platform. Metode ini dapat digunakan untuk mendaftarkan penanganan aktivitas atau melakukan penyiapan lain yang diperlukan untuk mendukung fungsionalitas perilaku platform. Misalnya, Anda dapat berlangganan event di sebuah kontrol. Fungsionalitas perilaku kemudian akan diimplementasikan di penanganan aktivitas untuk peristiwa tersebut.

Metode OnDetachedFrom dipanggil ketika perilaku dihapus dari kontrol lintas platform. Metode ini menerima referensi ke kontrol yang dilampirkan, dan secara opsional referensi ke kontrol asli yang mengimplementasikan kontrol lintas platform. Metode harus digunakan untuk melakukan pembersihan yang diperlukan. Misalnya, Anda dapat berhenti berlangganan dari peristiwa pada kontrol untuk mencegah kebocoran memori.

Contoh berikut menunjukkan TintColorBehavior kelas parsial untuk Android, yang mewarnai gambar dengan warna tertentu:

using Android.Graphics;
using Android.Widget;
using Microsoft.Maui.Platform;
using Color = Microsoft.Maui.Graphics.Color;

namespace BehaviorsDemos
{
    public partial class TintColorBehavior : PlatformBehavior<Image, ImageView>
    {
        protected override void OnAttachedTo(Image bindable, ImageView platformView)
        {
            base.OnAttachedTo(bindable, platformView);

            if (bindable is null)
                return;
            if (TintColor is null)
                ClearColor(platformView);
            else
                ApplyColor(platformView, TintColor);
        }

        protected override void OnDetachedFrom(Image bindable, ImageView platformView)
        {
            base.OnDetachedFrom(bindable, platformView);

            if (bindable is null)
                return;
            ClearColor(platformView);
        }

        void ApplyColor(ImageView imageView, Color color)
        {
            imageView.SetColorFilter(new PorterDuffColorFilter(color.ToPlatform(), PorterDuff.Mode.SrcIn ?? throw new NullReferenceException()));
        }

        void ClearColor(ImageView imageView)
        {
            imageView.ClearColorFilter();
        }
    }
}

Dalam contoh ini, kelas TintColorBehavior berasal dari kelas PlatformBehavior<TView,TPlatformView>, di mana TView adalah Image dan TPlatformView adalah ImageView. OnAttachedTo menerapkan warna tint ke gambar, dengan syarat properti TintColor memiliki nilai. Metode OnDetachedFrom menghapus warna tint dari gambar.

Kelas parsial bawaan harus ditambahkan pada setiap platform di mana Anda membangun aplikasi Anda. Namun, Anda dapat membuat kelas parsial native sebagai no-op, jika perilaku platform tidak diperlukan di platform tertentu. Hal ini dapat dicapai dengan menyediakan kelas kosong:

using Microsoft.UI.Xaml;

namespace BehaviorsDemos
{
    public partial class TintColorBehavior : PlatformBehavior<Image, FrameworkElement>
    {
        // NO-OP on Windows
    }
}

Mengonsumsi perilaku platform

Setiap kontrol MAUI .NET memiliki koleksi Behaviors, di mana satu atau beberapa perilaku platform dapat ditambahkan:

<Image Source="dotnet_bot.png"
       HeightRequest="200"
       HorizontalOptions="Center">
    <Image.Behaviors>
        <local:TintColorBehavior TintColor="Red" />
    </Image.Behaviors>
</Image>

Image yang setara dalam C# diperlihatkan dalam contoh berikut:

Image image = new Image { Source = "dotnet_bot.png", HeightRequest = 200, HorizontalOptions = LayoutOptions.Center };
image.Behaviors.Add(new TintColorBehavior());

Cuplikan layar berikut menunjukkan cara kerja platform dalam mengubah warna gambar.