Aracılığıyla paylaş

Xamarin.Forms MenuItem

  • Makale

sınıfı, Xamarin.FormsMenuItem öğe bağlam menüleri ve Kabuk uygulaması açılır menüleri gibi ListView menüler için menü öğelerini tanımlar.

Aşağıdaki ekran görüntüleri, iOS ve Android'de bağlam ListView menüsündeki nesneleri gösterirMenuItem:

MenuItem sınıfı aşağıdaki özellikleri tanımlar:

  • CommandICommand, bir görünüm modelinde tanımlanan komutlara parmakla dokunma veya tıklama gibi kullanıcı eylemlerini bağlamaya olanak tanıyan bir işlemdir.
  • CommandParameter , öğesine geçirilmesi gereken parametreyi belirten bir object değeridir Command.
  • IconImageSource , görüntü simgesini tanımlayan bir ImageSource değerdir.
  • IsDestructive, öğesinin ilişkili ui öğesini listeden kaldırıp kaldırmadığını MenuItem gösteren bir bool değerdir.
  • IsEnabled , bu nesnenin kullanıcı girişine yanıt verip vermediğini gösteren bir bool değerdir.
  • Text , görüntüleme metnini belirten bir string değerdir.

Bu özellikler nesneler tarafından BindableProperty desteklenir, bu nedenle MenuItem örnek veri bağlamalarının hedefi olabilir.

MenuItem Oluşturma

MenuItem nesneleri, nesnenin öğelerindeki ListView bağlam menüsünde kullanılabilir. En yaygın desen, bir örneğin içinde nesneleri oluşturmaktır MenuItem ve bu, s ItemTemplateiçin ListViewnesnesi olarak DataTemplate kullanılır.ViewCell ListView Nesne doldurulduğunda, bağlam menüsü bir öğe için etkinleştirildiğinde seçenekleri ortaya çıkarmak MenuItem için öğesini kullanarak DataTemplateher öğeyi oluşturur.

Aşağıdaki örnek, bir ListView nesne bağlamında örneklemeyi gösterirMenuItem:

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

MenuItem Kodda da oluşturulabilir:

// A function returns 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 instance to the ContextActions
    MenuItem menuItem = new MenuItem
    {
        Text = "Context Menu Option"
    };
    viewCell.ContextActions.Add(menuItem);

    // The function returns the custom ViewCell
    // to the DataTemplate constructor
    return viewCell;
});

// Finally, the dataTemplate is provided to
// the ListView object
ListView listView = new ListView
{
    ...
    ItemTemplate = dataTemplate
};

Olaylarla MenuItem davranışını tanımlama

MenuItem sınıfı bir Clicked olayı kullanıma sunar. XAML'deki örneğe yapılan dokunmalara veya tıklamalara MenuItem tepki vermek için bu olaya bir olay işleyicisi eklenebilir:

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

Bir olay işleyicisi de koda eklenebilir:

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

Önceki örnekler bir OnItemClicked olay işleyiciye başvuruda bulundu. Aşağıdaki kodda örnek bir uygulama gösterilmektedir:

void OnItemClicked(object sender, EventArgs e)
{
    // The sender is the menuItem
    MenuItem menuItem = sender as MenuItem;

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

    // Do something with the contextItem here
}

MVVM ile MenuItem davranışını tanımlama

sınıfı, MenuItem nesneler ve arabirim aracılığıyla BindableProperty Model-View-ViewModel (MVVM) desenini ICommand destekler. Aşağıdaki XAML, bir görünüm modelinde tanımlanan komutlara bağlı örnekleri gösterir MenuItem :

<ContentPage.BindingContext>
    <viewmodels:ListPageViewModel />
</ContentPage.BindingContext>

<StackLayout>
    <Label Text="{Binding Message}" ... />
    <ListView ItemsSource="{Binding Items}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <ViewCell.ContextActions>
                        <MenuItem Text="Edit"
                                    IconImageSource="icon.png"
                                    Command="{Binding Source={x:Reference contentPage}, Path=BindingContext.EditCommand}"
                                    CommandParameter="{Binding .}"/>
                        <MenuItem Text="Delete"
                                    Command="{Binding Source={x:Reference contentPage}, Path=BindingContext.DeleteCommand}"
                                    CommandParameter="{Binding .}"/>
                    </ViewCell.ContextActions>
                    <Label Text="{Binding .}" />
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackLayout>

