Android開發教程：倒影效果的ImagView

效果圖如下：

1. package lab.sodino.reflection;
3. import Android.content.Context;
4. import android.graphics.Bitmap;
5. import android.graphics.Bitmap.Config;
6. import android.graphics.BitmapFactory;
7. import android.graphics.Canvas;
8. import android.graphics.LinearGradient;
9. import android.graphics.Matrix;
10. import android.graphics.Paint;
11. import android.graphics.PorterDuff.Mode;
12. import android.graphics.PorterDuffXfermode;
13. import android.graphics.Shader.TileMode;
14. import android.graphics.drawable.BitmapDrawable;
15. import android.util.AttributeSet;
16. import android.widget.ImageView;
18. public class ReflectionImage extends ImageView {
19. // 是否為Reflection模式
20. private boolean mReflectionMode = true;
22. public ReflectionImage(Context context) {
23. super(context);
24. }
26. public ReflectionImage(Context context, AttributeSet attrs) {
27. super(context, attrs);
28. measure(0, 0);
29. // 取得原始圖片的bitmap並重畫
30. Bitmap originalImage = ((BitmapDrawable) this.getDrawable()).getBitmap();
31. DoReflection(originalImage);
32. }
34. public ReflectionImage(Context context, AttributeSet attrs, int defStyle) {
35. super(context, attrs, defStyle);
36. Bitmap originalImage = ((BitmapDrawable) this.getDrawable()).getBitmap();
37. DoReflection(originalImage);
38. }
40. public void setReflectionMode(boolean isRef) {
41. mReflectionMode = isRef;
42. }
44. public boolean getReflectionMode() {
45. return mReflectionMode;
46. }
48. // 偷懶了,只重寫了setImageResource,和構造函數裡面干了同樣的事情
49. @Override
50. public void setImageResource(int resId) {
51. Bitmap originalImage = BitmapFactory.decodeResource(getResources(), resId);
52. DoReflection(originalImage);
53. // super.setImageResource(resId);
54. }
56. private void DoReflection(Bitmap originalImage) {
57. // 原始圖片和反射圖片中間的間距
58. final int reflectionGap = 4;
59. int width = originalImage.getWidth();
60. int height = originalImage.getHeight();
61. // 反轉
62. Matrix matrix = new Matrix();
63. // 第一個參數為1表示x方向上以原比例為准保持不變，正數表示方向不變。
64. // 第二個參數為-1表示y方向上以原比例為准保持不變，負數表示方向取反。
65. matrix.preScale(1, -0.75f);
66. // reflectionImage就是下面透明的那部分,可以設置它的高度為原始的3/4,這樣效果會更好些
67. Bitmap reflectionImage = Bitmap.createBitmap(originalImage, 0, 0, width, height * 3 / 4, matrix, false);
68. // 創建一個新的bitmap,高度為原來的兩倍
69. Bitmap bitmap4Reflection = Bitmap.createBitmap(width, (height + height * 3 / 4), Config.ARGB_8888);
70. // 其寬*高 = width * (height + height * 3 / 4)
71. Canvas canvasRef = new Canvas(bitmap4Reflection);
72. // 先畫原始的圖片
73. canvasRef.drawBitmap(originalImage, 0, 0, null);
74. // 畫間距
75. Paint deafaultPaint = new Paint();
76. // defaultPaint不能為null，否則會有空指針異常。
77. canvasRef.drawRect(0, height, width, height + reflectionGap, deafaultPaint);
78. // 畫被反轉以後的圖片
79. canvasRef.drawBitmap(reflectionImage, 0, height + reflectionGap, null);
80. // 創建一個漸變的蒙版放在下面被反轉的圖片上面
81. Paint paint = new Paint();
82. LinearGradient shader = new LinearGradient(200, originalImage.getHeight(), 10, bitmap4Reflection.getHeight()
83. + reflectionGap, 0x80ffffff, 0x00ffffff, TileMode.CLAMP);
84. paint.setShader(shader);
85. // Set the Transfer mode to be porter duff and destination in
86. paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
87. // 將蒙板畫上
88. canvasRef.drawRect(0, height, width, bitmap4Reflection.getHeight() + reflectionGap, paint);
89. // 調用ImageView中的setImageBitmap
90. this.setImageBitmap(bitmap4Reflection);
91. }
92. }