Add horizontal paging sample
This demonstrates how to use ViewPager in tandem with ActionBar
to implement horizontal paging within app's UI.
Change-Id: I6e5b0191c5ff06439f33ab999185d4d4cdb45807
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/build.gradle b/ui/views/HorizontalPaging/HorizontalPaging/build.gradle
new file mode 100644
index 0000000..10dfcfa
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/build.gradle
@@ -0,0 +1,23 @@
+buildscript {
+ repositories {
+ mavenCentral()
+ }
+ dependencies {
+ classpath 'com.android.tools.build:gradle:0.4'
+ }
+}
+apply plugin: 'android'
+
+dependencies {
+ compile files('libs/android-support-v4.jar')
+}
+
+android {
+ compileSdkVersion 17
+ buildToolsVersion "17.0.0"
+
+ defaultConfig {
+ minSdkVersion 11
+ targetSdkVersion 16
+ }
+}
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/libs/android-support-v4.jar b/ui/views/HorizontalPaging/HorizontalPaging/libs/android-support-v4.jar
new file mode 100644
index 0000000..428bdbc
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/libs/android-support-v4.jar
Binary files differ
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/AndroidManifest.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/AndroidManifest.xml
new file mode 100644
index 0000000..4359521
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/AndroidManifest.xml
@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+ package="com.example.android.horizontalpaging"
+ android:versionCode="1"
+ android:versionName="1.0" >
+
+ <!-- While ViewPager will work on API 4 or above, tabs require an ActionBar. ActionBar is only
+ available in API 11 or above. -->
+ <uses-sdk
+ android:minSdkVersion="11"
+ android:targetSdkVersion="16" />
+
+ <application
+ android:allowBackup="true"
+ android:icon="@drawable/ic_launcher"
+ android:label="@string/app_name"
+ android:theme="@style/AppTheme" >
+ <!-- This is a standard Activity invocation for MainActivity. -->
+ <activity
+ android:name="com.example.android.horizontalpaging.MainActivity"
+ android:label="@string/app_name" >
+ <intent-filter>
+ <action android:name="android.intent.action.MAIN" />
+
+ <category android:name="android.intent.category.LAUNCHER" />
+ </intent-filter>
+ </activity>
+</application>
+
+</manifest>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/java/com/example/android/horizontalpaging/MainActivity.java b/ui/views/HorizontalPaging/HorizontalPaging/src/main/java/com/example/android/horizontalpaging/MainActivity.java
new file mode 100644
index 0000000..2cdca42
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/java/com/example/android/horizontalpaging/MainActivity.java
@@ -0,0 +1,223 @@
+package com.example.android.horizontalpaging;
+
+import java.util.Locale;
+
+import android.app.ActionBar;
+import android.app.FragmentTransaction;
+import android.os.Bundle;
+import android.support.v4.app.Fragment;
+import android.support.v4.app.FragmentActivity;
+import android.support.v4.app.FragmentManager;
+import android.support.v4.app.FragmentPagerAdapter;
+import android.support.v4.app.NavUtils;
+import android.support.v4.view.ViewPager;
+import android.view.Gravity;
+import android.view.LayoutInflater;
+import android.view.Menu;
+import android.view.MenuItem;
+import android.view.View;
+import android.view.ViewGroup;
+import android.widget.TextView;
+
+public class MainActivity extends FragmentActivity implements ActionBar.TabListener {
+
+ /**
+ * The {@link android.support.v4.view.PagerAdapter} that will provide
+ * fragments for each of the sections. We use a
+ * {@link android.support.v4.app.FragmentPagerAdapter} derivative, which
+ * will keep every loaded fragment in memory. If this becomes too memory
+ * intensive, it may be best to switch to a
+ * {@link android.support.v4.app.FragmentStatePagerAdapter}.
+ */
+ SectionsPagerAdapter mSectionsPagerAdapter;
+
+ /**
+ * The {@link ViewPager} that will host the section contents.
+ */
+ ViewPager mViewPager;
+
+ /**
+ * Create the activity. Sets up an {@link ActionBar} with tabs, and then configures the
+ * {@link ViewPager} contained inside R.layout.activity_main.
+ *
+ * <p>A {@link SectionsPagerAdapter} will be instantiated to hold the different pages of
+ * fragments that are to be displayed. A
+ * {@link android.support.v4.view.ViewPager.SimpleOnPageChangeListener} will also be configured
+ * to receive callbacks when the user swipes between pages in the ViewPager.
+ *
+ * @param savedInstanceState
+ */
+ @Override
+ protected void onCreate(Bundle savedInstanceState) {
+ super.onCreate(savedInstanceState);
+ // Load the UI from res/layout/activity_main.xml
+ setContentView(R.layout.activity_main);
+
+ // Set up the action bar. The navigation mode is set to NAVIGATION_MODE_TABS, which will
+ // cause the ActionBar to render a set of tabs. Note that these tabs are *not* rendered
+ // by the ViewPager; additional logic is lower in this file to synchronize the ViewPager
+ // state with the tab state. (See mViewPager.setOnPageChangeListener() and onTabSelected().)
+ // BEGIN_INCLUDE (set_navigation_mode)
+ final ActionBar actionBar = getActionBar();
+ actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
+ // END_INCLUDE (set_navigation_mode)
+
+ // BEGIN_INCLUDE (setup_view_pager)
+ // Create the adapter that will return a fragment for each of the three primary sections
+ // of the app.
+ mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
+
+ // Set up the ViewPager with the sections adapter.
+ mViewPager = (ViewPager) findViewById(R.id.pager);
+ mViewPager.setAdapter(mSectionsPagerAdapter);
+ // END_INCLUDE (setup_view_pager)
+
+ // When swiping between different sections, select the corresponding tab. We can also use
+ // ActionBar.Tab#select() to do this if we have a reference to the Tab.
+ // BEGIN_INCLUDE (page_change_listener)
+ mViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
+ @Override
+ public void onPageSelected(int position) {
+ actionBar.setSelectedNavigationItem(position);
+ }
+ });
+ // END_INCLUDE (page_change_listener)
+
+ // BEGIN_INCLUDE (add_tabs)
+ // For each of the sections in the app, add a tab to the action bar.
+ for (int i = 0; i < mSectionsPagerAdapter.getCount(); i++) {
+ // Create a tab with text corresponding to the page title defined by the adapter. Also
+ // specify this Activity object, which implements the TabListener interface, as the
+ // callback (listener) for when this tab is selected.
+ actionBar.addTab(
+ actionBar.newTab()
+ .setText(mSectionsPagerAdapter.getPageTitle(i))
+ .setTabListener(this));
+ }
+ // END_INCLUDE (add_tabs)
+ }
+
+ /**
+ * Update {@link ViewPager} after a tab has been selected in the ActionBar.
+ *
+ * @param tab Tab that was selected.
+ * @param fragmentTransaction A {@link FragmentTransaction} for queuing fragment operations to
+ * execute once this method returns. This FragmentTransaction does
+ * not support being added to the back stack.
+ */
+ // BEGIN_INCLUDE (on_tab_selected)
+ @Override
+ public void onTabSelected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
+ // When the given tab is selected, tell the ViewPager to switch to the corresponding page.
+ mViewPager.setCurrentItem(tab.getPosition());
+ }
+ // END_INCLUDE (on_tab_selected)
+
+ /**
+ * Unused. Required for {@link ActionBar.TabListener}.
+ */
+ @Override
+ public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
+ }
+
+ /**
+ * Unused. Required for {@link ActionBar.TabListener}.
+ */
+ @Override
+ public void onTabReselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
+ }
+
+ // BEGIN_INCLUDE (fragment_pager_adapter)
+ /**
+ * A {@link FragmentPagerAdapter} that returns a fragment corresponding to
+ * one of the sections/tabs/pages. This provides the data for the {@link ViewPager}.
+ */
+ public class SectionsPagerAdapter extends FragmentPagerAdapter {
+ // END_INCLUDE (fragment_pager_adapter)
+
+ public SectionsPagerAdapter(FragmentManager fm) {
+ super(fm);
+ }
+
+ // BEGIN_INCLUDE (fragment_pager_adapter_getitem)
+ /**
+ * Get fragment corresponding to a specific position. This will be used to populate the
+ * contents of the {@link ViewPager}.
+ *
+ * @param position Position to fetch fragment for.
+ * @return Fragment for specified position.
+ */
+ @Override
+ public Fragment getItem(int position) {
+ // getItem is called to instantiate the fragment for the given page.
+ // Return a DummySectionFragment (defined as a static inner class
+ // below) with the page number as its lone argument.
+ Fragment fragment = new DummySectionFragment();
+ Bundle args = new Bundle();
+ args.putInt(DummySectionFragment.ARG_SECTION_NUMBER, position + 1);
+ fragment.setArguments(args);
+ return fragment;
+ }
+ // END_INCLUDE (fragment_pager_adapter_getitem)
+
+ // BEGIN_INCLUDE (fragment_pager_adapter_getcount)
+ /**
+ * Get number of pages the {@link ViewPager} should render.
+ *
+ * @return Number of fragments to be rendered as pages.
+ */
+ @Override
+ public int getCount() {
+ // Show 3 total pages.
+ return 3;
+ }
+ // END_INCLUDE (fragment_pager_adapter_getcount)
+
+ // BEGIN_INCLUDE (fragment_pager_adapter_getpagetitle)
+ /**
+ * Get title for each of the pages. This will be displayed on each of the tabs.
+ *
+ * @param position Page to fetch title for.
+ * @return Title for specified page.
+ */
+ @Override
+ public CharSequence getPageTitle(int position) {
+ Locale l = Locale.getDefault();
+ switch (position) {
+ case 0:
+ return getString(R.string.title_section1).toUpperCase(l);
+ case 1:
+ return getString(R.string.title_section2).toUpperCase(l);
+ case 2:
+ return getString(R.string.title_section3).toUpperCase(l);
+ }
+ return null;
+ }
+ // END_INCLUDE (fragment_pager_adapter_getpagetitle)
+ }
+
+ /**
+ * A dummy fragment representing a section of the app, but that simply displays dummy text.
+ * This would be replaced with your application's content.
+ */
+ public static class DummySectionFragment extends Fragment {
+ /**
+ * The fragment argument representing the section number for this
+ * fragment.
+ */
+ public static final String ARG_SECTION_NUMBER = "section_number";
+
+ public DummySectionFragment() {
+ }
+
+ @Override
+ public View onCreateView(LayoutInflater inflater, ViewGroup container,
+ Bundle savedInstanceState) {
+ View rootView = inflater.inflate(R.layout.fragment_main_dummy, container, false);
+ TextView dummyTextView = (TextView) rootView.findViewById(R.id.section_label);
+ dummyTextView.setText(Integer.toString(getArguments().getInt(ARG_SECTION_NUMBER)));
+ return rootView;
+ }
+ }
+
+}
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-hdpi/ic_launcher.png b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-hdpi/ic_launcher.png
new file mode 100755
index 0000000..96a442e
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-hdpi/ic_launcher.png
Binary files differ
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-mdpi/ic_launcher.png b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-mdpi/ic_launcher.png
new file mode 100755
index 0000000..359047d
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-mdpi/ic_launcher.png
Binary files differ
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-xhdpi/ic_launcher.png b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-xhdpi/ic_launcher.png
new file mode 100755
index 0000000..71c6d76
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/drawable-xhdpi/ic_launcher.png
Binary files differ
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/layout/activity_main.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/layout/activity_main.xml
new file mode 100644
index 0000000..237372c
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/layout/activity_main.xml
@@ -0,0 +1,8 @@
+<!-- BEGIN_INCLUDE (view_pager_layout) -->
+<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
+ xmlns:tools="http://schemas.android.com/tools"
+ android:id="@+id/pager"
+ android:layout_width="match_parent"
+ android:layout_height="match_parent"
+ tools:context=".MainActivity" />
+<!-- END_INCLUDE (view_pager_layout) -->
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/layout/fragment_main_dummy.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/layout/fragment_main_dummy.xml
new file mode 100644
index 0000000..6197494
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/layout/fragment_main_dummy.xml
@@ -0,0 +1,16 @@
+<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+ xmlns:tools="http://schemas.android.com/tools"
+ android:layout_width="match_parent"
+ android:layout_height="match_parent"
+ android:paddingLeft="@dimen/activity_horizontal_margin"
+ android:paddingRight="@dimen/activity_horizontal_margin"
+ android:paddingTop="@dimen/activity_vertical_margin"
+ android:paddingBottom="@dimen/activity_vertical_margin"
+ tools:context=".MainActivity$DummySectionFragment">
+
+ <TextView
+ android:id="@+id/section_label"
+ android:layout_width="wrap_content"
+ android:layout_height="wrap_content" />
+
+</RelativeLayout>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-sw600dp/dimens.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-sw600dp/dimens.xml
new file mode 100644
index 0000000..886b05f
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-sw600dp/dimens.xml
@@ -0,0 +1,4 @@
+<resources>
+ <!-- Customize dimensions originally defined in res/values/dimens.xml (such as
+ screen margins) for sw600dp devices (e.g. 7" tablets) here. -->
+</resources>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-sw720dp-land/dimens.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-sw720dp-land/dimens.xml
new file mode 100644
index 0000000..00059fc
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-sw720dp-land/dimens.xml
@@ -0,0 +1,5 @@
+<resources>
+ <!-- Customize dimensions originally defined in res/values/dimens.xml (such as
+ screen margins) for sw720dp devices (e.g. 10" tablets) in landscape here. -->
+ <dimen name="activity_horizontal_margin">128dp</dimen>
+</resources>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-v11/styles.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-v11/styles.xml
new file mode 100644
index 0000000..3c02242
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values-v11/styles.xml
@@ -0,0 +1,11 @@
+<resources>
+
+ <!--
+ Base application theme for API 11+. This theme completely replaces
+ AppBaseTheme from res/values/styles.xml on API 11+ devices.
+ -->
+ <style name="AppBaseTheme" parent="android:Theme.Holo.Light">
+ <!-- API 11 theme customizations can go here. -->
+ </style>
+
+</resources>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/dimens.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/dimens.xml
new file mode 100644
index 0000000..47c8224
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/dimens.xml
@@ -0,0 +1,5 @@
+<resources>
+ <!-- Default screen margins, per the Android Design guidelines. -->
+ <dimen name="activity_horizontal_margin">16dp</dimen>
+ <dimen name="activity_vertical_margin">16dp</dimen>
+</resources>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/strings.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/strings.xml
new file mode 100644
index 0000000..ec05e06
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/strings.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+
+ <string name="app_name">Horizontal Paging Sample</string>
+ <string name="action_settings">Settings</string>
+ <string name="title_section1">Section 1</string>
+ <string name="title_section2">Section 2</string>
+ <string name="title_section3">Section 3</string>
+
+</resources>
diff --git a/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/styles.xml b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/styles.xml
new file mode 100644
index 0000000..6ce89c7
--- /dev/null
+++ b/ui/views/HorizontalPaging/HorizontalPaging/src/main/res/values/styles.xml
@@ -0,0 +1,20 @@
+<resources>
+
+ <!--
+ Base application theme, dependent on API level. This theme is replaced
+ by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
+ -->
+ <style name="AppBaseTheme" parent="android:Theme.Light">
+ <!--
+ Theme customizations available in newer API levels can go in
+ res/values-vXX/styles.xml, while customizations related to
+ backward-compatibility can go here.
+ -->
+ </style>
+
+ <!-- Application theme. -->
+ <style name="AppTheme" parent="AppBaseTheme">
+ <!-- All customizations that are NOT specific to a particular API-level can go here. -->
+ </style>
+
+</resources>
diff --git a/ui/views/HorizontalPaging/build.gradle b/ui/views/HorizontalPaging/build.gradle
new file mode 100644
index 0000000..495c503
--- /dev/null
+++ b/ui/views/HorizontalPaging/build.gradle
@@ -0,0 +1 @@
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
