自定义View从0到1 (1)

第一章 浅谈自定义View

我们先带入门浅谈自定义View与了解自定义View想要学好自定义View对于View要有一个了解不可能一上来就要写一些花哨的视图。

对于自定义View我们先了解Paint(画笔)打个比方我们要进行作画那么画笔Paint有了那么我们需要作画的纸Android中Canvas(画布),现在我们知道了俩个对象Paint(画笔),Canvas(画布)。

接下来我们去了解Paint的属性和Paint画笔大小、粗细、画笔颜色、透明度、字体的样式。

Paint paint =new Paint();                   //创建画笔
paint.setColor(Color.RED);                  // 设置画笔的颜色
paint.setStyle(Paint.Style.STROKE);         //设置画笔的填充样式
paint.setStrokeWidth(10);            		//设置画笔的宽度

paint.setStyle(); 此函数设置填充样式对于文字图形都是有效的,那么Style有哪些有什么区别。

  • Paint.Style.FILL --------------------------- 仅填充内部
  • Paint.Style.FILL_AND_STROKE------填充内部的描边
  • Paint.Style.STROKE ---------------------仅描边

已圆为例一下是各个Style出来的效果
------------------------------------------------ Paint.Style.FILL_AND_STROKE---------------------------------在这里插入图片描述
------------------------------------------------ Paint.Style.FILL----------------------------------------------
在这里插入图片描述 ------------------------------------------------ Paint.Style.STROKE---------------------------------------------FLLL
那么圆是怎么画出来接下来我们了解绘画。
Canvas 使用

//绘制圆形
drawCircle(float cx, float cy, float radius, @NonNull Paint paint);      // 绘制圆形 cx开始的X点 cy 开始的y点  radius圆的半径 panint 画笔
//绘制直线
drawLine(float startX, float startY, float stopX, float stopY, @NonNull Paint paint);  //startX 起始点X startY 起始点Y  stopX 终点X stopY 终点Y  和最后的画笔
//绘制点     点的大小和paint.setStyle无关 和paint.setStrockWidtg()有关
drawPoint(float x, float y, @NonNull Paint paint); //x 点的X坐标 y点的Y坐标  和画笔

通过阅读以上我们已经知道了简单的画圆和paintCanvas的属性我们只需要创建类继承View重写onDraw方法就能绘制。

接下来我们介绍一下矩形,矩形RectFRect.
这俩个都是矩形类根据4个点构造出一个矩形。RectFRect这俩的成员变量一样的,不用的就是构造不一样,RectF是保存float类型的数值,Rect是保存int数值,我们接下来看下他们的构造方法就知道了。

Rect rect=new Rect(int left, int top, int right, int bottom); // 保存int数值  int构造
 RectF rectF=new RectF(float left, float top, float right, float bottom); //保存float数值  float构造

当然也可以用间接方法构造出这俩个矩形举例用Rect空构造通过set方法进行简介构造。

		Rect rect=new Rect();
        rect.set(80,80,80,80); //通过set方法也可以进行创建

看完矩形的创建接下来我们看看矩形的绘制是通过什么方法进行绘制。

drawRect(@NonNull RectF rect, @NonNull Paint paint);
drawRect(@NonNull Rect r, @NonNull Paint paint);
drawRect(float left, float top, float right, float bottom, @NonNull Paint paint);

第一个和第二个绘制方法是通过传入Rect或者RectF进行绘制,第三个是通过传入4个点进行绘制。

		paint = new Paint();
        paint.setStrokeWidth(20);
        paint.setColor(Color.RED);
        paint.setStyle(Paint.Style.STROKE);
		Rect rect=new Rect();
        rect.set(80,80,80,80);
        canvas.drawRect(rect,paint);

大家可以试一下我这边上效果图不知道为什么剪切大小后还是特别大显得篇幅特别长。

接下来了解一下路径,路径是一个重要的概念对于路径的设置其实是早Path上但是绘制还是要通过Canvas进行绘制的。

Canvas中绘制路径的方法是 .

drawPPath(Path path, Paint paint); // path 路径    paint 画笔

绘制直线
绘制直线路径一般有3个函数。

path..moveTo(float x1 , float y1);
//x1、y1是置直线的起始点就是将置先路径绘制点定在x1和y1的位置
path.lineTo(float x2 ,float y2);
//x2、y2是直线的终点,但是也是下次进行绘制的起点,并且lineTo();方法是可以一直调用的。
path.close();
//此方法可以将路径的首位点进行链接,从而形成闭环

下面的代码是 示例可以绘制一个三角形 //不上示例图了 我整明白我的图为什么这么大后在 自定义View0到1 (2)进行添加

  paint = new Paint();
  paint.setStrokeWidth(5);
  paint.setColor(Color.RED);
  paint.setStyle(Paint.Style.STROKE);
  Path path=new Path();
  path.moveTo(100,100); //设定起点
  path.lineTo(100,150);   //设置第一条直线的终点。并设置第二条线的起点
  path.lineTo(300,150);		//绘制第二条线
  path.close();			//进行闭环处理

弧线路径

arcTo(RectF oval, float startAngle, float sweepAngle,boolean forceMoveTo);//  1  标点1下文讲解
arcTo(RectF oval, float startAngle, float sweepAngle);              // 2 
arcTo(float left, float top, float right, float bottom, float startAngle,float sweepAngle, boolean forceMoveTo); //3

参数讲解

  • RectF oval 生椭圆的矩形
  • float startAngle 弧开始的角度,已X正方向为0°
  • float sweepAngle 弧持续的角度
  • boolean forceMoveTo 是否强制的弧的起始点作为绘制起始位置
	//boolean forceMoveTo   当前代码为不强制的
  paint = new Paint();
  paint.setStrokeWidth(5);
  paint.setColor(Color.RED);
  paint.setStyle(Paint.Style.STROKE);
  Path path=new Path();
  path.moveTo(10,10);
  RectF rectF=new RectF(100,10,200,100);
  path.arcTo(rectF,0,90);
  canvas.drawPath(path,paint);
//boolean forceMoveTo  强制的代码
  paint = new Paint();
  paint.setStrokeWidth(5);
  paint.setColor(Color.RED);
  paint.setStyle(Paint.Style.STROKE);
  Path path=new Path();
  path.moveTo(10,10);
  RectF rectF=new RectF(100,10,200,100);
  path.arcTo(rectF,0,90,true);
  canvas.drawPath(path,paint);

大家可以对比一下俩个代码效果出来的差距,我这边抱歉没能上图太大了。。。。。。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值