靈活自定義imageview的形狀
- 在自定義View的ondraw方法中實現(xiàn)繪制的內(nèi)容郑趁，各個layer逐個繪制挤安，通過設置PorterDuffXfermode實現(xiàn)不同的圖片疊加效果
//設置背景色
canvas.drawARGB(255, 139, 197, 186);
int canvasWidth = canvas.getWidth();
int canvasHeight = canvas.getHeight();
int layerId = canvas.saveLayer(0, 0, canvasWidth, canvasHeight, null, Canvas.ALL_SAVE_FLAG);
int r = canvasWidth / 2;
//根據(jù)圖片生成bitmapshader
paint.setColor(0xFFFFCC44);
Bitmap bitmap = Bitmap.createBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.xihu));
bitmap = scaleBitmap(bitmap,2*r,2*r);
BitmapShader bitmapShader = new BitmapShader(bitmap,Shader.TileMode.CLAMP,Shader.TileMode.CLAMP);
paint.setShader(bitmapShader);
canvas.drawCircle(r, r, r, paint);
//使用CLEAR作為PorterDuffXfermode繪制藍色的矩形
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));// clear 到背景顏色那一層
canvas.drawCircle(r*3f-50, r, r , paint);
//最后將畫筆去除Xfermode
paint.setXfermode(null);
canvas.restoreToCount(layerId);
- Bitmap生成shader的時候彼城，需要將圖片縮放成view的大小
/**
* 根據(jù)給定的寬和高進行拉伸
* @param origin 原圖
* @param newWidth 新圖的寬
* @param newHeight 新圖的高
* @return new Bitmap
*/
private Bitmap scaleBitmap(Bitmap origin, int newWidth, int newHeight) {
if (origin == null) {
return null;
}
int height = origin.getHeight();
int width = origin.getWidth();
float scaleWidth = ((float) newWidth) / width;
float scaleHeight = ((float) newHeight) / height;
Matrix matrix = new Matrix();
matrix.postScale(scaleWidth, scaleHeight);// 使用后乘
Bitmap newBM = Bitmap.createBitmap(origin, 0, 0, width, height, matrix, false);
if (!origin.isRecycled()) {
origin.recycle();
}
return newBM;
}
- 效果
- 業(yè)務中是通過設計師給出的svgx圖片生成path孽惰，根據(jù)path繪制出想要的圖形贩绕，再用需要展示的bitmap縮放后生成著色器嗤无，再實現(xiàn)渲染；因為svg形狀可以任意对雪，因此更加靈活
Android graphics使用
（1）繪制形狀Canvas
[圖片上傳失敗...(image-3c6580-1573961626362)]
Path可自由實現(xiàn)各種自定義形狀：直線河狐，圓弧，貝塞爾曲線等等
Path path = new Path();
RectF rect = new RectF(300,300,1000,800);
mPaint.setColor(Color.GRAY);
mPaint.setStyle(Style.FILL);
canvas.drawRect(rect, mPaint);
mPaint.setColor(Color.BLACK);
mPaint.setStyle(Style.STROKE);
path.lineTo(100, 100); //用path畫一條從(0,0)到(100,100)的直線
path.arcTo(rect, 90, 180); //用arcTo方法畫一段圓弧
canvas.drawPath(path, mPaint); //直線終點(100,100)與圓弧起點會連成一條直線
（2）繪制效果Paint
Paint
設置顏色
設置筆觸效果/文字大小
設置濾鏡
設置透明度
設置著色器Shader
BimapShader：位圖的圖像渲染器
LinearGradient：線性渲染器
RadialGradient：環(huán)形渲染器瑟捣，一般的水波紋效果馋艺，充電水波紋擴散效果、調(diào)色板都可以使用該渲染器實現(xiàn)迈套。
SweepGradient：梯度渲染器（即掃描渲染）捐祠，可以使用該渲染器實現(xiàn)，如：微信等雷達掃描效果桑李、手機衛(wèi)士垃圾掃描踱蛀。
ComposeShader：組合渲染器
設置layer之間的組合模式PorterDuffXfermode等等
[圖片上傳失敗...(image-f699f4-1573961626362)]
（3）繪制位置坐標
[圖片上傳失敗...(image-f432a2-1573961626362)]
（4）變換處理Matrix
setTranslate(float dx,float dy)：控制Matrix進行位移
setSkew(float kx,float ky)：控制Matrix進行傾斜窿给，kx、ky為X星岗、Y方向上的比例
setSkew(float kx,float ky,float px,float py)：控制Matrix以px填大、py為軸心進行傾斜，kx俏橘、ky為X允华、Y方向上的傾斜比例
setRotate(float degrees)：控制Matrix進行depress角度的旋轉，軸心為（0,0）
setRotate(float degrees,float px,float py)：控制Matrix進行depress角度的旋轉寥掐，軸心為(px,py)
setScale(float sx,float sy)：設置Matrix進行縮放靴寂，sx、sy為X召耘、Y方向上的縮放比例
setScale(float sx,float sy,float px,float py)：設置Matrix以(px,py)為軸心進行縮放百炬，sx、sy為X污它、Y方向上的縮放比例
例：將bitmap放大2倍
Matrix matrix = new Matrix();
matrix.postScale(2, 2);// 使用后乘
Bitmap newBM = Bitmap.createBitmap(origin, 0, 0, width, height, matrix, false);
（5）自定義動畫效果
[圖片上傳失敗...(image-47702a-1573961626362)]
[圖片上傳失敗...(image-b5fd46-1573961626362)]
