IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> 自定义View之绘制流程 -> 正文阅读

[移动开发]自定义View之绘制流程

持续编辑中,尚未完成

先记录一下bitmap相关知识,因为在绘制图片相关的时候会用到bitmap。

BitMap

????????BitMap在Android中表示已经加载好的图片资源,通过BitMapFactory来加载图片资源,有四种方法,分别是decodeFile(从文件中读取图片),decodeResource(从资源,drawmap目录),decodeStream(从输入流中读取)和decodeByteArray(从字节数组加载),从资源和文件读取的方法,都会转换为输入流然后调用decodeStream方法,最终会调用两个native方法读取资源生成bitmap。

Options参数

????????控制Options参数可以用来提高bitmap加载速度和控制bitmap的大小。举个例子,imageView里面需要加载一个分辨率很高的图像,可以通过设置采样率的方式对图片进行缩放,避免内存溢出和提升加载速度。

override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        val options = BitmapFactory.Options()
        options.inSampleSize=4
        val bitmap =
            BitmapFactory.decodeResource(resources, R.drawable.img,options)
        canvas?.drawBitmap(bitmap,0F,0F,Paint())
    }

????????在这个简单的例子中通过设置采样率为4,将图片长宽缩小为1/4,占用内存缩小到了原来的1/16。

onDraw()

自绘View只需要重写onDraw方法就能实现,这个方法会传入一个Canvas参数用来绘制内容。

canvas

?用来绘制view的内容,实现绘制和裁切旋转的效果。

绘制类方法

canvas拥有一系列draw*()方法,这些方法是绘制内容的核心方法。

例如drawColor方法会将整个区域绘制上一种颜色,drawBitmap会将一张图片绘入区域,drawLine,drawPoint,drawRect,drawCircle会绘制出相应的图形,drawPath会根据传入的Path绘制出自定义图形。

辅助类方法

????????使用canvas可以对绘制内容裁切或者是几何变换,实现局部显示,平移旋转,放大缩小和错切的效果。下面给出效果实例和方法简述:

裁切

通过canvas的clipRect()可以实现切出一个矩形区域

override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        val options = BitmapFactory.Options()
        options.inSampleSize=8
        val bitmap =
            BitmapFactory.decodeResource(resources, R.drawable.img,options)
        canvas?.save()
        //这行代码划定了裁切后范围的四个顶点坐标
        canvas?.clipRect(200,100,800,800)
        canvas?.drawBitmap(bitmap,0F,0F,Paint())
        canvas?.restore()
}

通过clipPath()可以自定义裁切的范围,参数是一个path实例,以裁切为一个圆为例子:

canvas?.save()
val path=Path()
//最后一个参数用来描述以顺时针还是逆时针
path.addCircle(200F,200F,100F,Path.Direction.CCW)
canvas?.clipPath(path)
canvas?.drawBitmap(bitmap,0F,0F,Paint())
canvas?.restore()

平移

//这里表示右移100px,上移动50px
canvas?.translate(100F,-50F)

旋转

//这里表示以100,100为圆心旋转45°
canvas?.rotate(45F,100F,100F)

放缩

//这里表示以100,100为原点放大图形到1.5倍
canvas?.scale(1.5F,1.5F,100F,100F)

错切?

//第一个参数描述在x轴也就是左右的扭曲方向,第二个是y轴
canvas?.skew(0.3F,0.3F)

以上方法都是通过对canvas内置的矩阵进行变换实现的,因此我们也可以直接使用Matrix的setPolyToPoly方法进行点对点变换的映射。

三维变换

要实现三维变换的效果,需要使用到另外一个组件Camera,它与canvas一样使用前后需要保存切换状态,这里举个旋转三十度的例子

        val camera=Camera()
        camera.save()
        //沿x方向旋转30°
        camera.rotateX(20F)
        //canvas的绘制流程是反的,这里是将画布的中心移动回去
        canvas?.translate(300F,300F)
        //将旋转应用到目标canvas
        camera.applyToCanvas(canvas)
        //将canvas的绘制中心,也就是旋转中心移动到图像的中心,使得旋转效果正常化
        canvas?.translate(-300F,-300F)
        canvas?.clipRect(100F,100F,500F,500F)
        canvas?.drawBitmap(bitmap,0F,0F,Paint())
        camera.restore()

?

效果如图,注意canvas的绘制流程是反着来的。

Paint

paint是画笔,作为canvas的参数用来描述绘制内容的,可以用来实现渐变色彩,图片填充等功能。

待续

Path

path用来描述自定义的图形,可以采用add*的一系列方法增添图形,也可以直接画线绘制图形。

待续

绘制顺序

总体来说View的绘制顺序遵循这样的规则:

// 这里是朱凯大佬的示例
// View.java 的 draw() 方法的简化版大致结构(是大致结构,不是源码哦):

public void draw(Canvas canvas) {
    ...

    drawBackground(Canvas); // 绘制背景(不能重写)
    onDraw(Canvas); // 绘制主体
    dispatchDraw(Canvas); // 绘制子 View
    onDrawForeground(Canvas); // 绘制滑动相关和前景

    ...
}

总结一下,先绘制背景,然后绘制本体,再绘制子View,最后绘制前景和处理滑动相关。

继承相关

????????在重写onDraw方法的时候,调用父类的同名方法顺序决定了view的绘制顺序,如果是继承自View的控件怎么写都没关系,因为View的onDraw方法本来就是一个空方法,但是当我们通过继承View的方法来实现自定义View的时候,情况便有所不同。

? ? ? ? 如果调用父类的onDraw方法在前面,自定义的部分便会将父类的覆盖掉,可以用于展示图片大小信息,如果写在后面,那么就会先绘制自定义的部分,可以用于文字的重点色等情况。

子View相关

? ? ? ? 在自定义ViewGroup重写dispatchDraw方法的时候,将自定义内容写在父类同名方法之前,则会被子View覆盖掉自定义的内容,如果将super.dispatchDraw写在前面,则能让自定义内容覆盖在子View之上,可以用来实现列表的装饰效果,例如增加斑点特效。

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2022-05-21 19:06:35  更:2022-05-21 19:07:42 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/25 1:54:41-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码