Android Development Series (7) Gallery 3D Effects

Source: Internet
Author: User

I didn't make any updates yesterday because I have been reading Gallery content because I want to make a beautiful image browser. If I use the Gallery class that comes with the system, the effect will be very poor, therefore, according to the summary on the Internet, the Gallery class is inherited to customize the effect, which can achieve beautiful (pseudo) 3D effects. The next section will add ImageSwitcher to further optimize the image browser. In addition, I would like to express my gratitude to the online cool post. First, layout file: copy the Code <? Xml version = "1.0" encoding = "UTF-8"?> <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "match_parent" android: layout_height = "match_parent" android: orientation = "vertical" android: background = "@ android: color/background_dark "> <com. example. android_myowngallery.MyGallery android: id = "@ + id/myGallery" android: layout_width = "match_parent" android: layout_height = "match_parent"/> </LinearLayout> copy the code. Because the View control is inherited, the type of the control should be written as the class name defined by the Control. Otherwise, the ClassCastException occurs and the MyGallery class copy code package com. example. android_myowngallery; import android. content. context; import android. graphics. camera; import android. graphics. matrix; import android. util. attributeSet; import android. view. view; import android. view. animation. transformation; import android. widget. gallery; public class MyGallery extends Gallery {/*** Note that the Gallery class has three constructor functions. During inheritance, all three constructor functions must be inherited, otherwise, an exception occurs * @ param context * @ param attrs * @ param defStyle */public MyGallery (Context context, AttributeSet attrs, int defStyle) {super (context, attrs, defStyle ); // TODO Auto-generated constructor stub} public MyGallery (Context context, AttributeSet attrs) {super (context, attrs ); // TODO Auto-generated constructor stub} public MyGallery (Context context ){ Super (context); // TODO Auto-generated constructor stub}/*** overwrite the getChildStaticTransformation method, this method is used to modify the Gallery effect */@ Override protected boolean getChildStaticTransformation (View child, Transformation t) {// TODO Auto-generated method stub // initialize t. clear (); // setTransformationType (); // obtain the parent control offset of the Child control (ImageView) offset (expressed in proportion, between-1 and 1) float offSet = getOffSet (child); // set the tra Based on the offSet, subcontrol, and conversion information. NformIamgeView (child, t, offSet); // do not forget to call the image transformation method return true ;} /*** determine the degree of the Child control offset from the center of the parent control * // obtain the center of the Child control protected int getCenterOfChild (View view) {return view. getLeft () + view. getWidth ()/2; // getLeft () Here is the abscissa of the left boundary of the Child control, and the half width is the center abscissa} protected int getCenterOfParent () {// Valid Width = width-left and right borders // center abscissa = left border + half of the valid width return getPaddingLeft () + (getWidth ()-getPaddingLeft ()-getPaddingRight ()) /2;} protected float getOf FSet (View view) {float cCenter = getCenterOfChild (view); float pCenter = getCenterOfParent (); float offSet = (cCenter-pCenter)/pCenter; if (offSet <-1) {offSet =-1;} else if (offSet> 1) {offSet = 1;} return offSet ;} /*** this method modifies the display attribute of the Image Based on the given parameters. In fact, different display effects are determined based on the offset of the Child control offset from the parent control center, so that the image switching looks better */protected void tranformIamgeView (View view, Transformation t, float offSet) {// create a Camera object using the translate method of the Camera class Change the camera angle to make the image show different effects./*** android. graphics. camera ** @ Camera. save (); * @ Camera. restore (); the two methods of the Camera class need to appear at the same time */Camera mCamera = new Camera ();/*** get a Matrix object through the Transformation object, this object method is used to set the attributes of the image coordinate transformation * android. graphics. matrix */Matrix matrix = t. getMatrix (); mCamera. save ();/*** when the zcoordinate is positive, it indicates that the "camera" is rising, which means that the image will decrease. In this example, we intend to narrow down the View that deviates from the center of the parent control,, * So z should be positive */mCamera. translate (0, 0, Math. abs (offSet) * 200 );/***** ERROR !! * ** If you want to add an image object to a matrix, this method must be preTranslate. Otherwise, the setting of the conversion center is invalid !! */MCamera. getMatrix (matrix); // The meaning of this method. The following describes the meaning of matrix. preTranslate (-view. getMeasuredWidth ()/2,-view. getMeasuredHeight ()/2); matrix. postTranslate (view. getMeasuredWidth ()/2, view. getMeasuredHeight ()/2); mCamera. restore (); // Save the status of the camera // set the transparency Alpha. Note that the transparency here is the sub-control ImageView. If the transparency is 0 (opacity) // The image will not be displayed. If the transparency is 1, the image will be normally displayed t. setAlpha (1-Math.abs (offSet);} copy the code here matrix. preTranslate (-view. getWidth ()/2,-vi Ew. getHeight ()/2) is to move the View to the top left before the matrix transformation, that is, to change the center point of the matrix transformation from the childView origin (the upper left corner of the image) to the center point matrix of the childView. postTranslate (view. getWidth ()/2, view. getWidth ()/2): After the matrix is transformed, the childView is moved to the bottom right to the original position (that is, the center of the screen). Pay attention to mCamera. the getMatrix () method should be placed before the preTranslate () method! Like ListView, you also need to set the adapter for Gallery to copy the code package com. example. android_myowngallery; import android. content. context; import android. view. view; import android. view. viewGroup; import android. view. viewGroup. layoutParams; import android. widget. baseAdapter; import android. widget. gallery; import android. widget. imageView; public class MyAdapter extends BaseAdapter {private Context context; private int [] picRes; public M YAdapter (Context context, int [] picRes) {super (); this. context = context; this. picRes = picRes;} @ Override public int getCount () {// TODO Auto-generated method stub return picRes. length ;}@ Override public Object getItem (int position) {// TODO Auto-generated method stub return null;} @ Override public long getItemId (int position) {// TODO Auto-generated method stub return position;} @ Overrid E public View getView (int position, View convertView, ViewGroup parent) {// TODO Auto-generated method stub/*** Note: because there is only one control ImageView, therefore, to simplify the code, you can directly create an ImageView object here. * when processing multiple controls in each GalleryItem, you must customize the layout file of each Item like ListView, * generally, the inflate method of LayoutInflater is used to create a convertView, and then the * ID of the sub-control is obtained. convertView is not required because the layout file of the item is not defined! */ImageView I = new ImageView (context); // legacy question: Can I change it to Gallery? I think MyGallery is the best! I. setLayoutParams (new MyGallery. LayoutParams (LayoutParams. MATCH_PARENT, LayoutParams. MATCH_PARENT); // You must create a new object here! And use the internal class I. setImageResource (picRes [position]); return I ;}} copy the code. Note that convertView is not required in this adapter, only when a sub-layout file exists will this view be created using the inflate method and the MainActivity will copy the code package com. example. android_myowngallery; import android. OS. bundle; import android. app. activity; import android. view. menu; import android. widget. gallery; public class MainActivity extends Activity {protected int [] picRes = {R. drawable. ew23, R. drawable. girl0, R. drawable. girl1, R. drawable. girl2, R. drawable. image01, R. drawable. image02, R. drawable. qwe2, R. drawable. w21}; MyGallery g = null; @ Override protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. main); g = (MyGallery) findViewById (R. id. myGallery); MyAdapter adapter = new MyAdapter (this, picRes); g. setAdapter (adapter );}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.