Поделиться через


Отображение элементов меню

Класс пользовательского интерфейса многоплатформенного приложения .NET (.NET MAUI) MenuItem можно использовать для определения элементов меню для таких меню, как ListView контекстные меню элементов и всплывающие меню приложения оболочки.

На следующих снимках экрана показаны MenuItem объекты в контекстном ListView меню в Android:

Screenshot of menu items in a ListView context menu on Android.

Класс MenuItem определяет следующие свойства:

  • CommandICommandТип , позволяет привязывать действия пользователя, такие как касания пальцев или щелчки, для команд, определенных в режиме просмотра.
  • CommandParameter, тип object, указывает параметр, который должен передаваться Commandв .
  • IconImageSource, тип ImageSource, определяет значок элемента меню.
  • IsDestructiveboolТип , указывает, удаляет ли MenuItem связанный элемент пользовательского интерфейса из списка.
  • IsEnabledboolТип , указывает, отвечает ли элемент меню на входные данные пользователя.
  • Text, тип string, указывает текст элемента меню.

Эти свойства поддерживаются объектами, что означает, что они могут быть целевыми BindableProperty объектами привязок данных.

Создание MenuItem

Чтобы создать элемент меню, например контекстное меню в ListView элементах объекта, создайте MenuItem объект в объекте, который используется в ViewCell качестве DataTemplate объекта для ListViewобъектов ItemTemplate. ListView Когда объект заполняется, он создаст каждый элемент с помощью DataTemplateэлемента, предоставляя MenuItem варианты при активации контекстного меню для элемента.

В следующем примере показано, как создать объект MenuItem в контексте ListView объекта:

<ListView>
    <ListView.ItemTemplate>
        <DataTemplate x:DataType="local:Monkey">
            <ViewCell>
                <ViewCell.ContextActions>
                    <MenuItem Text="Context menu option" />
                </ViewCell.ContextActions>
                <Label Text="{Binding Name}" />
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Этот пример приведет к объекту с текстом MenuItem . Однако внешний MenuItem вид платформ зависит от разных платформ.

Можно MenuItem также создать в коде:

// 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, static (Monkey monkey) => monkey.Name);

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

Контекстное меню в активируется и отображается по-разному на каждой ListView платформе. В Android контекстное меню активируется длинным нажатием клавиши на элементе списка. Контекстное меню заменяет область заголовка и панели навигации, а MenuItem параметры отображаются как горизонтальные кнопки. В iOS контекстное меню активируется путем прокрутки по элементу списка. Контекстное меню отображается в элементе списка и MenuItems отображается как горизонтальные кнопки. В Windows контекстное меню активируется, щелкнув правой кнопкой мыши элемент списка. Контекстное меню отображается рядом с курсором в виде вертикального списка.

Определение поведения MenuItem

Класс MenuItem определяет Clicked событие. Обработчик событий можно подключить к этому событию, чтобы реагировать на касания или щелчки MenuItem объектов:

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

Обработчик событий также может быть присоединен в коде:

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

В этих примерах ссылается OnItemClicked обработчик событий, который показан в следующем примере:

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
}

Определение внешнего вида MenuItem

Значки указываются с помощью IconImageSource свойства. Если указан значок, текст, указанный Text свойством, не будет отображаться. На следующем снимку экрана показан MenuItem значок на Android:

Screenshot of menu items, with an icon, in a ListView context menu on Android.

MenuItem объекты отображают только значки в Android. На других платформах будет отображаться только текст, указанный свойством Text .

Примечание.

Изображения можно хранить в одном расположении в проекте приложения. Дополнительные сведения см. в разделе "Добавление изображений в проект .NET MAUI".

Включение или отключение MenuItem во время выполнения

Чтобы включить или отключить объект во время выполнения, привязать его Command свойство к ICommand реализации и убедиться, что canExecute делегат включает и отключает MenuItem его ICommand соответствующим образом.

Важно!

Не привязывайте IsEnabled свойство к другому свойству при использовании Command свойства для включения или отключения MenuItemсвойства.