画面を指で左右にめくる操作・・・。最もスマホ的な操作かと思っていたのに、Androidでの実装には別のライブラリを追加するなど、少し面倒な作業が必要でした。（便利なテンプレートを用意してくれるAppleとの差はまだ大きい・・・ 訂正、新しいSDKではテンプレートが用意されていました。）
とはいえ、以下のページにサンプルコード付きで説明されているので、やり方は簡単。要はGallaryと同じようにAdapterを使うだけです。
http://developer.android.com/training/implementing-navigation/lateral.html#horizontal-paging
ここでは、ApiDemo のGallary を元にして、Swipeで操作できるように改造してみました。（ソース）
1. FragmentActivity にする
- Support Libraryをダウンロードする
http://developer.android.com/tools/extras/support-library.html
ここからダウンロードして、android-support-v4.jar を プロジェクトのlibフォルダにコピー。ライブラリのPathにも追加（Java build pathにAdd Jar…）します。（libにコピーじゃなくて、直接Add External Jar…でも大丈夫かもしれません。）
2. ソースに以下のimportを追加
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.app.FragmentActivity;
3. Activityの基本クラスをActivityからFragmentActivityに変更
public class SwipeViewActivity extends FragmentActivity {...}
4. Adapter を実装
FragmentStatePagerAdapter を継承するクラスを作成
Overrideする必要があるのは以下の２つ
Fragment getItem(int)
int getCount()
Fragmentは、めくられるページ（View）の内容を保持します。getItem(int) の引数としてページの番号が与えられるので、それをもとに、ページの内容を作成するのに必要な情報を持ったFragmentのオブジェクトを作成して返します。
例えば、現在のページ番号だけ分かればいいのであれば、引数のintを直接渡してしまえばOK
public class CollectionPagerAdapter extends
FragmentStatePagerAdapter {
public CollectionPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int i) {
Fragment fragment = new ObjectFragment();
Bundle args = new Bundle();
// Our object is just an integer :-P
args.putInt(ObjectFragment.ARG_OBJECT, i);
fragment.setArguments(args);
return fragment;
}
@Override
public int getCount() {
return mImageIds.length;
}
}
5. Fragment を実装
Fragmentを継承するクラスを作成します
リソースにある画像のIDを配列で保持し、その画像をViewで表示する例です
画像のIDを配列はこのように定義（ApiDemoのGallaryのをコピーして使用）
static private final Integer[] mImageIds = {
R.drawable.gallery_photo_1,
R.drawable.gallery_photo_2,
R.drawable.gallery_photo_3,
R.drawable.gallery_photo_4,
R.drawable.gallery_photo_5,
R.drawable.gallery_photo_6,
R.drawable.gallery_photo_7,
R.drawable.gallery_photo_8
};
リソースの画像を表示するViewを作成して返します。
public static class ObjectFragment extends Fragment {
public static final String ARG_OBJECT = "object";
private Bitmap mBmp = null;
@Override
public View onCreateView(LayoutInflater inflater,
ViewGroup container, Bundle savedInstanceState) {
// The last two arguments ensure LayoutParams are inflated
// properly.
ImageView imgView = (ImageView)inflater.inflate(
R.layout.imageview, container, false);
Bundle args = getArguments();
int position = (int) args.getInt(ARG_OBJECT);
imgView.setImageResource(mImageIds[position]);
imgView.setScaleType(ImageView.ScaleType.FIT_CENTER);
return imgView;
}
}
6. 画面リソース（main.xml）を定義
android.support.v4.view.ViewPager を使います。
<?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:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" android:id="@+id/imageviewpager"/>
</LinearLayout>
7. Fragmentで作成するViewのxml定義。Layoutは要らない。（もちろん、XMLを使わず、動的に作成してもいいはず）
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/imageview"/>
8. ViewPagerにAdapterを設定
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ViewPager pager = (ViewPager) findViewById(R.id.imageviewpager);
pager.setAdapter(new CollectionPagerAdapter(getSupportFragmentManager()));
}
動かしてみるとこんな感じです（ページをめくろうとしているところ）
タグ: fragment, support library, swipe
スマホアプリの自習帳 
コメントを残す