美文网首页Android android成神之路iOS && Android
2D 绘画中的 View, Drawable, Canvas,

2D 绘画中的 View, Drawable, Canvas,

作者: 硬耳geeklok | 来源:发表于2016-06-09 00:55 被阅读0次

    在 Android UI 开发中,View 作为其基本元素,必定被大家接触过,而改变 View 图形显示的 2D 绘画有 2 种方法。

    1. 调用 View 及其子类提供的方法如 View:setBackground(Drawable)ImageView:setImageBitmap(Bitmap), 这些方法直接或间接设置相应类中的 Drawable 私有成员。
    2. 继承 View 并重载 onDraw(Canvas),回调中得到画布 Canvas,调用其一系列基本图形的绘画 draw 方法操作其 Bitmap 中的像素数据。

    以下类图描述了 View, Drawable, Canvas, Bitmap 四者的关系。


    Drawable

    Drawable 在 View 2D 绘画里是一个很重要的抽象类,抽象出了怎么画,画什么的一个概念,并提供一些子类可能需要的控制绘画状态的回调方法如 onLevelChange(int)onStateChange(int[] state)

    Drawable 的子类表示不同的绘画 pattern,如 BitmapDrawable 用作展示图片;ShapeDrawable 用作绘画不同类型的基本图形;StateListDrawable 利用父类的 onStateChange(int[]) 回调用作根据状态显示不同图形等等。

    以下是它最重要的一个抽象方法,其子类必须实现这个方法,把图形画到传入的 Canvas 上。

    public abstract void draw(Canvas canvas);
    

    我们一般很少直接接触到 Drawable,大多都是通过 drawable 资源的方式获得并间接使用,下表是一些常用的 Drawable 类型

    资源类型 资源文件后缀 (res/drawable/) XML根节点 编译的数据类型
    Bitmap File .png .jpg .gif - BitmapDrawable
    Nine-Patch FIle .9.png - NinePatchDrawable
    Shape Drawable .xml <shape> ShapeDrawable
    State List .xml <selector> StateListDrawable

    与 View 的关系

    每个 View 都至少有 1 个 Drawable 成员变量,因为作为基类的 View 有一个 Drawable 类型的私有成员 mBackground 用作背景绘画。

    public class View implements Drawable.Callback, KeyEvent.Callback, AccessibilityEventSource {
      ...
      private Drawable mBackground; // 背景
      ...
    
      public void setBackground(Drawable background) {
        setBackgroundDrawable(background);
      }
    
      @Deprecated
      public void setBackgroundDrawable(Drawable background) {
        ...
        mBackground = background;
        ...
      }
    
      public void draw(Canvas canvas) {
        ...
        // Step 1, draw the background, if needed
        if (!dirtyOpaque) {
          drawBackground(canvas);
        }
        ...
      }
    
      private void drawBackground(Canvas canvas) {
        final Drawable background = mBackground;
        ...
        background.draw(canvas);
        ...
      }
    
      @Override
      protected void onDraw(Canvas canvas) {
      }
    
    }
    

    子类 ImageView 的显示主图也是一个 Drawable。

    public class ImageView extends View {
      ...
      private Drawable mDrawable; // 就是 ImageView 中的 image
      ...
    
      public void setImageDrawable(@Nullable Drawable drawable) {
        ...
        updateDrawable(drawable);
        ...
      }
    
      private void updateDrawable(Drawable d) {
        ...
        mDrawable = d;
        ...
      }
    
      @Override
      protected void onDraw(Canvas canvas) {
        ...
        mDrawable.draw(canvas);
        ...
      }
    
    }
    

    从以上 View 及 ImageView 的短短部分源码可以看到它们都有 setter 方法设置相应的 Drawable,然后这些 Drawable 在 View:draw(Canvas)View:onDraw(Canvas) 里都调用了 Drawable:draw(Canvas) 方法,把 Drawable 中的内容画到参数中的 Canvas 上。

    Canvas 和 Bitmap

    Canvas 虽然直译为画布,但它实际操作和存储的像素数据都在它的私有成员 Bitmap 对象中,Canvas 只提供一系列基本图形的绘画方法如 drawBitmap(...)drawRect(...)等。
    每个 Canvas 都必须传入一个 Bitmap(构造方法或 setter)用作真正的绘画,所以平时说到的画到 Canvas,实际上都是画到其 Bitmap。

    public class Canvas {
      ...
      private Bitmap mBitmap;
      ...
    
      public Canvas(@NonNull Bitmap bitmap) {
        ...
        mBitmap = bitmap;
        ...
      }
    
      public void setBitmap(@Nullable Bitmap bitmap) {
        ...
        mBitmap = bitmap;
      }
    
    }
    

    相关文章

      网友评论

        本文标题:2D 绘画中的 View, Drawable, Canvas,

        本文链接:https://www.haomeiwen.com/subject/ogbldttx.html