3.3 自定义控件基础 之 View的绘制

简介: 当测量好了一个View之后,我们就可以简单地重写onDraw()方法,并在Canvas对象上来绘制所需要的图形。首先我们来了解一下利用系统2D绘图API所必须要使用到的Canvas对象。

当测量好了一个View之后,我们就可以简单地重写onDraw()方法,并在Canvas对象上来绘制所需要的图形。首先我们来了解一下利用系统2D绘图API所必须要使用到的Canvas对象。

要想在Android的界面中绘制相应的图像,就必须在Canvas上进行绘制。Canvas就像是一个画板,使用Paint就可以在上面作画了。通常需要通过继承View并重写它的onDraw()方法来完成绘图(注意这个思路,后面经常使用到了)。

那什么是Canvas呢?一般情况下,可以使用重写View类中的onDraw()方法来绘图,onDraw()中有一个参数,就是Canvas canvas对象。使用这个Canvas对象就可以进行绘图了,而在其他地方,通常需要使用代码创建一个Canvas对象,代码如下所示。

Canvas canvas = new Canvas(bitmap);
  • 当创建一个Canvas对象时,为什么要传进去一个bitmap对象呢?如果不传进入一个bitmap对象,IDE编译虽然不会报错,但是一般我们不会这样做。
  • 这是因为传进去的bitmap与通过这个bitmap创建的Canvas画布是紧紧联系在一起的,这个过程我们称之为装载画布。
  • 这个bitmap用来存储所有绘制在Canvas上的像素信息。
  • 所以当你通过这种方式创建了Canvas对象后,后面调用所有的Canvas.drawXXX方法都发生在这个bitmap上。
  • 在View类的onDraw()方法中,通过下面这段代码,我们可以了解到canvas与bitmap直接的关系。首先在onDraw方法中绘制两个bitmap,代码如下所示。
canvas.drawBiimap(bitmap1, 0, 0, null);
canvas.drawBitmap(bitmap2, 0, 0, null);

而对于bitmap2,我们将它装载到另一个Canvas对象中,代码如下所示。

Canvas mCanvas=new Canvas(bitmap2);

在其他地方使用Canvas对象的绘图方法在装载bitmap2的Canvas对象上进行绘图,代码如下所示。

mCanvas.drawXXX
  • 通过mCanvas将绘制效果作用在了bitmap2上,再刷新View的时候,就会发现通过onDraw()方法画出来的bitmap2已经发生变化,这就是因为bitmap2承载了在mCanvas上所进行的绘图操作。
  • 虽然我们也使用了Canvas的绘制API,但其实并没有将图形直接绘制在onDraw()方法指定的那块画布上,而是通过改变bitmap,然后让View重绘,从而显示改变之后的bitmap。这一过程对初学者来说可能非常难以理解,但是却非常重要,这对后续进行深入地学习和提升绘图技巧非常有帮助。
      在理解了Canvas对象后,我们就可以调用Canvas所提供的绘图方法,来绘制自己想要的图形了。不管是多么复杂、精美的控件,它都可以被拆分成一个个小的图形单元,我们要做的正是找到这些小的绘图单元并将它们绘制出来。

内容参考自Blankj

目录
相关文章
|
6月前
|
XML 前端开发 Java
Android Studio App自定义控件中自定义视图的绘制讲解及实战(附源码 包括自定义绘制各种图形)
Android Studio App自定义控件中自定义视图的绘制讲解及实战(附源码 包括自定义绘制各种图形)
102 1
|
6月前
|
XML 前端开发 数据可视化
View的绘制流程
View的绘制流程
41 1
|
6月前
|
前端开发
自定义View绘制基础之Canvas
自定义View绘制基础之Canvas
63 0
|
6月前
|
存储 数据可视化 测试技术
[Qt5] QGraphics图形视图框架概述(Item、Scene和View)
[Qt5] QGraphics图形视图框架概述(Item、Scene和View)
1120 0
|
前端开发 C# Windows
WPF技术之图形系列Rectangle控件
WPF Rectangle是Windows Presentation Foundation (WPF)中的一个图形控件,用于在界面上绘制矩形。它是一个非常常见的UI元素,可用于显示、布局和交互。
1168 0
|
XML Android开发 数据格式
控件布局(View)叠加效果
控件布局(View)叠加效果
|
Android开发
自定义 View | 画板
自定义 View | 画板
自定义 View | 画板
SwiftUI—如何将颜色、图片和图形作为视图的背景
SwiftUI—如何将颜色、图片和图形作为视图的背景
820 0
SwiftUI—如何将颜色、图片和图形作为视图的背景
SwiftUI—将子视图作为属性以使布局代码更简洁
SwiftUI—将子视图作为属性以使布局代码更简洁
190 0
SwiftUI—将子视图作为属性以使布局代码更简洁
|
算法 数据可视化
【QT】图形视图、动画框架
【QT】图形视图、动画框架
【QT】图形视图、动画框架