开源计划之--Android绘图库--LogicCanvas

mac2022-06-30  110

零、前言:

安卓图形绘制一直以来感觉都很繁琐 在html5时,我用JavaScript封装了一个HTML5的canvas库。 HTML5感觉和Android的canvas挺相似,所以考虑移植过来。 绘图库核心是用配置信息绘图,通过逻辑运算绘图 本篇会持续更新,记录LogicCanvas的成长历程

原理简单示意图:

引入
allprojects { repositories { ... maven { url 'https://jitpack.io' } } } implementation 'com.github.toly1994328:logic-canvas-android:0.01'

一、以一个五角星来引入

在自定义View的onDraw方法中:绘制外接圆半径100,内接圆半径50,填充色黄色的5角星
ZCanvas zCanvas = new ZCanvas(canvas); zCanvas.drawNStar( new Painter() .num(5)//角的个数,数字任意 .R(100f)//外接圆半径 .r(50f)内接圆半径


二、公有属性演示:

所谓公有属性是指所有绘制图形适用的属性:包括 线条粗细(b)、线条颜色(ss)、填充颜色(ss)、 位移(p)、坐标系(coo)、旋转(rot)、缩放(sx,sy)屏幕适配dp单位(dp)

属性默认值简介备注pPos(0,0)图形距画布左顶点偏移量rot0旋转角度弧度制sx0x缩放sy0y缩放cooPos(0,0)修改坐标系平移、缩放、旋转使用aPos(0,0)修改锚点b1线条粗ss“#000000”线条样式-fs“#0000ff”填充样式-dp-dp单位在链式末尾调用
1.位移:

p 参数类型:Pos 注:为了和数学更好契合,采用笛卡尔坐标系(上右正),默认屏幕左上角(0,0)点 为了明显,使用工具栏绘制网格参考

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .p(new Pos(200, -100)));//位移X,Y


2.坐标系:为了支持坐标系,可是煞费苦心啊!

coo 参数类型:Pos 为了明显,使用工具栏绘制坐标系参考 注意:使用坐标系后、平移、旋转、缩放都会根据新的坐标系来

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .coo(new Pos(600, 200))//设置坐标系 );


3.描边颜色、粗细

ss 描边颜色 参数类型:int (颜色) b 描边粗细 参数类型:int

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .p(new Pos(200, -100)) .ss(Color.RED)//描边颜色 .b(5f)//描边线条粗细 );


4.旋转:思考良久,单位还是采用:角度数吧

rot 旋转 参数类型:Float

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .ss(Color.RED) .coo(new Pos(600, 200)) .rot(90f)//设置旋转 );

5.缩放:

sx、sy 缩放比例 参数类型:Float

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .ss(Color.RED) .coo(new Pos(600, 200)) .sx(1.5f) .sy(1.5f) );


6.锚点:

coo 参数类型:Pos

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .ss(Color.RED) .coo(new Pos(600, 200)) .a(new Pos(100, 100)) .sx(1.5f) .sy(1.5f) );


7.填充

fs 描边颜色 参数类型:int (颜色)

zCanvas.drawNStar(new Painter() .num(5) .R(100f) .r(50f) .coo(new Pos(600, 200)) .fs(Color.YELLOW) );


8.dp单位适配

下面蓝色是没有适配的,黄色是适配的,蓝色在不同分辨率产生差异,黄色则正常显示

zCanvas.drawNStar(new Painter() .num(5) .R(20f) .r(10f) .fs(Color.YELLOW) .dp(mContext) );

公共属性展示到这里,持续更新,敬请关注 更新时间:2018-09-12:10:25 LogicCanvas-项目地址:github


二、直线绘制:

特有属性:ps 参数类型 不定个数的Pos。 再次强调:默认使用的是0,0为原点的笛卡尔坐标系

1.单线条
zCanvas.drawLines( new Painter() .b(5f) .ps(new Pos(0, 0), new Pos(200, -200)) );


2.多线条
zCanvas.drawLines( new Painter() .b(5f) .ps( new Pos(0, 0), new Pos(200, -200), new Pos(200,-400), new Pos(200,-400), new Pos(800,-400), new Pos(0,0) ) );


三、绘制矩形:

参数 : x 矩形宽 y:矩形高 r:矩形圆角

zCanvas.drawRect( new Painter() .x(1000/2f).y(618/2f).r(50f) .b(5f).ss(Color.RED).p(new Pos(100,-100)) );


四、画圆:

dir true 逆时针方向绘制–默认 r 半径

zCanvas.drawCircle( new Painter() .r(100f) .b(5f).ss(Color.RED) .p(new Pos(200,-200))


五、绘制弧线
zCanvas.drawArc( new Painter() .r(100f).ang(135f) .b(1f).ss(Color.RED) .p(new Pos(200,-100)) );


六、正多边形和正多角形
for (int i = 5; i < 10; i++) { zCanvas.drawRegularPolygon( new Painter() .num(i).R(80f) .b(4f) .p(new Pos(20+210*(i-5),-20))); zCanvas.drawRegularStar( new Painter() .num(i).R(80f) .b(4f) .p(new Pos(20+210*(i-5),-220))); }

展示到这里,持续更新,更多功能敬请期待 更新时间:2018-09-12:13:25

LogicCanvas-项目地址:github

本文由张风捷特烈原创,转载请注明 更多安卓技术欢迎访问:https://www.jianshu.com/c/004f3fe34c94 张风捷特烈个人网站,编程笔记请访问:http://www.toly1994.com 你的喜欢与支持将是我最大的动力

转载于:https://www.cnblogs.com/toly-top/p/9781845.html

相关资源:JAVA上百实例源码以及开源项目
最新回复(0)