首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >win10 uwp 去掉 Flyout 边框

win10 uwp 去掉 Flyout 边框

作者头像
林德熙
发布2019-03-13 11:01:32
7820
发布2019-03-13 11:01:32
举报
文章被收录于专栏:林德熙的博客林德熙的博客

在 UWP 的 Flyout 的边框一点都不好看,本文告诉大家如何去掉这个边框

先写一个简单的界面,这个界面里面有一个按钮

           <Button.Flyout>
                <Flyout Placement="Right">
                    <Grid Name="PopupGrid" Background="Aqua" Height="600" Width="200"/>
                </Flyout>
            </Button.Flyout>
        </Button>

运行代码,点击按钮,可以看到下面界面

通过重写 FlyoutPresenterStyle 可以修改边框的距离

            <Button.Flyout>
                <Flyout Placement="Right">
                    <Flyout.FlyoutPresenterStyle>
                        <Style TargetType="FlyoutPresenter">
                            <Setter Property="Padding" Value="0"></Setter>
                            <Setter Property="BorderThickness" Value="0"></Setter>
                        </Style>
                    </Flyout.FlyoutPresenterStyle>
                    <Grid Name="PopupGrid" Background="Aqua" >
                        <TextBlock Margin="10,10,10,10" Text="欢迎访问我博客 https://blog.lindexi.com 里面有大量 UWP 博客"></TextBlock>
                    </Grid>
                </Flyout>
            </Button.Flyout>

现在运行代码点击按钮可以看到下面界面,看不到边框

更多 Flyout 请看

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


本文会经常更新,请阅读原文: https://lindexi.gitee.io/post/win10-uwp-%E5%8E%BB%E6%8E%89-Flyout-%E8%BE%B9%E6%A1%86.html ,以避免陈旧错误知识的误导,同时有更好的阅读体验。

知识共享许可协议
知识共享许可协议

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

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档