UWP 绘制图形
UWP图形和wpf变化不多
一般用到有椭圆、长方形、多边形、线
不过如果用的好,可以做出很漂亮的界面
一般使用画图都是使用Shape 类,Shape 类具有一个与其关联的画笔并可以呈现到屏幕,包括 Line、Ellipse、Rectangle、Polygon、Polyline
画圆
在uwp没有圆这东西,我们可以用长和宽一样的Ellipse作为圆
<Ellipse Height="200" Width="200" Fill="Black" />
如果长和宽不一样,那么就看起来是Ellipse
矩形
Rectangle要指定指定 Width、Height 和 Fill
<Rectangle Height="200" Width="200" Fill="Black"/>
圆角矩形
指定RadiusX 和 RadiusY ,RadiusX 和 RadiusY最大可以是宽高一半
<Rectangle Height="200" Width="200" Fill="Black" StrokeThickness="3" RadiusX="10" RadiusY="10"/>
我们有一个新的画圆的方法
RadiusX =Width/2
RadiusY =Height/2
<Rectangle Height="200" Width="200" Fill="Black" StrokeThickness="3" RadiusX="100" RadiusY="100" />
如果不要填充,那么使用 Border
多边形
Polygon 是通过任意数量的点来定义边的形状。边通过用直线将点一个一个连接起来(第最后一个点与第一个点相连)而创建。Points 属性定义组成边的点集。在 XAML 中,使用逗号分隔的列表定义点。在代码隐藏文件中,使用 PointCollection 定义各个点,并将每个点作为一个 Point 值添加到集合中。
<Polygon Fill="Black" Points="0,100,200,100,200,0,0,0"/>
线
设置X1 Y1和X2 Y2,如果不设置X1 Y1,X1 Y1=0
如果没有设置Stroke,线会不可见
<Line X1="10" Y1="10" X2="100" Y2="100" Stroke="Black"/>
设置StrokeThickness
<Line X1="10" Y1="10" X2="100" Y2="100" Stroke="Black" StrokeThickness="10" Margin="10,10,10,10"/>
path
这个是最能做漂亮的动画
应用可以参照http://www.cnblogs.com/isaboy/p/customprogress.html
参考:https://msdn.microsoft.com/zh-cn/library/windows/apps/xaml/mt280380.aspx
UWP 绘制图形的更多相关文章
- CSS 魔法系列:纯 CSS 绘制图形(心形、六边形等)
<CSS 魔法系列>继续给大家带来 CSS 在网页中以及图形绘制中的使用.这篇文章给大家带来的是纯 CSS 绘制五角星.六角形.五边形.六边形.心形等等. 我们的网页因为 CSS 而呈现千 ...
- html5 Canvas绘制图形入门详解
html5,这个应该就不需要多作介绍了,只要是开发人员应该都不会陌生.html5是「新兴」的网页技术标准,目前,除IE8及其以下版本的IE浏览器之外,几乎所有主流浏览器(FireFox.Chrome. ...
- html5 canvas 笔记一(基本用法与绘制图形)
<canvas> 元素 <canvas id="tutorial" width="150" height="150"> ...
- WPF2D绘制图形方法
我们先看看效果如何: xaml文件: <Window x:Class="WPF2D绘制图形方法.MainWindow" xmlns="http://schemas. ...
- 11-UIKit(Storyboard、View的基本概念、绘制图形、UIBezierPath)
目录: 1. Storyboard 2. Views 3. View的基本概念介绍 4. 绘制图形 5. UIBezierPath 回到顶部 1. Storyboard 1.1 静态表视图 1)Sec ...
- HTML5—canvas绘制图形(1)
1.canvas基础知识 canvas元素是HTML5中新增的一个重要的元素,专门用来绘制图形,不过canvas本身不具备画图的能力,在页面中放置了canvas元素,就相当于在页面中放置了一块矩形的“ ...
- 【canvas学习笔记二】绘制图形
上一篇我们已经讲述了canvas的基本用法,学会了构建canvas环境.现在我们就来学习绘制一些基本图形. 坐标 canvas的坐标原点在左上角,从左到右X轴坐标增加,从上到下Y轴坐标增加.坐标的一个 ...
- HTML5使用Canvas来绘制图形
一.Canvas标签: 1.HTML5<canvas>元素用于图形的绘制,通过脚本(通常是javascript)来完成. 2.<canvas>标签只是图形容器,必须使用脚本来绘 ...
- canvas 绘制图形
canvas 绘制图形: 注意: canvas 的宽高设置在行内,否则会使画布(canvas)产生扭曲,绘图变形: <!DOCTYPE html> <html lang=" ...
随机推荐
- 201521123031 《Java程序设计》第13周学习总结
1. 本周学习总结 以你喜欢的方式(思维导图.OneNote或其他)归纳总结多网络相关内容. 2. 书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu ...
- 控制结构(4) 局部化(localization)
// 上一篇:状态机(state machine) // 下一篇:必经之地(using) 基于语言提供的基本控制结构,更好地组织和表达程序,需要良好的控制结构. 前情回顾 上一次,我们说到状态机结构( ...
- Python的自学之路:Python基础(一)
声明:我写博客不是为了什么,只是为了记录自己的学习状态,学过的知识点!方便以后进行好的复习!python小白,勿喷 python环境的搭建,在这里就不细说了,这里有我的链接,可以参考一下:https: ...
- 接口测试入门(4)--接口自动化测试框架 / list和map用法 / 随机选取新闻 (随机数生成) / 接口相关id映射
一.接口自动化测试框架 为了更好的组织测试方法,测试用例并且持续集成,我们选择了 java+testNG(测试用例组织)+gitlab(代码版本管理)+Jenkins(持续集成工具) 作为一整套的自 ...
- Django(博客系统):按照时间分层筛选“/blog/article/?create_time__year=2017”,出现问题:Database returned an invalid datetime value. Are time zone definitions for your database installed?
问题背景 添加文章时间没问题,但为了设定博客文章按照时间分层筛选(创建时间的年份.年月&月份来搜索文章),我在blog这个django app的admin.py的ArticleAdmin类中做 ...
- ASP.NET Core 2.0 使用支付宝PC网站支付
前言 最近在使用ASP.NET Core来进行开发,刚好有个接入支付宝支付的需求,百度了一下没找到相关的资料,看了官方的SDK以及Demo都还是.NET Framework的,所以就先根据官方SDK的 ...
- JS设计模式(一) 单例模式
命名空间 单例模式是JavaScript中最常见的一种模式,通过这种模式可以为我们提供一个命名空间,例如jQuery库的命名空间为jQuery或$.命名空间的使用是为了让代码更加整洁,在多人协作开发的 ...
- 使用LayUI操作数据表格
接着 上一篇 继续完善我们的demo,这次我们加一个搜索按钮 搜索 在table标签的上方,加入这样一组html <div class="demoTable"> 搜索商 ...
- kmp next数组的理解(挺好的一篇文章 ,原来kmp最初的next是这样的啊,很好理解)
KMP算法的next[]数组通俗解释 我们在一个母字符串中查找一个子字符串有很多方法.KMP是一种最常见的改进算法,它可以在匹配过程中失配的情况下,有效地多往后面跳几个字符,加快匹配速度. 当然我 ...
- poj1006中国剩余定理
Biorhythms Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 103506 Accepted: 31995 Des ...