学步园

          这里转载一个牛人的博客：http://www.cnblogs.com/tankaixiong/archive/2011/02/24/1964340.html

          下面，是我参照他的博客实现的一个效果图。这个程序，在他的基础上进行了一些改良，但改良得不是很好，嘻嘻，等有空，继续研究。该实例下载路径：http://download.csdn.net/source/3275783

          （一）截图

       （二）实现关键：

          1、改写Gallery，实现图片的层叠和透明度渐变。 主要是改写getChildStaticTransformation方法

          2、对图片进行加工处理，实现透明倒影。

          3、对于超大图片，先进行缩小。防止图片过大，超出屏幕范围报错。

       （三）代码

          1、Activity类代码：GallaryBrowser.java

           package com.myandroid.test;</p> <p>import android.app.Activity;<br /> import android.os.Bundle;<br /> import android.view.View;<br /> import android.widget.ImageSwitcher;<br /> import android.widget.ImageView;<br /> import android.widget.Gallery.LayoutParams;<br /> import android.widget.ViewSwitcher.ViewFactory;</p> <p>public class GallaryBrowser extends Activity {<br /> private Integer[] imageIds = new Integer[] {<br /> R.drawable.a, R.drawable.desert,<br /> R.drawable.hydrangeas, R.drawable.lighthouse,<br /> R.drawable.jellyfish, R.drawable.koala,<br /> R.drawable.lighthouse, R.drawable.penguins,<br /> R.drawable.tulips<br /> };</p> <p> /** Called when the activity is first created. */<br /> @Override<br /> public void onCreate(Bundle savedInstanceState) {<br /> super.onCreate(savedInstanceState);</p> <p> final CoverFlow cf = new CoverFlow(this);<br /> cf.setAdapter(new ImageAdapter(this, imageIds));<br /> cf.setAnimationDuration(1500);<br /> setContentView(cf);</p> <p> }</p> <p>}

          2、图片处理代码，主要是实现旋转和倒影： MyImgView.java

           ///******************************************************************************//<br /> ///**************************请尊重tank的成果毕竟这也是花了笔者很多时间和心思*****//<br /> /************************* 为了让大家容易懂tank特地详细的写了很多的解释*********************************************////<br /> ///**************************欢迎访问我的博客http://www.cnblogs.com/tankaixiong/********************************************//<br /> ///***************************里面文章将持续更新！***************************************************//</p> <p>package com.myandroid.test;</p> <p>import android.graphics.Bitmap;<br /> import android.graphics.Canvas;<br /> import android.graphics.LinearGradient;<br /> import android.graphics.Matrix;<br /> import android.graphics.Paint;<br /> import android.graphics.PixelFormat;<br /> import android.graphics.PorterDuffXfermode;<br /> import android.graphics.Bitmap.Config;<br /> import android.graphics.PorterDuff.Mode;<br /> import android.graphics.Shader.TileMode;<br /> import android.graphics.drawable.Drawable;</p> <p>public class MyImgView {</p> <p> /**<br /> * 添加倒影，原理，先翻转图片，由上到下放大透明度<br /> *<br /> * @param originalImage<br /> * @return<br /> */<br /> public static Bitmap createReflectedImage(Bitmap originalImage) {<br /> // The gap we want between the reflection and the original image<br /> final int reflectionGap = 4;</p> <p> int width = originalImage.getWidth();<br /> int height = originalImage.getHeight();</p> <p> // This will not scale but will flip on the Y axis<br /> Matrix matrix = new Matrix();<br /> matrix.preScale(1, -1);</p> <p> // Create a Bitmap with the flip matrix applied to it.<br /> // We only want the bottom half of the image<br /> Bitmap reflectionImage = Bitmap.createBitmap(originalImage, 0,<br /> height / 2, width, height / 2, matrix, false);</p> <p> // Create a new bitmap with same width but taller to fit reflection<br /> Bitmap bitmapWithReflection = Bitmap.createBitmap(width,<br /> (height + height / 2), Config.ARGB_8888);</p> <p> // Create a new Canvas with the bitmap that's big enough for<br /> // the image plus gap plus reflection<br /> Canvas canvas = new Canvas(bitmapWithReflection);<br /> // Draw in the original image<br /> canvas.drawBitmap(originalImage, 0, 0, null);<br /> // Draw in the gap<br /> Paint defaultPaint = new Paint();<br /> canvas.drawRect(0, height, width, height + reflectionGap, defaultPaint);<br /> // Draw in the reflection<br /> canvas.drawBitmap(reflectionImage, 0, height + reflectionGap, null);</p> <p> // Create a shader that is a linear gradient that covers the reflection<br /> Paint paint = new Paint();<br /> LinearGradient shader = new LinearGradient(0,<br /> originalImage.getHeight(), 0, bitmapWithReflection.getHeight()<br /> + reflectionGap, 0x70ffffff, 0x00ffffff, TileMode.CLAMP);<br /> // Set the paint to use this shader (linear gradient)<br /> paint.setShader(shader);<br /> // Set the Transfer mode to be porter duff and destination in<br /> paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));<br /> // Draw a rectangle using the paint with our linear gradient<br /> canvas.drawRect(0, height, width, bitmapWithReflection.getHeight()<br /> + reflectionGap, paint);</p> <p> return bitmapWithReflection;<br /> }<br /> //drawable 类型转化为bitmap<br /> public static Bitmap drawableToBitmap(Drawable drawable) {</p> <p> Bitmap bitmap = Bitmap<br /> .createBitmap(<br /> drawable.getIntrinsicWidth(),<br /> drawable.getIntrinsicHeight(),<br /> drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888<br /> : Bitmap.Config.RGB_565);<br /> Canvas canvas = new Canvas(bitmap);<br /> // canvas.setBitmap(bitmap);<br /> drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable<br /> .getIntrinsicHeight());<br /> drawable.draw(canvas);<br /> return bitmap;<br /> }</p> <p>}<br />

          3、自定义的Gallery，继承Gallery类,重写getChildStaticTransformation方法，实现图片的重叠和透明度渐变：CoverFlow.java

           ///******************************************************************************//<br /> ///**************************请尊重tank的成果毕竟这也是花了笔者很多时间和心思*****//<br /> /************************* 为了让大家容易懂tank特地详细的写了很多的解释*********************************************////<br /> ///**************************欢迎访问我的博客http://www.cnblogs.com/tankaixiong/********************************************//<br /> ///***************************里面文章将持续更新！***************************************************//<br /> package com.myandroid.test;</p> <p>import android.content.Context;<br /> import android.graphics.Camera;<br /> import android.graphics.Matrix;<br /> import android.util.AttributeSet;<br /> import android.util.Log;<br /> import android.view.View;<br /> import android.view.animation.Transformation;<br /> import android.widget.Gallery;<br /> import android.widget.ImageView;</p> <p>//自己定义的Gallery<br /> public class CoverFlow extends Gallery {</p> <p> private Camera mCamera = new Camera();<br /> private int mMaxRotationAngle = 50;<br /> private int mMaxZoom = -500;<br /> private int mCoveflowCenter;<br /> private boolean mAlphaMode = true;<br /> private boolean mCircleMode = false;</p> <p> public CoverFlow(Context context) {<br /> super(context);<br /> this.setStaticTransformationsEnabled(true);<br /> Log.e("sequence", "CoverFlow2");<br /> }</p> <p> public CoverFlow(Context context, AttributeSet attrs) {<br /> super(context, attrs);<br /> this.setStaticTransformationsEnabled(true);<br /> }</p> <p> public CoverFlow(Context context, AttributeSet attrs, int defStyle) {<br /> super(context, attrs, defStyle);<br /> this.setStaticTransformationsEnabled(true);<br /> }</p> <p> public int getMaxRotationAngle() {<br /> return mMaxRotationAngle;<br /> }</p> <p> public void setMaxRotationAngle(int maxRotationAngle) {<br /> mMaxRotationAngle = maxRotationAngle;<br /> }</p> <p> public boolean getCircleMode() {<br /> return mCircleMode;<br /> }</p> <p> public void setCircleMode(boolean isCircle) {<br /> mCircleMode = isCircle;<br /> }</p> <p> public boolean getAlphaMode() {<br /> return mAlphaMode;<br /> }</p> <p> public void setAlphaMode(boolean isAlpha) {<br /> mAlphaMode = isAlpha;<br /> }</p> <p> public int getMaxZoom() {<br /> return mMaxZoom;<br /> }</p> <p> public void setMaxZoom(int maxZoom) {<br /> mMaxZoom = maxZoom;<br /> }</p> <p> private int getCenterOfCoverflow() {<br /> return (getWidth() - getPaddingLeft() - getPaddingRight()) / 2<br /> + getPaddingLeft();<br /> }</p> <p> private static int getCenterOfView(View view) {<br /> return view.getLeft() + view.getWidth() / 2;<br /> }<br /> //重写Garray方法 ，产生层叠和放大效果<br /> @Override<br /> protected boolean getChildStaticTransformation(View child, Transformation t) {</p> <p> final int childCenter = getCenterOfView(child);<br /> final int childWidth = child.getWidth();<br /> int rotationAngle = 0;<br /> t.clear();<br /> t.setTransformationType(Transformation.TYPE_MATRIX);<br /> if (childCenter == mCoveflowCenter) {<br /> transformImageBitmap((ImageView) child, t, 0, 0);<br /> } else {<br /> rotationAngle = (int) (((float) (mCoveflowCenter - childCenter) / childWidth) * mMaxRotationAngle);<br /> // Log.d("test", "recanglenum:"+Math.floor ((mCoveflowCenter -<br /> // childCenter) / childWidth));<br /> if (Math.abs(rotationAngle) > mMaxRotationAngle) {<br /> rotationAngle = (rotationAngle < 0) ? -mMaxRotationAngle<br /> : mMaxRotationAngle;<br /> }<br /> transformImageBitmap((ImageView) child, t, rotationAngle,<br /> (int) Math.floor((mCoveflowCenter - childCenter)/ (childWidth==0?1:childWidth)));<br /> }<br /> Log.e("sequence", "getChildStaticTransformation");<br /> return true;<br /> }</p> <p> /**<br /> * This is called during layout when the size of this view has changed. If<br /> * you were just added to the view hierarchy, you're called with the old<br /> * values of 0.<br /> *<br /> * @param w<br /> * Current width of this view.<br /> * @param h<br /> * Current height of this view.<br /> * @param oldw<br /> * Old width of this view.<br /> * @param oldh<br /> * Old height of this view.<br /> */<br /> protected void onSizeChanged(int w, int h, int oldw, int oldh) {<br /> mCoveflowCenter = getCenterOfCoverflow();<br /> super.onSizeChanged(w, h, oldw, oldh);<br /> Log.e("sequence", "onSizeChanged");<br /> }</p> <p> /**<br /> * Transform the Image Bitmap by the Angle passed<br /> *<br /> * @param imageView<br /> * ImageView the ImageView whose bitmap we want to rotate<br /> * @param t<br /> * transformation<br /> * @param rotationAngle<br /> * the Angle by which to rotate the Bitmap<br /> */<br /> private void transformImageBitmap(ImageView child, Transformation t,<br /> int rotationAngle, int d) {<br /> mCamera.save();<br /> final Matrix imageMatrix = t.getMatrix();<br /> final int imageHeight = child.getLayoutParams().height;<br /> final int imageWidth = child.getLayoutParams().width;<br /> final int rotation = Math.abs(rotationAngle);<br /> mCamera.translate(0.0f, 0.0f, 100.0f);<br /> // As the angle of the view gets less, zoom in<br /> if (rotation <= mMaxRotationAngle) {<br /> float zoomAmount = (float) (mMaxZoom + (rotation * 1.5));<br /> mCamera.translate(0.0f, 0.0f, zoomAmount);<br /> if (mCircleMode) {<br /> if (rotation < 40)<br /> mCamera.translate(0.0f, 155, 0.0f);<br /> else<br /> mCamera.translate(0.0f, (255 - rotation * 2.5f), 0.0f);<br /> }<br /> if (mAlphaMode) {<br /> ((ImageView) (child)).setAlpha((int) (255 - rotation * 2.5));<br /> }<br /> }<br /> mCamera.rotateY(rotationAngle);<br /> mCamera.getMatrix(imageMatrix);</p> <p> imageMatrix.preTranslate(-(imageWidth / 2), -(imageHeight / 2));<br /> imageMatrix.postTranslate((imageWidth / 2), (imageHeight / 2));<br /> mCamera.restore();<br /> Log.e("sequence", "transformImageBitmap");<br /> }<br /> }<br />

          4、图片适配器：ImageAdapter。这里，我改写了getView方法，把图片按照一定比例进行缩放，防止图片过大，超出屏幕而导致报错。

           package com.myandroid.test;</p> <p>import java.io.InputStream;</p> <p>import android.content.Context;<br /> import android.content.res.Resources;<br /> import android.graphics.Bitmap;<br /> import android.graphics.BitmapFactory;<br /> import android.graphics.Matrix;<br /> import android.graphics.drawable.BitmapDrawable;<br /> import android.view.View;<br /> import android.view.ViewGroup;<br /> import android.widget.BaseAdapter;<br /> import android.widget.Gallery;<br /> import android.widget.ImageView;</p> <p>public class ImageAdapter extends BaseAdapter {<br /> private Context context;<br /> private Integer[] images;</p> <p> public ImageAdapter(Context context, Integer[] imageIds) {<br /> this.context = context;<br /> this.images = imageIds;<br /> }</p> <p> @Override<br /> public int getCount() {<br /> // TODO Auto-generated method stub<br /> return images.length;<br /> }</p> <p> @Override<br /> public Object getItem(int position) {<br /> // TODO Auto-generated method stub<br /> return position;<br /> }</p> <p> @Override<br /> public long getItemId(int position) {<br /> // TODO Auto-generated method stub<br /> return position;<br /> }</p> <p> @Override<br /> public View getView(int position, View convertView, ViewGroup parent) {</p> <p> ImageView imageView = new ImageView(context);<br /> //创建BitMap对象，用于显示图片<br /> Bitmap bitmap = BitmapFactory.decodeResource(context.getResources(),<br /> images[position]);<br /> Matrix matrix = new Matrix(); //矩阵，用于图片比例缩放<br /> matrix.postScale((float)80/bitmap.getWidth(),<br /> (float)60/bitmap.getHeight()); //设置高宽比例（三维矩阵）<br /> //图片不能超出屏幕范围，否则报错，这里进行缩小<br /> Bitmap newBmp = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(),<br /> bitmap.getHeight(), matrix, true);<br /> imageView.setImageBitmap(MyImgView.createReflectedImage(newBmp));<br /> imageView.setLayoutParams(new Gallery.LayoutParams(80, 60));</p> <p> return imageView;<br /> }</p> <p>}<br />