Scribd
Upload
64 views5 pages

Use of Viewpager in Phimpme

The document discusses replacing the deprecated GalleryView with ViewPager in the Phimpme Android app. It provides steps to implement ViewPager, including adding it to the XML layout, creating a ViewPagerAdapter class that extends PagerAdapter and overrides required methods like getCount() and instantiateItem(), inflating a custom layout in instantiateItem() to display images, providing image data via an array, and setting the adapter on the ViewPager. This allows viewing images horizontally with swiping in the Phimpme app using ViewPager.

Uploaded by

MohitManuja
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
64 views5 pages

Use of Viewpager in Phimpme

The document discusses replacing the deprecated GalleryView with ViewPager in the Phimpme Android app. It provides steps to implement ViewPager, including adding it to the XML layout, creating a ViewPagerAdapter class that extends PagerAdapter and overrides required methods like getCount() and instantiateItem(), inflating a custom layout in instantiateItem() to display images, providing image data via an array, and setting the adapter on the ViewPager. This allows viewing images horizontally with swiping in the Phimpme app using ViewPager.

Uploaded by

MohitManuja
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Formatted: Left

Use of ViewPager in Phimpme


Previously GalleryView was used in phimpme android app but as it is now
deprecated, I decided to use ViewPager instead of GalleryView.

ViewPager allows us to view data with a horizontal swipe with the help of
layoutManager.

Steps to implement the viewPager :

1. First add the ViewPager in Activity.xml file where you want to


implement the ViewPager. This can be done using the line of code
below:
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent">

</android.support.v4.view.ViewPager> Commented [1]: please add code as code formatted


text in the blog as well.

2. To display the content of viewPager we use the viewPagerAdapter. Create


new java file ViewPagerAdapter and extends it to PagerAdapter.

ViewPagerAdapter.java
public class ViewPagerAdapter extends PagerAdapter {
}

3. After extending to PagerAdaper we have to override the two basic methods


of PagerAdapter.

First, implement the constructor which helps us to provide the context of


activity to ViewPagerAdapter.
You can override by pressing Alt+enter combination, click on implement
methods and then selects these two methods.
It will implement two methods
getCount()
isViewFromObject()

getCount will return the number of items in viewpager.

4. Now we override the few methods which are required to inflate and destroy
view in viewPager.

First,
Override the instantiateItem() method it creates the page for given position.

@Override
public Object instantiateItem(ViewGroup container, int position) {
return super.instantiateItem(container, position);
}

Now we will modify this method to inflate the view for viewPager.
As we want to display imageView in viewPager first we have to inflate the
imageView and set Image according to the position of ViewPager.

Next steps,
Implement the customView for imageView.
And provide the data for ViewPager i.e Array of images.

Create new custom_layout.xml and add ImageView in it.


<ImageView
android:layout_width="match_parent"
android:id="@+id/image_view"
android:layout_height="match_parent" />
And create an array for images if you want to show images from the local
memory so collect path of the images which you want to show with the array
name Images.

Now we will use custom_layout layout in our ViewPager instantiateItem()


method.

@Override
public Object instantiateItem(ViewGroup container, int position) {
LayoutInflater layoutInflater = (LayoutInflater)
context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view= layoutInflater.inflate(R.layout.custom_view,null);
ImageView imageView = (ImageView)view.findViewById(R.id.image_view);
imageView.setBackgroundResource(images[position]);
container.addView(view,0);
return view;
}

The above code inflates the imageView in ViewPager.

Now we have to override destroyItem() method. This method will destroy


the content of viewPager from given position.
The below code will remove the view which we added in instantiateItem()
method.
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}

Now PagerAdapter is ready, we can use this in our Activity.

5. Reference the viewPager and set the ViewPagerAdapter to ViewPager.

Activity.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
viewPager.setAdapter(new ViewPagerAdapter(this));
}

The above code will set the pagerAdapter to our view pager and display the
content which we defined in instantiateItem() method of pagerAdapter.

This is how viewPager will allow viewing images by swiping horizontally in


Phimpme.

Thanks.
Resources:
https://developer.android.com/reference/android/support/v4/view/PagerA
dapter.html

https://github.com/fossasia/phimpme-android/pull/407/files

You might also like