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


Отображение строки меню в классическом приложении .NET MAUI

Панель меню .NET Multi-platform App UI (.NET MAUI) — это контейнер, который представляет набор меню в горизонтальной строке в верхней части приложения в Mac Catalyst и Windows.

Каждое меню верхнего уровня в строке меню, известное как элемент строки меню, представлено MenuBarItem объектом. MenuBarItem определяет следующие свойства:

  • Text, тип string, определяет текст меню.
  • IsEnabledbooleanТип , указывает, включено ли меню. Значение по умолчанию этого свойства равно true.

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

A MenuBarItem может состоять из следующих дочерних элементов:

  • MenuFlyoutItem, представляющий элемент меню, который можно щелкнуть.
  • MenuFlyoutSubItem, представляющий элемент вложенного меню, который можно щелкнуть.
  • MenuFlyoutSeparator— горизонтальная линия, разделяющая элементы в меню.

MenuFlyoutSubItem производный от MenuFlyoutItem, от которого, в свою очередь, является производным от MenuItem. MenuItem определяет несколько свойств, позволяющих указывать внешний вид и поведение элемента меню. Внешний вид элемента меню или вложенного элемента можно определить, задав Textсвойства и IconImageSource свойства. Ответ на пункт меню или вложенный элемент можно определить, задав ClickedCommandCommandParameter и свойства. Дополнительные сведения о элементах меню см. в разделе "Отображение элементов меню".

Создание элементов строки меню

MenuBarItem объекты можно добавить в коллекцию MenuBarItems , тип IList<MenuBarItem>, в объекте ContentPage. Классические приложения .NET MAUI будут отображать строку меню, содержащую элементы меню, когда они добавляются в NavigationPage любое ContentPage приложение оболочки.

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

<ContentPage ...>
    <ContentPage.MenuBarItems>
        <MenuBarItem Text="File">
            <MenuFlyoutItem Text="Exit"
                            Command="{Binding ExitCommand}" />
        </MenuBarItem>
        <MenuBarItem Text="Locations">
            <MenuFlyoutSubItem Text="Change Location">
                <MenuFlyoutItem Text="Redmond, USA"
                                Command="{Binding ChangeLocationCommand}"
                                CommandParameter="Redmond" />
                <MenuFlyoutItem Text="London, UK"
                                Command="{Binding ChangeLocationCommand}"
                                CommandParameter="London" />
                <MenuFlyoutItem Text="Berlin, DE"
                                Command="{Binding ChangeLocationCommand}"
                                CommandParameter="Berlin"/>
            </MenuFlyoutSubItem>
            <MenuFlyoutSeparator />            
            <MenuFlyoutItem Text="Add Location"
                            Command="{Binding AddLocationCommand}" />
            <MenuFlyoutItem Text="Edit Location"
                            Command="{Binding EditLocationCommand}" />
            <MenuFlyoutItem Text="Remove Location"
                            Command="{Binding RemoveLocationCommand}" />                            
        </MenuBarItem>
        <MenuBarItem Text="View">
            <MenuFlyoutItem Text="Refresh"
                            Command="{Binding RefreshCommand}" />
            <MenuFlyoutItem Text="Change Theme"
                            Command="{Binding ChangeThemeCommand}" />
        </MenuBarItem>
    </ContentPage.MenuBarItems>
</ContentPage>

В этом примере определяются три меню верхнего уровня. В каждом меню верхнего уровня есть пункты меню, а во втором меню верхнего уровня есть подмена и разделитель:

Снимок экрана: строка меню.

Примечание.

В Mac Catalyst элементы меню добавляются в системную строку меню.

В этом примере каждый MenuFlyoutItem определяет элемент меню, который выполняется при выборе ICommand .

Ускорители клавиатуры можно добавить в пункты меню в строке меню, чтобы элемент меню можно вызывать с помощью сочетания клавиш. Дополнительные сведения см. в статье об акселераторах клавиатуры.

Отображение значков в пунктах меню

MenuFlyoutItem и MenuFlyoutSubItem наследует IconImageSource свойство, MenuItemкоторое позволяет отображать небольшой значок рядом с текстом элемента меню. Этот значок может быть изображением или значком шрифта.

Предупреждение

Mac Catalyst не поддерживает отображение значков в пунктах меню.

В следующем примере показан элемент строки меню, в котором значки для элементов меню определяются с помощью значков шрифта:

<ContentPage.MenuBarItems>
    <MenuBarItem Text="Media">
        <MenuFlyoutItem Text="Play">
            <MenuFlyoutItem.IconImageSource>
                <FontImageSource Glyph="&#x25B6;"
                                 FontFamily="Arial" />
            </MenuFlyoutItem.IconImageSource>
        </MenuFlyoutItem>
        <MenuFlyoutItem Text="Pause"
                        Clicked="OnPauseClicked">
            <MenuFlyoutItem.IconImageSource>
                <FontImageSource Glyph="&#x23F8;"
                                 FontFamily="Arial" />
            </MenuFlyoutItem.IconImageSource>
        </MenuFlyoutItem>
        <MenuFlyoutItem Text="Stop"
                        Clicked="OnStopClicked">
            <MenuFlyoutItem.IconImageSource>
                <FontImageSource Glyph="&#x23F9;"
                                 FontFamily="Arial" />
            </MenuFlyoutItem.IconImageSource>
        </MenuFlyoutItem>
    </MenuBarItem>
</ContentPage.MenuBarItems>

В этом примере элемент строки меню определяет три пункта меню, отображающие значок и текст в Windows.

Дополнительные сведения о отображении значков шрифтов см. в разделе "Отображение значков шрифта". Сведения о добавлении изображений в проекты MAUI .NET см. в разделе "Добавление образов в проект приложения .NET MAUI".