win10 UWP 用Path画图

本文将使用 Path 画一个聊天气泡。

内容是看到 大神写的 WPF绘制简单常用的Path,想到 UWP 画图是不是也一样,于是做的一个抄袭的 Path

直接使用图片

我们写上所有点。写在折线,在UWP,还是存在和 WPF 做法有些修改,却没有修改什么。

            <Path Stroke="Black" StrokeThickness="2" Margin="10,10,10,10">
              <Path.Data>
                  <PathGeometry>
                        <PathGeometry.Figures>
                            <PathFigure>
                                <PolyLineSegment Points="0,0 100,0 100,90 55,90 50,100 45,90 0,90 0,0"></PolyLineSegment>
                            </PathFigure>
                        </PathGeometry.Figures>
                    </PathGeometry>
              </Path.Data>
          </Path>

其实,可以不加PathGeometry.Figures ,看起来就和之前代码一样

下面就使用 ArcSegment 看起来不是尖角

              <Path Stroke="Black" StrokeThickness="2" Margin="200,10,10,10">
                <Path.Data>
                    <PathGeometry>
                        <PathGeometry.Figures>
                            <PathFigure StartPoint="0,5">
                                <LineSegment Point="0,85"></LineSegment>
                                <ArcSegment Point="5,90" Size="5,5"></ArcSegment>
                                <LineSegment Point="45,90"></LineSegment>
                                <LineSegment Point="50 100"></LineSegment>
                                <LineSegment Point="55,90"></LineSegment>
                                <LineSegment Point="95,90"></LineSegment>
                                <ArcSegment Point="100,85" Size="5,5"></ArcSegment>
                                <LineSegment Point="100,5"></LineSegment>
                                <ArcSegment Point="95,0" Size="5,5" ></ArcSegment>
                                <LineSegment Point="5,0"></LineSegment>
                                <ArcSegment Point="0,5" Size="5,5"></ArcSegment>
                            </PathFigure>
                        </PathGeometry.Figures>
                    </PathGeometry>
                </Path.Data>
            </Path>

如果我们把第一个图,边框变大,可以看到没有合,这样觉得不好

可以设置 PathFigure IsClosed="True" 让最后一个点合在开始,这样就是闭合,不会出现没有合

我们来说下 ArcSegment

http://www.cnblogs.com/tsliwei/p/5609035.html

http://www.cnblogs.com/xpvincent/p/3830108.html


本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏码生

StackNavigator in react-navigation 如何动态修改导航标题 headerLeft headerRight headerTitle 等

StackNavigator in react-navigation 如何动态修改导航标题 headerLeft headerRight headerTitle...

52420
来自专栏非著名程序员

智能下拉刷新框架-SmartRefreshLayout

框架?下拉刷新控件还能框架化?智能?啥玩意来着?二话不多少先上Demo效果图,咱们再来探个究竟。 Github 传送门(https://github.com/s...

68250
来自专栏个人随笔

使用ListView控件展示数据

属性名称    说明 items   指定显示那种视图 View   指定显示那种视图 largelmagelist  大图标图像的imagelist控件 Sm...

30770
来自专栏林德熙的博客

控件

Windows的XAML UI框架提供了很多控件,支持用户界面开发库。其中一些有可视化,一些布局。 一些控件例子:https://github.com/Micr...

12210
来自专栏青玉伏案

iOS开发之仿射变换示例总结

本篇博客比较简单,但还是比较实用的。其中的示例依然使用Swift3.0来实现,该博客算是下篇博客的一个引子,因为我们下篇博客要介绍使用Swift开发iOS应用中...

21380
来自专栏我和未来有约会

silverlightLogo动画

文件: silverlightLogoLoop.wmv SilverlightLogo.xml Silverlight.js demo.html Si...

200100
来自专栏HTML5学堂

GIF图像转换为多张JPG

HTML5学堂:在JS效果中,有一个使用代码处理多张连续的JPG图像,显示为动态GIF图的效果。于是乎,自己不得不制作多个连续的JPG图片。既然要做素材,也就顺...

29340
来自专栏IMWeb前端团队

一年前的焦点bug终于找到原因了, 图标文本对齐完美了~

? 正常来说点击可编辑框末尾空白,光标默认会闪烁在末尾 , 但是闪到了倒数第二个了....当时一直以为js有问题...压根没想到是一个top属性.... 虽然...

24290
来自专栏Micro_awake web

HTML5语义化元素

语义化元素:有意义的元素。 对语义化的理解: 正确的标签做正确的事情; HTML5语义化元素让页面内容结构化清晰; 便于开发人员阅读,理解,维护; 搜索引擎爬虫...

26150
来自专栏上善若水

046android初级篇之android多分辨率兼容

android:anyDensity="true"时,应用程序安装在不同密度的终端上时,程序会分别加载xxhdpi、xhdpi、hdpi、mdpi、ldpi文件...

10820

扫码关注云+社区

领取腾讯云代金券