Tampilkan item menu

Kelas .NET Multi-platform App UI (.NET MAUI) MenuItem dapat digunakan untuk menentukan item menu untuk menu seperti ListView menu konteks item dan menu flyout aplikasi Shell.

Cuplikan layar berikut menunjukkan MenuItem objek di ListView menu konteks di Android:

Kelas MenuItem menentukan properti berikut:

• Command, dari jenis ICommand, memungkinkan mengikat tindakan pengguna, seperti ketukan jari atau klik, untuk perintah yang ditentukan pada viewmodel.
• CommandParameter, dari jenis object, menentukan parameter yang harus diteruskan ke Command.
• IconImageSource, dari jenis ImageSource, menentukan ikon item menu.
• IsDestructive, dari jenis bool, menunjukkan apakah MenuItem menghapus elemen UI terkait dari daftar.
• IsEnabled, dari jenis bool, menunjukkan apakah item menu merespons input pengguna.
• Text, dari jenis string, menentukan teks item menu.

Properti ini didukung oleh BindableProperty objek, yang berarti bahwa properti tersebut dapat menjadi target pengikatan data.

Membuat MenuItem

Untuk membuat item menu, misalnya sebagai menu konteks pada ListView item objek, buat MenuItem objek di dalam ViewCell objek yang digunakan sebagai DataTemplate objek untuk ListViewItemTemplate. ListView Ketika objek diisi, objek akan membuat setiap item menggunakan DataTemplate, mengekspos MenuItem pilihan saat menu konteks diaktifkan untuk item.

Contoh berikut menunjukkan cara membuat MenuItem dalam konteks ListView objek:

<ListView>
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <ViewCell.ContextActions>
                    <MenuItem Text="Context menu option" />
                </ViewCell.ContextActions>
                <Label Text="{Binding .}" />
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Contoh ini akan menghasilkan MenuItem objek yang memiliki teks. Namun, penampilan bervariasi MenuItem di seluruh platform.

Juga MenuItem dapat dibuat dalam kode:

// Return a ViewCell instance that is used as the template for each list item
DataTemplate dataTemplate = new DataTemplate(() =>
{
    // A Label displays the list item text
    Label label = new Label();
    label.SetBinding(Label.TextProperty, ".");

    // A ViewCell serves as the DataTemplate
    ViewCell viewCell = new ViewCell
    {
        View = label
    };

    // Add a MenuItem to the ContextActions
    MenuItem menuItem = new MenuItem
    {
        Text = "Context Menu Option"
    };
    viewCell.ContextActions.Add(menuItem);

    // Return the custom ViewCell to the DataTemplate constructor
    return viewCell;
});

ListView listView = new ListView
{
    ...
    ItemTemplate = dataTemplate
};

Menu konteks dalam ListView diaktifkan dan ditampilkan secara berbeda di setiap platform. Di Android, menu konteks diaktifkan dengan menekan lama pada item daftar. Menu konteks menggantikan judul dan area bilah navigasi dan MenuItem opsi ditampilkan sebagai tombol horizontal. Di iOS, menu konteks diaktifkan dengan menggesekkan item daftar. Menu konteks ditampilkan pada item daftar dan MenuItems ditampilkan sebagai tombol horizontal. Di Windows, menu konteks diaktifkan dengan mengklik kanan item daftar. Menu konteks ditampilkan di dekat kursor sebagai daftar vertikal.

Menentukan perilaku MenuItem

Kelas MenuItem mendefinisikan Clicked peristiwa. Penanganan aktivitas dapat dilampirkan ke kejadian ini untuk bereaksi terhadap ketukan atau klik pada MenuItem objek:

<MenuItem ...
          Clicked="OnItemClicked" />

Penanganan aktivitas juga dapat dilampirkan dalam kode:

MenuItem item = new MenuItem { ... };
item.Clicked += OnItemClicked;

Contoh-contoh ini mereferensikan OnItemClicked penanganan aktivitas, yang diperlihatkan dalam contoh berikut:

void OnItemClicked(object sender, EventArgs e)
{
    MenuItem menuItem = sender as MenuItem;

    // Access the list item through the BindingContext
    var contextItem = menuItem.BindingContext;

    // Do something with the contextItem here
}

Tentukan tampilan MenuItem

Ikon ditentukan menggunakan IconImageSource properti . Jika ikon ditentukan, teks yang ditentukan oleh Text properti tidak akan ditampilkan. Cuplikan layar berikut menunjukkan MenuItem dengan ikon di Android:

MenuItem objek hanya menampilkan ikon di Android. Pada platform lain, hanya teks yang ditentukan oleh properti yang Text akan ditampilkan.

Catatan

Gambar dapat disimpan dalam satu lokasi di proyek aplikasi Anda. Untuk informasi selengkapnya, lihat Menambahkan gambar ke proyek .NET MAUI.

Mengaktifkan atau menonaktifkan MenuItem saat runtime

Untuk mengaktifkan atau menonaktifkan MenuItem pada runtime, ikat propertinya Command ke ICommand implementasi, dan pastikan bahwa canExecute delegasi mengaktifkan dan menonaktifkan ICommand yang sesuai.

Penting

Jangan ikat properti ke IsEnabled properti lain saat menggunakan Command properti untuk mengaktifkan atau menonaktifkan MenuItem.