最近在研究Android的變形,Android的2D變形(包括縮放,扭曲,平移,旋轉(zhuǎn)等)可以通過(guò)Matrix來(lái)實(shí)現(xiàn),3D變形可以通過(guò)Camera來(lái)實(shí)現(xiàn)。接下來(lái)就將我這倆天研究的東西和大家分享下,先來(lái)看看Matrix的用法。
圖1.1 A為坐標(biāo)矩陣,C為原始矩陣,R是A和C矩陣相乘記過(guò),那么可以知道:(矩陣知識(shí),大學(xué)沒(méi)學(xué)好的傷不起啊)
最后一列很少有資料提到,不過(guò)初始值g=h=0,大家可以去改變值試試,變化為3D效果,但是值沒(méi)看出規(guī)律,那么i為縮放比例,初始值為1。
x' = x + 100;
y' = y - 100;
也即在原始的基礎(chǔ)上右移100,上移100,單位為像素。第三列第三行為2,表示為以前比例的1/2,記住這塊容易弄錯(cuò)。
下面給出具體坐標(biāo)對(duì)應(yīng)變形的屬性
|scaleX, skewX, translateX|
|skewY, scaleY, translateY|
|0 ,0 , scale |
實(shí)踐
通過(guò)代碼來(lái)看看具體的用法
public class MatrixTransformView extends View {
private Matrix mMatrix;
private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
private Bitmap mBitmap;
public MatrixTransformView(Context context) {
super(context);
}
public MatrixTransformView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public void setDrawable(int resId) {
mBitmap = BitmapFactory.decodeResource(getContext().getResources(), resId);
}
/*
* 設(shè)置矩陣,并重繪
*/
public void setMatrixValues(float[] array) {
if (mMatrix == null) {
mMatrix = new Matrix();
}
mMatrix.reset();
mMatrix.setValues(array);
invalidate();
}
public void resetMatrix() {
if (mMatrix != null) {
mMatrix.reset();
}
invalidate();
}
@Override
protected void onDraw(Canvas canvas) {
if (mMatrix != null) {
Paint paint = mPaint;
canvas.drawBitmap(mBitmap, mMatrix, paint);
}
super.onDraw(canvas);
}
}
通過(guò)Matrix的setValues方法,將3*3的矩陣坐標(biāo)值進(jìn)行設(shè)置即可。強(qiáng)調(diào)的一點(diǎn)是,在調(diào)用setMatrixValues的時(shí)候需要調(diào)用invalidate方法,讓View進(jìn)行調(diào)用onDraw進(jìn)行重繪。
矩陣的基本用法就是這些,往往在開(kāi)發(fā)過(guò)程中,不直接通過(guò)矩陣坐標(biāo)去實(shí)現(xiàn)變形,因?yàn)槿绻獙?shí)現(xiàn)選擇,那么就比較復(fù)雜了,涉及到三角函數(shù),對(duì)于數(shù)據(jù)早已經(jīng)忘差不多的人,很是痛苦,當(dāng)然如果非要用的話,算起來(lái)也不難。
那么為了避免直接使用矩陣坐標(biāo)來(lái)操作變形,Matrix類提供方法來(lái)進(jìn)行變:
set方式:setScale, setSkew, setTranslate, setRotate
post方式:postScale, postSkew, postTranslate, postRotate
pre方式:preScale, preSkew, preTranslate, preRotate
set方式為直接設(shè)置,每一次調(diào)用set方法都會(huì)先重置矩陣。post可以理解成設(shè)置多次有效,效果是累加的。pre這里暫且理解成和post方式完全一樣,后面3D的時(shí)候再糾結(jié)。
看代碼:
public class MatrixTransformView extends View {
private Matrix mMatrix;
private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
private Bitmap mBitmap;
public MatrixTransformView(Context context) {
super(context);
}
public MatrixTransformView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public void setDrawable(int resId) {
mBitmap = BitmapFactory.decodeResource(getContext().getResources(), resId);
}
/*
* 設(shè)置矩陣,并重繪
*/
public void setMatrixValues(float[] array) {
if (mMatrix == null) {
mMatrix = new Matrix();
}
mMatrix.reset();
mMatrix.setValues(array);
invalidate();
}
public void postMatrixScale(float scaleX, float scaleY, float centerX, float centerY) {
if (mMatrix == null) {
mMatrix = new Matrix();
}
mMatrix.preScale(scaleX, scaleY, centerX, centerY);
invalidate();
}
public void postMatrixSkew(float skewX, float skewY, float centerX, float centerY) {
if (mMatrix == null) {
mMatrix = new Matrix();
}
mMatrix.postSkew(skewX, skewY, centerX, centerY);
invalidate();
}
public void postMatrixTranslate(float translateX, float translateY) {
if (mMatrix == null) {
mMatrix = new Matrix();
}
mMatrix.postTranslate(translateX, translateY);
invalidate();
}
public void postMatrixRotate(float degree, float centerX, float centerY) {
if (mMatrix == null) {
mMatrix = new Matrix();
}
mMatrix.postRotate(degree, centerX, centerY);
invalidate();
}
public void resetMatrix() {
if (mMatrix != null) {
mMatrix.reset();
}
invalidate();
}
@Override
protected void onDraw(Canvas canvas) {
if (mMatrix != null) {
Paint paint = mPaint;
canvas.drawBitmap(mBitmap, mMatrix, paint);
}
super.onDraw(canvas);
}
}
Matrix的基本用法就這么多。擴(kuò)展
變形是需要canvas來(lái)進(jìn)行繪制的,canvas的繪制需要bitmap,所以這塊利用一個(gè)繼承自View的控件,通過(guò)setDrawable方式設(shè)置bitmap,那么選擇目標(biāo)必須是個(gè)bitmap,在文章的demo中,通過(guò)參數(shù)為int型resource的setDrawable方法進(jìn)行bitmap獲取,如果想對(duì)別的控件進(jìn)行變形,例如ViewGroup,可以通過(guò)如下方式:
Matrix m = new Matrix();
m.setValues(new float[] {
1, 0, 0,
0, 1, 0,
0, 0, 1
});
Bitmap bp = Bitmap.createBitmap(viewGroup.getWidth(), viewGroup.getHeight(), Bitmap.Config.RGB_565);
Canvas can = new Canvas(bp);
viewGroup.draw(can);
bp = Bitmap.createBitmap(bp, 0, 0, bp.getWidth(), bp.getHeight(), m, true);
img.setImageBitmap(bp);
通過(guò)將ViewGroup轉(zhuǎn)換成Bitmap,然后自定義一個(gè)Image來(lái)變形,隱藏ViewGroup來(lái)達(dá)到效果。疑問(wèn)
1.如果誰(shuí)知道post,pre的區(qū)別,請(qǐng)告訴我下,看看我的理解是否正確。
2.能否實(shí)現(xiàn)ViewGroup直接變形,而非我上面講的那種。