第六章:Android 绘图机制与处理技巧
《Android群英传》——个人读书笔记
6.1 屏幕的尺寸信息
6.1.1 屏幕参数
-
屏幕大小
指的是屏幕对角线的长度,通常使用“寸”度量 -
分辨率
指的是屏幕像素点的个数,例如:720 * 1280 ,指屏幕的宽有720g个像素点,高有1080个像素点。 -
PPI
每英寸像素,又称 DPI 。它是由对角线的像素点数除以屏幕的大小得到的。
6.1.2 系统屏幕密度
不同的手机厂商,不同的手机,不同的大小尺寸,不同的像素密度。想要统一,基本不可能。因此,系统定义了几个标准的DPI值:
密度 | Idpi | mdpi | hdpi | xhdpi | xxhdpi |
---|---|---|---|---|---|
密度值 | 120 | 160 | 240 | 320 | 480 |
分辨率 | 240*320 | 320*480 | 480*800 | 720*1280 | 1080*1920 |
6.1.3 独立像素密度 dp
1)Android系统使用 mdpi 的屏幕作为标准屏幕,在此屏幕上 1px = 1dp
2)密度的换算公式:
密度 | Idpi | mdpi | hdpi | xhdpi | xxhdpi |
---|---|---|---|---|---|
换算公式 | \ | 1dp = 1px | 1dp = 1.5px | 1dp = 2px | 1dp = 3px |
各个分辨率的比例:Idpi:mdpi:hdpi:xhdpi:xxhdpi = 3:4:6:8:12
6.1.4 单位转换
6.2 2D绘图基础
6.3 Android XML绘图
- XML 不仅仅是布局文件、配置列表。它也可以是图
6.3.1 mipmap
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/ic_launcher"/>
这样引用图片,可以直接将图片转换成Bitmap
6.3.2 Shape
- shape 可以绘制各种图形
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 填充的颜色 -->
<solid android:color="#ffffff" />
<!-- 设置边框宽度 -->
<stroke
android:color="#ffffff"
android:width="1dp" />
<!-- 四个角的弧度 -->
<corners
android:bottomLeftRadius="15dp"
android:bottomRightRadius="15dp"
android:topLeftRadius="15dp"
android:topRightRadius="15dp" />
<padding
android:bottom="5dp"
android:left="2dp"
android:right="2dp"
android:top="5dp" />
</shape>
除此之外还有好多其他属性,这里不再说明
6.3.3 Layer
通过Layer可以实现类似PhotoShop中图层的概念
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 阴影部分 -->
<!-- 个人觉得更形象的表达:top代表下边的阴影高度,left代表右边的阴影宽度。其实也就是相对应的offset,solid中的颜色是阴影的颜色,也可以设置角度等等 -->
<item
android:bottom="2dp"
android:left="2dp"
android:right="2dp"
android:top="2dp">
<shape android:shape="rectangle">
<gradient
android:endColor="#ED1A3D"
android:startColor="#ED1A3D" />
</shape>
</item>
<!-- 背景部分 -->
<!-- 形象的表达:bottom代表背景部分在上边缘超出阴影的高度,right代表背景部分在左边超出阴影的宽度(相对应的offset) -->
<item
android:bottom="3dp"
android:left="3dp"
android:right="3dp"
android:top="3dp">
<shape android:shape="rectangle">
<gradient
android:endColor="#1D1D27"
android:startColor="#1D1D27" />
</shape>
</item>
</layer-list>
6.3.4 Selector
用于实现静态绘图中的反馈
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--默认时的背景图片-->
<item android:drawable="@drawable/X1"/>
<!--没有焦点时的背景图片-->
<item android:state_window_focused="false"
android:drawable="@drawable/X2"/>
<!--非触摸模式下获得焦点并单击时的背景图片-->
<item android:state_focused="true"
android:state_pressed="true"
android:drawable="@drawable/X3"/>
<!--模式下获得焦点并单击时的背景图片-->
<item android:state_focused="false"
android:state_pressed="true"
android:drawable="@drawable/X4"/>
<!--选中时的背景图片-->
<item android:state_selected="true"
android:drawable="@drawable/X5"/>
<!--获得焦点时的图片背景-->
<item android:state_focused="true"
android:drawable="@drawable/X5"/>
</selector>
6.4 Android 绘图技巧
6.4.1 Canvas
绘制图形的直接对象
- 常用方法:
- Canvas.save(): 保存画布,将之前所有已绘制的图像保存起来,与Photoshop的图层理解基本一致
- Canvas.restore(): 合并图层,将save()前后所有绘制的图像进行合并
- Canvas.translate(): 坐标系的平移
- Canvas.roate(): 坐标系的翻转
6.4.2 Layer
1)图层入栈:saveLayer()、saveLayerAlpha()
2)图层出栈:restore()、restoreToCount()
6.5 Android图像处理之色彩特效处理
- Android处理图片,最常用的数据结构——Bitmap(位图)
6.5.1 色彩矩阵分析
- 描述图像的三个角度:
1)色调:物体传播的颜色
2)饱和度:颜色的纯度,从0(灰)-100%(饱和)来进行描述
3)亮度:颜色的相对明暗程度 - Android系统使用的颜色矩阵——ColorMatrix,来处理图像的色彩效果
6.5.1.1 改变偏移量
6.5.1.2 改变颜色系数
6.5.1.3 改变色光属性
6.5.2 Android颜色矩阵——ColorMatrix
6.5.3 常用图像颜色矩阵处理效果
6.5.3.1 灰度效果
6.5.3.2 图像反转
6.5.3.3 怀旧效果
6.5.3.4 去色效果
6.5.3.5 高饱和度
6.5.4 像素点分析
更加精准的像素处理方式,可以通过改变每个像素点的具体ARGB值,来处理图像。
需注意,传递进来的原始图像是不可以直接进行修改的,要根据原始图像生成一张新的图像来进行改动。
bitmap.getPixels(pixels, offset, stride, x, y, width, height) 提取像素点的方法
参数的含义:
- pixels: 接收位图颜色值的数组
- offset: 写入到piexls[]中的第一个像素索引值
- stride: piexls[]中的行间距
- x: 从位图中读取的第一个像素的X坐标值
- y: 从位图中读取的第一个像素的Y坐标值
- width: 从每一行中读取的像素宽度
- height: 读取的行数
6.5.5 常用图像像素点处理效果
6.5.5.1 底片效果
6.5.5.2 老照片效果
6.5.5.3 浮雕效果
6.6 Android图像处理之图形特效处理
6.6.1 Android 变形矩阵——Matrix
- 图像的变形处理通常包含四类基本变换:
1) Translate——平移
2) Rotate——旋转
3) Scale——缩放
4) Skew——错切
6.6.1.1 平移变换
6.6.1.2 旋转变换
6.6.1.3 缩放变换
6.6.1.4 错切变换
6.6.2 像素块分析
drawBitmapMesh(Bitmap bitmap, int meshWidth, int meshHeight,float[] verts, int vertOffset, int[] colors, int colorOffset, Paint paint)
- 参数分析:
- bitmap: 将要扭曲的图像
- meshWidth: 需要的横向网格数目
- meshHeight,float: 需要的纵向网格数目
- verts: 网格交叉点左边数组
- vertOffset: 数组中开始跳过的(x,y)坐标对的数目
其中最重要的参数是一个数组——verts
6.7 Android图像处理之画笔特效处理
6.7.1 PoterDuffXfermode
6.7.2 Shade
又被称为 着色器、渲染器,用于实现渐变、渲染的效果。
- Android中的Shader包含以下几种:
- BitmapShader: 位图Shader
- LinearShader: 线性Shader
- RadialShader: 光束Shader
- SweepShader: 梯度Shader
- ComposeShader: 混合Shader
6.7.3 PathEffect
就是用各种笔触效果来绘制一个路劲
- ConnerPathEffect: 将拐弯脚变得圆滑
- DiscretePathEffect: 线段上会产生许多杂点
- DashPathEffect: 绘制虚线
- PathDashPathEffect: 绘制虚线,功能更加强大,可以设置点的图形
- ComposePathEffect: 组合PathEffct,组合展示任意两种路径
6.8 View 之孪生兄弟——SurfaceView
6.8.1 SurfaceView 与 View 的区别
View 通过刷新来重绘视图,Android系统通过发出VSYNC信号来进行屏幕的重绘,刷新时间间隔在16ms。如果View的绘制超过16ms,用户就会产生视觉上的卡顿。
- 两者的主要区别:
- View——主动更新,SurfaceView——被动更新,例如频繁的刷新操作
- View在主线程中对画面进行刷新,SurfaceView则是通过一个子线程来进行刷新操作。
- View在绘图时没有使用双缓冲机制,而SurfaceView在其底层的实现中就实现了双缓冲机制。
如果自定义的View需要频繁的刷新或者刷新时处理的数据量较大,那么就可以考虑考虑使用SurfaceView了。
6.8.2 SurfaceView 的使用
- lockCanvas() 可以获得当前的Canvas绘图对象
注意,这里获取到的Canvas对象还是继续上次的Canvas对象,而不是一个新的对象。之前的绘图操作都将被保留。但是可以通过 drawColor() 来进行清屏操作。