Advanced seven Android UI interface (slide reflection effect)

Only if you learn to put your own achievements are zero, can make room to accept more new things, so that they can constantly surpass themselves.

The content of this lecture: interface sliding reflection effect

First, Reflection principle:

The reflection effect is mainly composed of the original + Space + reflection three parts, the height is about 3/2 of the original (1, the reflection is 1/2)

The original picture, that's what we saw at the beginning.

Spacing, is the gap between the original image and the reflection, such as: Reflectiongap = 4;

Reflection, is the lower part of the original 1/2 height, through the Matrix transformation Matrix.prescale (1,-1); Get an inverted picture, followed by a linear matte and shadow implementation

Example one:

Here is the Res/layout/activity_main.xml layout file:

<?xml version= "1.0" encoding= "Utf-8"? ><relativelayout xmlns:android= "http://schemas.android.com/apk/res/ Android "    android:layout_width=" fill_parent "    android:layout_height=" fill_parent "    android:o rientation= "vertical" >    <textview        android:id= "@+id/tvtitle" android:layout_width= "Wrap_        Content "        android:layout_height=" wrap_content "        android:layout_centerhorizontal=" true "        Android: Textsize= "16sp"/>        <com.example.imagereflect.mygallery        android:id= "@+id/mygallery"        android: Layout_width= "Fill_parent"        android:layout_height= "wrap_content"        android:layout_below= "@id/tvtitle"        android:layout_margintop= "10dip"/></relativelayout>

Com.example.imagereflect  is the package name

here is the Mygallery.java file:

