Button Left Click시 ContextMenu 열기

UWP에는 MenuFlyout이 있어서 버튼이나 특정 컨트롤에 넣어 놓으면 클릭했을 때 ContextMenu 처럼 자동으로 표시가 됩니다.  아래 이미지와 같이 표시가 됩니다.

 

WPF에서 위와 비슷한 메뉴를 구성해 보았습니다.

<Window x:Class="CoreWpfContextMenu.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:CoreWpfContextMenu"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Button Content="Open ContextMenu" Width="100" Height="30">
            <Button.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Menu1"/>
                    <MenuItem Header="Menu2"/>
                    <Separator/>
                    <MenuItem Header="Menu3"/>
                </ContextMenu>
            </Button.ContextMenu>
        </Button>
    </Grid>
</Window>

 

그런데, 이 컨텍스트 메뉴는 마우스 오른쪽 클릭을 했을 때만 나오기 때문에, 왼쪽 클릭시에도 열리도록 만들기 위해 Behavior를 추가했습니다.

 

추가한 Nuget package는 Microsoft.Xaml.Behaviors.Wpf 입니다.

XAML에 namespace를 추가하고 EventTrigger와 ChangePropertyAction을 이용해서 컨택스트 메뉴가 열리도록 수정했습니다.

<Window x:Class="CoreWpfContextMenu.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:CoreWpfContextMenu"
        xmlns:b="http://schemas.microsoft.com/xaml/behaviors"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Button Content="Open ContextMenu" Width="100" Height="30">
            <b:Interaction.Triggers>
                <b:EventTrigger EventName="Click">
                    <b:ChangePropertyAction TargetName="contextMenu"
                                            PropertyName="IsOpen"
                                            Value="True"/>
                </b:EventTrigger>
            </b:Interaction.Triggers>
            <Button.ContextMenu>
                <ContextMenu x:Name="contextMenu">
                    <MenuItem Header="Menu1"/>
                    <MenuItem Header="Menu2"/>
                    <Separator/>
                    <MenuItem Header="Menu3"/>
                </ContextMenu>
            </Button.ContextMenu>
        </Button>
    </Grid>
</Window>

Telerik RadContextMenu를 이용하면 버튼 바로위에 이쁘게 메뉴를 출력할 수 있는데.. ContextMenu 컨트롤은 Placement와 PlacementTarget이 제대로 동작을 하지 않는 것 같습니다.

소스

WpfTest/CoreWpfContextMenu at master · kaki104/WpfTest (github.com)

kaki104/WpfTest