Sliding/Swiping Page with ViewPager
Page/Screen slides are transitions between one entire screen to another and are common with UIs like setup wizards or slideshows. This lesson shows you how to do screen slides with a ViewPager provided by the support library. ViewPagers can animate screen slides automatically. Here’s what a screen slide looks like that transitions from one screen of content to the next. ViewPager is one of the feature of Honeycomb to implement page swiping UI pattern.
android.support.v4.view.ViewPager is a layout manager that allows the user to flip left and right through pages of data. In this example, we will see how we can sliding pages by using ViewPager manager.
Requirements
To implement a Tabbed, using fragments on devices running Android , you’ll need to include the Android Compatibility library. Here we are using Compatibility library v4.
Steps
1.) Define the ViewPager layout
2.)Define the FragmentActivity container for the PageViewer
3.)Define the PagerAdapter
Layout
The ViewPager layout (viewpager_layout.xml) simply declares the ViewPager class from the v4 compatibility library.
<?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" > <android.support.v4.view.ViewPager android:id="@+android:id/viewpager" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </LinearLayout>
Defining the Activty
Our main FragmentActivity is going to host the ViewPager layout viewpager_layout.xml and initialize the ViewPager with an adapter that manages the fragments that are displayed when the user swipes between pages.
package com.andy.fragments.viewpager;
import java.util.List;
import java.util.Vector;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import com.andy.R;
import com.andy.fragments.tabs.Tab1Fragment;
import com.andy.fragments.tabs.Tab2Fragment;
import com.andy.fragments.tabs.Tab3Fragment;
public class ViewPagerFragmentActivity extends FragmentActivity{
private PagerAdapter mPagerAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setContentView(R.layout.viewpager_layout);
//initialsie the pager
this.initialisePaging();
}
private void initialisePaging() {
List<Fragment> fragments = new Vector<Fragment>();
fragments.add(Fragment.instantiate(this, Tab1Fragment.class.getName()));
fragments.add(Fragment.instantiate(this, Tab2Fragment.class.getName()));
fragments.add(Fragment.instantiate(this, Tab3Fragment.class.getName()));
this.mPagerAdapter = new PagerAdapter(super.getSupportFragmentManager(), fragments);
//
ViewPager pager = (ViewPager)super.findViewById(R.id.viewpager);
pager.setAdapter(this.mPagerAdapter);
}
}
The Adapter
The PagerAdapter class needs to extend FragmentPagerAdapter.
Lastly, the Adapter class has to provide at least getCount() and getItem(int) methods; to avoid having to write all the other Adapter methods you should extend FragmentPagerAdapter, as our CountryPageAdapter does.
package com.andy.fragments.viewpager;
import java.util.List;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class PagerAdapter extends FragmentPagerAdapter {
private List<Fragment> fragments;
public PagerAdapter(FragmentManager fm, List<Fragment> fragments) {
super(fm);
this.fragments = fragments;
}
@Override
public Fragment getItem(int position) {
return this.fragments.get(position);
}
@Override
public int getCount() {
return this.fragments.size();
}
}
OutPut
Here is what it looks like as we page from left-to-right:
Related Posts
Top 10 Android App Development Trends | 2020 Guide
5 Best Resources to Get Started with Android Nougat
Android Studio Introduction
Services – An Android Component
Applying MediaCodec On An Open Source Android Audio Player
5 Most Used Android Testing Frameworks
Android Language Highlights A Developers Perspective
Android KitKat Development