public class Mygallery extends Gallery {private Camera Mcamera = new Camera ();p rivate int mmaxrotationangle = 60;//max rotation angle 60private int mmaxzoom = -120;private int Mcoveflowcenter;public mygallery (context context) {super (context); This.setstatictransformationsenabled (TRUE);} Public Mygallery (context context, AttributeSet Attrs) {Super (context, attrs); This.setstatictransformationsenabled ( true);} Public Mygallery (context context, AttributeSet attrs, int defstyle) {Super (context, attrs, Defstyle); This.setstatictransformationsenabled (TRUE);} public int Getmaxrotationangle () {return mmaxrotationangle;} public void Setmaxrotationangle (int maxrotationangle) {mmaxrotationangle = Maxrotationangle;} public int Getmaxzoom () {return mmaxzoom;} public void setmaxzoom (int maxzoom) {mmaxzoom = Maxzoom;} /** gets Gallery's center x */private int Getcenterofcoverflow () {return (GetWidth ()-Getpaddingleft ()-getpaddingright ())/2 + G Etpaddingleft ();} /** Gets the center x */private static int getcenterofview (view view) of the view {RetuRN View.getleft () + view.getwidth ()/2;} @Overrideprotected void onsizechanged (int w, int h, int oldw, int oldh) {mcoveflowcenter = Getcenterofcoverflow (); Super.on SizeChanged (W, H, OLDW, OLDH);} @Overrideprotected Boolean getchildstatictransformation (View Child, transformation trans) {Final int childcenter = Getcenterofview (child); final int childwidth = Child.getwidth (); int rotationangle = 0;trans.clear (); Trans.settransformationtype (Transformation.type_both);//both Alpha and matrix are transformed if (Childcenter = = Mcoveflowcenter) {// Childviewtransformimagebitmap in the Middle ((ImageView) child, trans, 0);} else {//childviewrotationangle = (int) on both sides ((float) (mcoveflowcenter-childcenter)/childwidth) * Mmaxrotationangle ); if (Math.Abs (rotationangle) > Mmaxrotationangle) {rotationangle = (RotationAngle < 0)?-mmaxrotationangle:mmaxr Otationangle;} Transformimagebitmap ((ImageView) Child, trans, RotationAngle);} return true;} private void Transformimagebitmap (ImageView child, Transformation trans, int rOtationangle) {mcamera.save (); final Matrix Imagematrix = Trans.getmatrix (); final int imageheight = Child.getlayoutparams (). height;final int imagewidth = Child.getlayoutparams (). width;final int rotation = Math.abs ( RotationAngle);//on the z axis, the actual effect is to enlarge the camera's angle of view. If you move on the y-axis, the picture moves up and down; The corresponding picture on the x-axis moves left and right. Mcamera.translate (0.0f, 0.0f, 100.0f);//As the angle of the view gets less, zoom inif (Rotation < Mmaxrotationangle) { float Zoomamount = (float) (Mmaxzoom + (rotation * 1.5)); Mcamera.translate (0.0f, 0.0f, Zoomamount);} Mcamera.rotatey (RotationAngle);//RotationAngle is positive, rotates in the y-axis inward, negative, and rotates outward along the y-axis Mcamera.getmatrix (Imagematrix); Imagematrix.pretranslate (-(IMAGEWIDTH/2),-(IMAGEHEIGHT/2)); Imagematrix.posttranslate ((IMAGEWIDTH/2), ( IMAGEHEIGHT/2)); Mcamera.restore ();}}

here is the Imageadapter.java file:

public class Imageadapter extends Baseadapter {private imageview[] mimages;//save an array of reflection images private Context mcontext;public Li St<map<string, object>> list;public integer[] IMGs = {r.drawable.img01, r.drawable.img02, R.drawable.img03 , R.drawable.img04, r.drawable.img05, r.drawable.img06, r.drawable.img07};p ublic string[] titles = {"Country monsoon", "Live to 99", "Kin Kang supermarket "," weekly drama "," Hot Line Village Pass "," Happy Life "," Fan Time "};p ublic Imageadapter (Context c) {this.mcontext = C;list = new arraylist<map< String, Object>> (), for (int i = 0; i < imgs.length; i++) {hashmap<string, object> map = new Hashmap<stri Ng, Object> (); Map.put ("image", imgs[i]); List.add (map);} Mimages = new Imageview[list.size ()];} /** Reflection Reflection */public Boolean Createreflectedimages () {final int reflectiongap = 4;int index = 0;for (map<string, Object&gt ; map:list) {Integer id = (integer) map.get ("image"); Bitmap originalimage = Bitmapfactory.decoderesource (Mcontext.getresources (), id);//get original picture int width = Originalimage.getwiDTH (); int height = originalimage.getheight (); Matrix matrix = new Matrix (); Matrix.prescale (1,-1);//Picture Matrix transform (reflection from low to top) Bitmap Reflectionimage = Bitmap.createbitmap ( Originalimage, 0, HEIGHT/2, width, HEIGHT/2, matrix, false);//intercept the lower part of the original image Bitmap Bitmapwithreflection = Bitmap.createbitmap (width, (height + height/2), config.argb_8888);//Create a reflection image (height of the original 3/2) Canvas canvas = new canvas (bitmapwithreflection);//Draw Reflection Image (Original + pitch + reflection) Canvas.drawbitmap (originalimage, 0, 0, NULL);//Draw Original Paint paint = new paint (); canvas.drawrect (0, height, width, height + reflectiongap, paint);//Draw the original image with the reflection of the spacing Canvas.drawbitmap (reflectionimage, 0, height + reflectiongap, null); /Draw Reflection Map paint = new paint (); LinearGradient shader = new LinearGradient (0, Originalimage.getheight (), 0, bitmapwithreflection.getheight () + Reflectiongap, 0x70ffffff, 0X00FFFFFF, Tilemode.clamp);p Aint.setshader (shader);//Linear Gradient effect Paint.setxfermode (new Porterduffxfermode (mode.dst_in));//Reflection Mask effect canvas.drawrect (0, height, width, bitmapwithreflection.getheight() + reflectiongap, paint);//shadow Effect of drawing reflection imageView ImageView = new ImageView (mcontext); Imageview.setimagebitmap ( bitmapwithreflection);//Set Reflection Picture Imageview.setlayoutparams (New Mygallery.layoutparams (180, 240)); Imageview.setscaletype (Scaletype.matrix); mimages[index++] = ImageView;} return true;} @Overridepublic int GetCount () {return imgs.length;} @Overridepublic Object getItem (int position) {return mimages[position];} @Overridepublic long Getitemid (int position) {return position;} @Overridepublic view GetView (int position, view Convertview, ViewGroup parent) {return mimages[position];// Show reflection picture (current get focus)}public float Getscale (boolean focused, int offset) {return Math.max (0, 1.0f/(float) Math.pow (2, Math.Abs ( offset)));}}

here is the Mainactivity.java main interface file:

public class Mainactivity extends Activity {private TextView tvtitle; private mygallery gallery; private Imageadapter ADAP ter; @Overridepublic void onCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview ( R.layout.activity_main); Initres ();} private void Initres () {tvtitle = (TextView) Findviewbyid (r.id.tvtitle); gallery = (mygallery) Findviewbyid ( R.id.mygallery); adapter = new Imageadapter (this); Adapter.createreflectedimages ();//Create Reflection Effect Gallery.setadapter (adapter); Gallery.setonitemselectedlistener (new Onitemselectedlistener () {//Set Select Event listener @overridepublic void onitemselected (adapterview<?> parent, view view, int Position, long ID) {Tvtitle.settext (adapter.titles[position]);} @Overridepublic void onnothingselected (adapterview<?> parent) {}}); Gallery.setonitemclicklistener (new Onitemclicklistener () {//Set click event Listener @overridepublic void Onitemclick (adapterview<?> parent, view view, int position , long id) {Toast.maketext (Mainactivity.this, "img" + (position+1) + "selected", Toast.length_short). Show ();}});}} 

Take your time and enjoy it

Advanced seven Android UI interface (slide reflection effect)