Android自定义Gallery，实现CoverFlow效果

在Android实现显示文字的Gallery和Android修改Gallery页面布局的基础上，利用Gallery实现了CoverFlow效果，如下：

项目代码结构如下：

layout_gallery.xml是Gallery的布局文件：

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:orientation="vertical"  
4.     android:layout_width="fill_parent"  
5.     android:layout_height="fill_parent"  
6.     android:background="#ffffff"  
7.     >  
8. <com.gallery.GalleryFlow  
9.     android:id="@+id/Gallery01"  
10.     android:layout_width="fill_parent"  
11.     android:layout_height="wrap_content" android:layout_centerInParent="true"  
12.     android:spacing="-60px"/>  
13. </RelativeLayout>  
14.   
15. ndroid:spacing="-60px" 图片之间的间距。  

ActivityMain主要代码如下：

[java] view plaincopy

1. public void onCreate(Bundle savedInstanceState) {  
2.       super.onCreate(savedInstanceState);  
3.        
4.        
5.       setContentView(R.layout.layout_gallery);  
6.       //将图片做成倒影效果  
7.       Integer[] images = { R.drawable.hawana_0,  
8.               R.drawable.huanyinghei_6, R.drawable.wulonghui_24, R.drawable.wulonghui_28,  
9.               R.drawable.xuanfenghei_10};  
10.        
11.       ImageAdapter adapter = new ImageAdapter(this, images);  
12.       adapter.createReflectedImages();  
13.   
14.       GalleryFlow galleryFlow = (GalleryFlow) findViewById(R.id.Gallery01);  
15.       galleryFlow.setAdapter(adapter);  

其中：

[java] view plaincopy

1. ImageAdapter adapter = new ImageAdapter(this, images);  
2.         adapter.createReflectedImages();  

实现了图片的倒影效果，参见：Android实现图片的倒影效果。

GalleryFlow实现了图片的3D旋转效果：

下边的方法是根据传入的角度，做图片的旋转：

[java] view plaincopy

1. private void transformImageBitmap(ImageView child, Transformation t,  
2.             int rotationAngle) {  
3.         mCamera.save();  
4.         final Matrix imageMatrix = t.getMatrix();  
5.         final int imageHeight = child.getLayoutParams().height;  
6.         final int imageWidth = child.getLayoutParams().width;  
7.         final int rotation = Math.abs(rotationAngle);  
8.   
9.         // 在Z轴上正向移动camera的视角，实际效果为放大图片。  
10.         // 如果在Y轴上移动，则图片上下移动；X轴上对应图片左右移动。  
11.         mCamera.translate(0.0f, 0.0f, 100.0f);  
12.   
13. //        // As the angle of the view gets less, zoom in  
14. //        if (rotation < mMaxRotationAngle) {  
15. //            float zoomAmount = (float) (mMaxZoom + (rotation * 1.5));  
16. //            //mCamera.translate(0.0f, 0.0f, zoomAmount);  
17. //        }  
18.   
19.         // 在Y轴上旋转，对应图片竖向向里翻转。  
20.         // 如果在X轴上旋转，则对应图片横向向里翻转。  
21.         mCamera.rotateY(rotationAngle);  
22.         mCamera.getMatrix(imageMatrix);  
23.         imageMatrix.preTranslate(-(imageWidth / 2), -(imageHeight / 2));  
24.         imageMatrix.postTranslate((imageWidth / 2), (imageHeight / 2));  
25.         mCamera.restore();  

实现根据图片的不同位置，确定旋转角度：

[java] view plaincopy

1. protected boolean getChildStaticTransformation(View child, Transformation t) {  
2.   
3.     final int childCenter = getCenterOfView(child);  
4.     final int childWidth = child.getWidth();  
5.     int rotationAngle = 0;  
6.   
7.     t.clear();  
8.     t.setTransformationType(Transformation.TYPE_MATRIX);  
9.     Log.v("tag", "getChildStaticTransformation>>>>>>>>>>>>>>>>>>>childCenter"+childCenter+">>>>>"+Math.abs((mCoveflowCenter-childCenter)/(childWidth)));  
10.     if (childCenter == mCoveflowCenter) {  
11.         transformImageBitmap((ImageView) child, t, 0);  
12.     } else {  
13.         if ((mCoveflowCenter – childCenter) > 0) {  
14.             rotationAngle = (int) mMaxRotationAngle;  
15.         } else {  
16.             rotationAngle = (int) -mMaxRotationAngle;  
17.         }  
18.         if(Math.abs((mCoveflowCenter-childCenter)/(childWidth/2))==0){  
19.              rotationAngle = (int) (((float) (mCoveflowCenter – childCenter) /  
20.              childWidth) * mMaxRotationAngle);  
21.         }  
22.      
23.         transformImageBitmap((ImageView) child, t, rotationAngle);  
24.     }  
25.   
26.     return true;  
27. }  

整体效果还不是很好，并不是真正的CoverFlow，需要进一步改进。

源码见：http://bigcateasymorse.googlecode.com/svn/trunk/android-coverflow/