Android Viewpager specific explanations

Source: Internet
Author: User

Viewpager in the Android interface layout is often used type, it can do navigation, page menu, access to the software is welcome interface and so on. For example, the most popular mobile phone software, QQ, Weibo, etc., its main interface has been used to Viewpager, so learn it, potential in the will, summed up here,

First Use the diagram:

This is an imitation microblogging interface of the XML layout, their relationship is often confused, afraid to remember, summed up a few words: Viewpager inside contains interface, its change control (title) ImageView changes, TextView control page, and indirectly control the title (ImageView).

And to do a complete Denon, the process is as follows:

1, the XML file defines the Viewpager, and various controls.

2, in the code to get a variety of controls, and the corresponding shallow processing.

3, set the adapter for Viewpager, and the listener, and the other controls also set the corresponding listener.

Record a small demo:

Package Com.example.viewpagerdemo;import Java.util.arraylist;import Java.util.list;import android.app.Activity; Import Android.graphics.bitmapfactory;import Android.graphics.matrix;import Android.os.bundle;import Android.support.v4.view.pageradapter;import Android.support.v4.view.viewpager;import Android.support.v4.view.viewpager.onpagechangelistener;import Android.util.displaymetrics;import Android.view.layoutinflater;import Android.view.view;import Android.view.view.onclicklistener;import Android.view.animation.animation;import Android.view.animation.translateanimation;import Android.view.ViewGroup; Import Android.widget.imageview;import Android.widget.textview;import Android.widget.toast;public class Weiboactivity extends Activity {private Viewpager viewpager;//page card contents private ImageView imageview;//action plot private TextView Textview1,textview2,textview3;private list<view> views;//tab page List private int offset = 0;//move plot offset private int Currindex = 0;//Current page card number private int bmpw;//motion plot width private View view1,view2,view3;//each page card @overrideprotected void OnCreate (Bundle savedinstancestate) {super.oncreate ( Savedinstancestate); Setcontentview (R.layout.weibo); Initimageview (); Inittextview (); Initviewpager ();} private void Initviewpager () {viewpager= (Viewpager) Findviewbyid (R.id.vpager); views=new arraylist<view> (); Layoutinflater Inflater=getlayoutinflater (); View1=inflater.inflate (r.layout.lay1, null); View2=inflater.inflate ( R.layout.lay2, NULL); View3=inflater.inflate (r.layout.lay3, null); Views.add (View1); Views.add (VIEW2); Views.add ( VIEW3); Viewpager.setadapter (new Myviewpageradapter (views)); Viewpager.setcurrentitem (0); Viewpager.setonpagechangelistener (New Myonpagechangelistener ());} /** * init header */private void Inittextview () {textView1 = (TextView) Findviewbyid (R.ID.TEXT1); textView2 = (TextView) findv Iewbyid (r.id.text2); textView3 = (TextView) Findviewbyid (R.ID.TEXT3); Textview1.setonclicklistener (new Myonclicklistener (0)); Textview2.setonclicklistener (new Myonclicklistener (1)); textView3. Setonclicklistener (New Myonclicklistener (2));} /** 2 * Initialize animation, this is the page card sliding, the following horizontal line also sliding effect, here need to calculate some data 3 */private void Initimageview () {imageview= (ImageView) Findviewbyid (r.id.cursor); BMPW = Bitmapfactory.decoderesource (Getresources (), R.drawable.a). GetWidth ();//Get Picture width displaymetrics DM = new Displaymetrics (); Getwindowmanager (). Getdefaultdisplay (). Getmetrics (DM); int screenw = dm.widthpixels;// Get resolution width offset = (SCREENW/3-BMPW)/2;//compute offset Matrix matrix = new Matrix () matrix.posttranslate (offset, 0); imageview.se Timagematrix (matrix);//Set animation initial position}/** * * head punctuation Tap monitoring 3 */private class Myonclicklistener implements onclicklistener{private int index=0;        Public Myonclicklistener (int i) {index=i; }public void OnClick (View v) {viewpager.setcurrentitem (index);}} public class Myviewpageradapter extends Pageradapter{private list<view> mlistviews;public myviewpageradapter ( List<vIew> mlistviews) {this.mlistviews = mlistviews;} @Overridepublic void Destroyitem (ViewGroup container, int position, object object) {Container.removeview ( Mlistviews.get (position));} @Overridepublic Object Instantiateitem (viewgroup container, int position) {Container.addview (Mlistviews.get (position ), 0); return Mlistviews.get (position);} @Overridepublic int GetCount () {return mlistviews.size ();}    @Overridepublic boolean isviewfromobject (View arg0, Object arg1) {return arg0==arg1;}} public class Myonpagechangelistener implements onpagechangelistener{int one = offset * 2 + bmpw;//page Card 1-page Card 2 offset in T-one * 2;//page Card 1-page Card 3 offset public void onpagescrollstatechanged (int arg0) {}public void onpagescrolled (int arg0, float arg1, int arg2) {}public void onpageselected (int arg0) {/* Two methods, this is one, the following another, obviously this is more troublesome animation animation = NULL;SWITC H (arg0) {case 0:if (currindex = = 1) {animation = new Translateanimation (one, 0, 0, 0);} else if (Currindex = = 2) {Animati On = new TranslateanimatIon (0, 0, 0);} Break;case 1:if (Currindex = = 0) {animation = new Translateanimation (offset, one, 0, 0);} else if (Currindex = = 2) {Animat Ion = new Translateanimation (both, one, 0, 0);} Break;case 2:if (Currindex = = 0) {animation = new Translateanimation (offset, 0, 0);} else if (Currindex = = 1) {Animat Ion = new Translateanimation (one, 0, 0);} break;} */animation Animation = new Translateanimation (one*currindex, one*arg0, 0, 0);//Obviously this is more concise and has just one line of code. Currindex = Arg0;animation.setfillafter (TRUE);//true: The picture stops at the end of the animation animation.setduration (300); Imageview.startanimation (animation);        Toast.maketext (Weiboactivity.this, "You have selected" + viewpager.getcurrentitem () + "page card", Toast.length_short). Show (); }}
It's layout file:


 <?xml version= "1.0" encoding= "Utf-8"? ><linearlayout xmlns:android= "http://schemas.android.com/apk/res/ Android "Android:layout_width=" Fill_parent "android:layout_height=" fill_parent "android:orientation=" vertical "&G    T <linearlayout android:id= "@+id/linearlayout1" android:layout_width= "Fill_parent" android:layout_he            ight= "40.0dip" android:background= "#FFFFFF" > <textview android:id= "@+id/text1"            Android:layout_width= "Fill_parent" android:layout_height= "fill_parent" android:layout_weight= "1.0" android:gravity= "Center" android:text= "@ Me" android:textcolor= "#000000" Android : textsize= "20.0dip"/> <textview android:id= "@+id/text2" android:layout_width= "Fill_par Ent "android:layout_height=" fill_parent "android:layout_weight=" 1.0 "android:gravity=" cen Ter "Android:text= "comment" android:textcolor= "#000000" android:textsize= "20.0dip"/> <textview an            Droid:id= "@+id/text3" android:layout_width= "fill_parent" android:layout_height= "Fill_parent" Android:layout_weight= "1.0" android:gravity= "center" android:text= "private Messages" Android:textco Lor= "#000000" android:textsize= "20.0dip"/> </LinearLayout> <imageview android:id= "@+i D/cursor "android:layout_width=" fill_parent "android:layout_height=" Wrap_content "android:scaletype="        Matrix "android:src=" @drawable/A "/> <android.support.v4.view.viewpager android:id=" @+id/vpager "        Android:layout_width= "Wrap_content" android:layout_height= "0DP" android:layout_gravity= "center" Android:layout_weight= "1.0" android:background= "#000000" android:flipinterval= "Android:persistent" Drawingcache= "Animation" /></linearlayout> 
effects such as the following:



Android Viewpager specific explanations

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.