Android开发者必须要了解的View绘制过程(View的工作原理之Draw过程)

View的工作原理之绘制过程

目录

• 1. View的详细绘制过程
  
  • 1.1 绘制过程到底要做一些什么？
  • 1.2 画在哪？
  • 1.3 如何画？
  • 1.4 用什么画？
  • 1.5 整个流程
• 2. View与Canvas的关系
• 3. 案例绘制一个长方形
  
  • 3.1 效果图
  • 3.2 activity.xml
  • 3.3 DrawView.java

---

1. View的详细绘制过程

1.1 绘制过程到底要做一些什么？

在普通View的绘制过程,直接回调绘制过程相关方法。但是对于ViewGroup,会在回调到dispatchDraw的时候，回调子节点的draw流程。

那么在绘制的时候，到底要做什么呢？？？

那就是根据实际的业务需求，绘制出需要的UI图。

1.2 画在哪？

每一个View都对应了一个Canvas(画布)，所以绘制的目的地就是这个Canvas。

1.3 如何画？

Canvas提供了绘制各种图形的方法，根据算法计算出对应的数据，即可通过Canvas调用绘制方法。

1.4 用什么画？

我们都知道在现实生活中画图时，有画布，画笔。在Android中，也提供了一个Paint专门用作在Canvas中绘图

1.5 整个流程

1. 拿到画布(在onDraw的参数中传递过来)
2. 选择画笔(对画笔进行设置，设置笔的风格，相当于技法)
3. 绘制(有了画笔和画布，那就要画了~~~)

2. View与Canvas的关系

可以认为View是一块可见区域，Canvas是是无限大的，但是他们的起点默认是重合的。所以如果图画在了可视区域的外面区域，想要让它显示出来，需要将Canvas移动，而不是View.

注意:
绘制过程中需要手动计算padding, 因为canvas绘制时，没有将padding的值排除在外。

3. 案例绘制一个长方形

3.1 效果图

3.2 activity.xml

<android.support.constraint.ConstraintLayout 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="com.ung8023.androidbase.view.define.ViewDrawActivity">

    <com.ung8023.androidbase.view.define.DrawView
        android:padding="20dp"
        android:layout_width="200dp"
        android:layout_height="200dp" />

</android.support.constraint.ConstraintLayout>

3.3 DrawView.java

public class DrawView extends View {

    Paint paint;

    public DrawView(Context context) {
        super(context);
        init();
    }

    public DrawView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public DrawView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    void init(){
        // 创建画笔
       paint = new Paint();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
         // 设置画笔
        paint.setColor(Color.RED);
        // 填充模式
        paint.setStyle(Paint.Style.FILL);
        // 绘制长方形
        canvas.drawRect(0,0,100,50, paint);
    }
}

---

我的个人网站

• Android模块
• 开发知识分享

推荐视频教程：

Android从整体到局部系列视频教程戳我

广告：

我使用的装备：程序员必备 | 不伤关节 | 手感好 | 静电容 | Plum键盘|Niz键盘 戳我

---