.NET MAUI 데스크톱 앱에 메뉴 모음 표시

.NET 다중 플랫폼 앱 UI(.NET MAUI) 메뉴 모음은 Mac Catalyst 및 Windows의 앱 맨 위에 있는 가로 행에 메뉴 집합을 표시하는 컨테이너입니다.

메뉴 모음 항목이라고 하는 메뉴 모음의 각 최상위 메뉴는 개체로 MenuBarItem 표시됩니다. MenuBarItem는 다음 속성을 정의합니다.

• Text형식 string의 메뉴 텍스트를 정의합니다.
• IsEnabled형식 boolean의 은 메뉴를 사용할 수 있는지 여부를 지정합니다. 이 속성의 기본값은 true입니다.

이러한 속성은 BindableProperty 개체에서 지원하며, 따라서 데이터 바인딩의 대상이 될 수 있고 스타일이 지정될 수 있습니다.

A MenuBarItem 는 다음 자식으로 구성됩니다.

• MenuFlyoutItem는 클릭할 수 있는 메뉴 항목을 나타냅니다.
• MenuFlyoutSubItem는 클릭할 수 있는 하위 메뉴 항목을 나타냅니다.
• MenuFlyoutSeparator메뉴의 항목을 구분하는 가로줄입니다.

MenuFlyoutSubItemMenuFlyoutItem에서 파생되며, 이 파생은 .에서 MenuItem파생됩니다. MenuItem 는 메뉴 항목의 모양과 동작을 지정할 수 있는 여러 속성을 정의합니다. 메뉴 항목 또는 하위 항목의 모양은 및 IconImageSource 속성을 설정Text하여 정의할 수 있습니다. 메뉴 항목 또는 하위 항목에 대한 응답은 , Command및 CommandParameter 속성을 설정Clicked하여 정의할 수 있습니다. 메뉴 항목에 대한 자세한 내용은 표시 메뉴 항목을 참조 하세요.

메뉴 모음 항목 만들기

MenuBarItem개체는 에 있는 형식IList<MenuBarItem>의 컬렉션에 추가할 MenuBarItems 수 있습니다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>

이 예제에서는 세 개의 최상위 메뉴를 정의합니다. 각 최상위 메뉴에는 메뉴 항목이 있으며, 두 번째 최상위 메뉴에는 하위 메뉴와 구분 기호가 있습니다.

이 예제에서는 각각 MenuFlyoutItem 선택한 경우를 실행하는 메뉴 항목을 정의합니다 ICommand .

바로 가기 키를 통해 메뉴 항목을 호출할 수 있도록 메뉴 모음의 메뉴 항목에 키보드 가속기를 추가할 수 있습니다. 자세한 내용은 키보드 가속기를 참조 하세요.

메뉴 항목에 아이콘 표시

MenuFlyoutItem에서 MenuFlyoutSubItem 속성을 MenuItem상속 IconImageSource 합니다. 그러면 메뉴 항목의 텍스트 옆에 작은 아이콘이 표시될 수 있습니다. 이 아이콘은 이미지 또는 글꼴 아이콘일 수 있습니다.

다음 예제에서는 메뉴 모음 항목을 보여 줍니다. 여기서 메뉴 항목의 아이콘은 글꼴 아이콘을 사용하여 정의됩니다.

<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에서 아이콘과 텍스트를 표시하는 세 가지 메뉴 항목을 정의합니다.

글꼴 아이콘 표시에 대한 자세한 내용은 글꼴 아이콘 표시를 참조 하세요. .NET MAUI 프로젝트에 이미지를 추가하는 방법에 대한 자세한 내용은 .NET MAUI 앱 프로젝트에 이미지 추가를 참조하세요.