The realization method of Viewpager photo album's transverse movement in Android _android

Source: Internet
Author: User
Tags object object

When we first download QQ and open, there will be a novice guide, the Guide is a few pictures, plus some text description, slide to the right, until the end, today morning to study the implementation of this effect of the Viewpager control.

The following example will use Viewpager to move the photo album horizontally, Viewpager has a corresponding pageradapter for binding the data, we need to inherit this class and implement our own functions.

1, first define a display items need to use the data object Imageitem

Copy Code code as follows:

public class Imageitem {
private int id;//Resource ID
Private String name;//the name displayed
Public String GetName () {
return name;
}
public void SetName (String name) {
THIS.name = name;
}
public Imageitem (int ID, String name) {
Super ();
This.id = ID;
THIS.name = name;
}
public int getId () {
return ID;
}
public void setId (int id) {
This.id = ID;
}
}

2, Viewpager each side for an item, so in the layout directory to define a Viewpager each page of the item, named Pageritem.xml

Copy Code code as follows:

<framelayout xmlns:android= "Http://schemas.android.com/apk/res/android"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent" >

<imageview
Android:id= "@+id/imgview"
Android:layout_width= "Fill_parent"
android:layout_height= "Fill_parent"
android:contentdescription= "@string/app_name"
Android:scaletype= "Fitxy"/>

<textview
Android:id= "@+id/textview"
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
android:layout_gravity= "Bottom|center_horizontal"/>

</FrameLayout>

3, a new Java file, corresponding to the Viewpager of each item

Copy Code code as follows:

public class Viewpageritem extends Framelayout {
Private ImageView imageview;//Display picture ImageView
Private TextView TextView;
Private Bitmap bitmap;//picture corresponding to the Bitmap
Private Imageitem imageitem;//Every Picture item object

Public Viewpageritem {
Super (context);
Setviews ();
}
Public Viewpageritem (context context, AttributeSet Attrs) {
Super (context, attrs);
Setviews ();
}

public void SetData (Imageitem item) {//Fill data with Imageitem
This.imageitem = Item;
int resid = Item.getid ();
String name = Item.getname ();
Imageview.setimageresource (RESID);
Textview.settext (name);
}

public void Reload () {//Reload data
int resid = Imageitem.getid ();
Imageview.setimageresource (RESID);
}

public void Recycle () {//Recycle data
Imageview.setimagebitmap (NULL);
if (This.bitmap = null | | this.bitmap.isRecycled ()) {
Return
}
This.bitmap.recycle ();
This.bitmap = null;
}

public void Setviews () {
Layoutinflater infalter = Layoutinflater.from (GetContext ());
View view = Infalter.inflate (R.layout.pageritem, NULL);
TextView = (TextView) View.findviewbyid (R.id.textview);
ImageView = (ImageView) View.findviewbyid (R.id.imgview);

AddView (view);
}
}

4, a new data filler pageritemadapter, inherited from Pageradapter

Copy Code code as follows:

public class Pageritemadapter extends Pageradapter {
private context;
Private imageitem[] image;

Public Pageritemadapter (context context, imageitem[] image) {
This.context = context;
This.image = image;
HashMap = new Hashmap<integer, viewpageritem> ();
}

Private Hashmap<integer, viewpageritem> hashmap;//Save the ID of the photo and the corresponding Viewpageritem

@Override
public int GetCount () {
return image.length;
}

@Override
public boolean isviewfromobject (View arg0, Object arg1) {
return arg0 = = Arg1;
}

@Override
public void Finishupdate (ViewGroup container) {
Super.finishupdate (container);
}

@Override//Initialization of a viewpageritem, if it already exists, reload, no words new one
Public Object Instantiateitem (viewgroup container, int position) {
Viewpageritem item;
if (Hashmap.containskey (position)) {
item = hashmap.get (position);
Item.reload ();
} else {
item = new Viewpageritem (context);
Imageitem itemimg = image[position];
Item.setdata (ITEMIMG);
Hashmap.put (position, item);
((Viewpager) container). AddView (item);
}
return item;
}

@Override//The picture will be recycled when we slide the picture around
public void Destroyitem (View container, int position, object object) {
Viewpageritem item = (Viewpageritem) object;
Item.recycle ();
}
}

5. Add a Viewpager control to the Main.xml file

Copy Code code as follows:

<android.support.v4.view.viewpager
Android:id= "@+id/viewpager"
Android:layout_width= "Fill_parent"
android:layout_height= "Fill_parent"/>

6, modify the mainactivity as follows:

Copy Code code as follows:

public class Mainactivity extends activity {
Private final static int res[] = {R.DRAWABLE.P1, r.drawable.p2};//p1,p2 for two pictures under Drawable folder
Private Viewpager Viewpager;
Private Pageritemadapter adapter;
Private imageitem[] Item;

private void Setview () {
item = new IMAGEITEM[2];
Item[0] = new Imageitem (Res[0], "Page1");
ITEM[1] = new Imageitem (res[1], "Page2");
Viewpager = (Viewpager) Findviewbyid (R.id.viewpager);
adapter = new Pageritemadapter (Getapplicationcontext (), item);
Viewpager.setadapter (adapter);
}

@Override
protected void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.activity_main);
Setview ();
}
}


Run the program, the left and right sliding screen appears as follows!

Related Article

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.