自定义view基础

自定义View绘制知识的需要了解掌握的四个内容
1.Canvas 的 drawXXX() 系列方法及 Paint 最常见的使用

Canvas.drawXXX() 是自定义绘制最基本的操作。掌握了这些方法,你才知道怎么绘制内容,例如怎么画圆、怎么画方、怎么画图像和文字。组合绘制这些内容,再配合上 Paint 的一些常见方法来对绘制内容的颜色和风格进行简单的配置,就能够应付大部分的绘制需求了。

2.Paint 的内容

Paint 可以做的事,不只是设置颜色,也不只是实心空心、线条粗细、有没有阴影,它可以做的风格设置真的是非常多、非常细

3.Canvas 对绘制的辅助——范围裁切和几何变换。

大多数时候,它们并不会被用到,但一旦用到,通常都是很炫酷的效果。

4.使用不同的绘制方法来控制绘制顺序

控制绘制顺序解决的并不是「做不到」的问题,而是性能问题。同样的一种效果,你不用绘制顺序的控制往往也能做到,但需要用多个 View 甚至是多层 View 才能拼凑出来,因此代价是 UI 的性能;而使用绘制顺序的控制的话,一个 View 就全部搞定了。

入门 绘制一个简单的圆

新建一个MyView类,继承自View

1
2
3
4
5
6
7
8
9
10
11
12
class MyView : View {
//这个构造函要添加
constructor(context: Context?, attrs: AttributeSet?) : super(context, attrs)

val paint = Paint()

override fun onDraw(canvas: Canvas) {
super.onDraw(canvas)
//绘制一个圆
canvas.drawCircle(300f,300f,200f,paint)
}
}

在xml布局文件中引用

1
2
3
4
5
6
7
8
9
10
11
12
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<com.ccc.myview.MyView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

</LinearLayout>

运行效果

View中的坐标系

在 Android 里,每个 View 都有一个自己的坐标系,彼此之间是不影响的。这个坐标系的原点是 View 左上角的那个点;水平方向是 x 轴,右正左负;竖直方向是 y 轴,下正上负(注意,是下正上负,不是上正下负,和上学时候学的坐标系方向不一样)。也就是下面这个样子。

所以一个 View 的坐标 (x, y) 处,指的就是相对它的左上角那个点的水平方向 x 像素、竖直方向 y 像素的点。例如,(300, 300) 指的就是左上角的点向右 300 、向下 300 的位置; (100, -50) 指的就是左上角的点向右 100 、向上 50 的位置。

也就是说, canvas.drawCircle(300, 300, 200, paint) 这行代码绘制出的圆,在 View 中的位置和尺寸应该是这样的:

View的位置由4个顶点决定的(如下A、B、C、D)

4个顶点的位置描述分别由4个值决定:
(记住:View的位置是相对于父控件而言的

  • Top:子View上边界到父view上边界的距离
  • Left:子View左边界到父view左边界的距离
  • Bottom:子View下边距到父View上边界的距离
  • Right:子View右边界到父view左边界的距离

0%