win10 uwp 右击浮出窗在点击位置

181 篇文章 4 订阅
128 篇文章 1 订阅

本文主要让MenuFlyout出现在我们右击位置。

我们一般使用的MenuFlyout写在前台,写在Button里面,但是可能我们的MenuFlyout显示的位置和我们想要的不一样。

通过使用后台写ShowAt的方法,我们可以通过e.GetPosition获得鼠标点击位置,需要对函数传入相对的元素,这个元素一般可以用我们点击使用的元素,也可以使用我们的最外层Grid,这样我们就可以获得了鼠标位置,也就可以显示我们的MenuFlyout在点击位置。

我们建一个ListView,然后绑定后台,在我们ListView要右击显示我们的浮出,要求我们的浮出在我们点击位置。

MenuFlyout可以在后台写,当然写在前台也可以。

我们这写在后台,我们可以选择Placement 显示在我们元素的位置,但这不是我们鼠标点击的位置,要显示我们鼠标点击的位置,其实也很简单。我们可以从e.GetPosition(sender as UIElement)获得鼠标位置,把这个给MenuFlyout我们的浮出显示在我们鼠标点击位置

<ListView ItemsSource="{x:Bind View.Str}">

        <ListView.ItemContainerStyle>

            <Style TargetType="ListViewItem">

                <Setter Property="HorizontalContentAlignment"

                                    Value="Stretch" />

                <Setter Property="VerticalContentAlignment" Value="Center"></Setter>

            </Style>

        </ListView.ItemContainerStyle>



        <ListView.ItemTemplate>

            <DataTemplate>

                <Grid Background="#FFda2a5c" RightTapped="GridColection_OnRightTapped">

                    <TextBlock Text="{Binding}"></TextBlock>

                </Grid>

            </DataTemplate>

        </ListView.ItemTemplate>

    </ListView>

后台写

   private void GridColection_OnRightTapped(object sender, RightTappedRoutedEventArgs e)

    {

        MenuFlyout myFlyout = new MenuFlyout();

        MenuFlyoutItem firstItem = new MenuFlyoutItem { Text = "OneIt" };

        MenuFlyoutItem secondItem = new MenuFlyoutItem { Text = "TwoIt" };

        myFlyout.Items.Add(firstItem);

        myFlyout.Items.Add(secondItem);

        //if you only want to show in left or buttom 

        //myFlyout.Placement = FlyoutPlacementMode.Left;



        FrameworkElement senderElement = sender as FrameworkElement;

        //the code can show the flyout in your mouse click 

        myFlyout.ShowAt(sender as UIElement, e.GetPosition(sender as UIElement));

    }

知识共享许可协议
本作品采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可。欢迎转载、使用、重新发布,但务必保留文章署名林德熙(包含链接:http://blog.csdn.net/lindexi_gd ),不得用于商业目的,基于本文修改后的作品务必以相同的许可发布。如有任何疑问,请与我联系

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值