Önceki örnekte, görünüm modelindeki komutlara Command bağlı ve CommandParameter özellikleriyle iki MenuItem nesne tanımlanmıştır. Görünüm modeli, XAML'de başvuruda bulunan komutları içerir:

public class ListPageViewModel : INotifyPropertyChanged
{
    ...

    public ICommand EditCommand => new Command<string>((string item) =>
    {
        Message = $"Edit command was called on: {item}";
    });

    public ICommand DeleteCommand => new Command<string>((string item) =>
    {
        Message = $"Delete command was called on: {item}";
    });
}

Örnek uygulama, nesneleri doldurmaya ListView yönelik öğelerin listesini almak için kullanılan bir DataService sınıf içerir. Sınıfından DataService öğeler içeren bir görünüm modeli oluşturulur ve arka planda olarak olarak ayarlanır BindingContext :

public MenuItemXamlMvvmPage()
{
    InitializeComponent();
    BindingContext = new ListPageViewModel(DataService.GetListItems());
}

Uyarı

MenuItem nesneler yalnızca Android'de simgeleri görüntüler. Diğer platformlarda, yalnızca özelliği tarafından Text belirtilen metin görüntülenir.

Simgeler özelliği kullanılarak IconImageSource belirtilir. Bir simge belirtilirse, özelliği tarafından Text belirtilen metin görüntülenmez. Aşağıdaki ekran görüntüsünde, Android'de simgesi olan bir MenuItem gösterilir:

içindeki Xamarin.Formsgörüntüleri kullanma hakkında daha fazla bilgi için bkz. içindeki Xamarin.Formsgörüntüler.

Çalışma zamanında MenuItem'i etkinleştirme veya devre dışı bırakma

Çalışma zamanında devre dışı bırakma MenuItem özelliğini etkinleştirmek için, özelliğini Command bir ICommand uygulamaya bağlayın ve bir canExecute temsilcinin öğesini uygun şekilde etkinleştirip devre dışı bırakdığından ICommand emin olun.

Önemli

özelliğini etkinleştirirken veya devre dışı bırakırken Command özelliğini başka bir özelliğe bağlamayın.IsEnabled MenuItem

Aşağıdaki örnekte, özelliği adlandırılmış MyCommandbir Command MenuItem öğeye bağlanan bir ICommand gösterilmektedir:

<MenuItem Text="My menu item"
          Command="{Binding MyCommand}" />

UygulamaICommand, etkinleştirmek ve devre dışı bırakmak MenuItemiçin bir özelliğin değerini döndüren bir bool temsilci gerektirircanExecute:

public class MyViewModel : INotifyPropertyChanged
{
    bool isMenuItemEnabled = false;
    public bool IsMenuItemEnabled
    {
        get { return isMenuItemEnabled; }
        set
        {
            isMenuItemEnabled = value;
            MyCommand.ChangeCanExecute();
        }
    }

    public Command MyCommand { get; private set; }

    public MyViewModel()
    {
        MyCommand = new Command(() =>
        {
            // Execute logic here
        },
        () => IsMenuItemEnabled);
    }
}

Bu örnekte, MenuItem özelliği ayarlanana IsMenuItemEnabled kadar devre dışı bırakılır. Bu durum oluştuğunda, için temsilcinin Command.ChangeCanExecute canExecute MyCommand yeniden değerlendirilmesine neden olan yöntemi çağrılır.

Platformlar arası bağlam menüsü davranışı

Bağlam menülerine her platformda farklı şekilde erişilir ve görüntülenir.

Android'de bağlam menüsü, bir liste öğesine uzun basılarak etkinleştirilir. Bağlam menüsü başlık ve gezinti çubuğu alanının yerini alır ve MenuItem seçenekler yatay düğmeler olarak görüntülenir.

iOS'ta, bağlam menüsü bir liste öğesinde çekilerek etkinleştirilir. Bağlam menüsü liste öğesinde görüntülenir ve MenuItems yatay düğmeler olarak görüntülenir.

UWP'de, bağlam menüsü bir liste öğesine sağ tıklanarak etkinleştirilir. Bağlam menüsü imlecin yanında dikey liste olarak görüntülenir.