最近の更新

2014年7月31日木曜日

Android WearのViewPagerでカードをページ表示する方法

【目的】
Android WearのViewPagerでカードをページ表示させます。



【準備】
1.「Extrasライブラリ(Android Support Library v20等)のアップデート」の手順で、「Android Support Library」をv20に更新しておきます。
2.「wearable 1.0.0のライブラリプロジェクトの作成方法」の手順で、「wearable 1.0.0」のライブラリプロジェクトを作成しておきます。
※ADT23.0.2ではAndroid Wearに対応していない為の、暫定処置です。

※実機でデバッグする場合には以下を実行しておきます。
Sumsung Gear LiveのADBドライバのインストール方法」の手順で、ADBドライバをインストールしておきます。



【手順1】
1.「Androidプロジェクトの作成・実行方法(バージョン別一覧)」のAndroidプロジェクトの作成手順で、「AndroidWearSample15-001-ViewPager」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
項目名 項目に設定する値
アプリケーション名(Application Name) com.example.androidwearsample15_001
プロジェクト名(Project Name) AndroidWearSample15-001-ViewPager
パッケージ名(Package Name) com.example.androidwearsample15_001
Build SDK API 20
Minimum Required SDK API 20

2.「wearable 1.0.0プロジェクトをライブラリに指定する方法」の手順で、wearable 1.0.0をライブラリ設定しておきます。
3.「android-support-v13.jarをライブラリに設定する方法」の手順で、android-support-v13.jarをライブラリ設定しておきます。



【手順2】
1.「AndroidManifest.xml」は以下の通り。
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.androidwearsample15_001"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="20"
        android:targetSdkVersion="20" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:theme="@android:style/Theme.DeviceDefault.Light" >
        <activity android:name="com.example.androidwearsample15_001.MainActivity" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>
2.「Ctrl+Shift+F」を押し、コードをフォーマッティング。
3.「Ctrl+S」を押し、ファイルを保存。



【手順3】
1.「res/layout/activity_main.xml」は以下の通り。
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
2.「Ctrl+Shift+F」を押し、コードをフォーマッティング。
3.「Ctrl+S」を押し、ファイルを保存。



【手順4】
1.「src/com/example/androidwearsample15_001/MainActivity.java」は以下の通り。
package com.example.androidwearsample15_001;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.os.Bundle;
import android.support.v13.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.wearable.view.CardFragment;

public class MainActivity extends Activity {
    private ViewPager viewPager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager = (ViewPager) findViewById(R.id.pager);
        PagerAdapter adapter = new PagerAdapter(getFragmentManager());
        adapter.addFragment(SampleFragment.newInstance(1));
        adapter.addFragment(SampleFragment.newInstance(2));
        adapter.addFragment(SampleFragment.newInstance(3));
        viewPager.setAdapter(adapter);
    }

    private class PagerAdapter extends FragmentPagerAdapter {
        List<Fragment> fragmentList = null;

        public PagerAdapter(FragmentManager fragmentManager) {
            super(fragmentManager);
            fragmentList = new ArrayList<Fragment>();
        }

        @Override
        public Fragment getItem(int position) {
            return fragmentList.get(position);
        }

        @Override
        public int getCount() {
            return fragmentList.size();
        }

        public void addFragment(Fragment fragment) {
            fragmentList.add(fragment);
            notifyDataSetChanged();
        }
    }

    public static class SampleFragment extends CardFragment {
        private static SampleFragment newInstance(int pageNo) {
            Bundle bundle = new Bundle();
            bundle.putString(CardFragment.KEY_TITLE, pageNo + "ページ目");
            bundle.putString(CardFragment.KEY_TEXT, "本文1行目\n本文2行目\n本文3行目");
            SampleFragment sampleFragment = new SampleFragment();
            sampleFragment.setArguments(bundle);
            return sampleFragment;
        }
    }
}
2.「Ctrl+Shift+F」を押し、コードをフォーマッティング。
3.「Ctrl+S」を押し、ファイルを保存。



【手順5】
1.「Androidプロジェクトの作成・実行方法(バージョン別一覧)」のAndroidプロジェクトの実行手順で、実行。
※Android Wearの実機で動かす場合は、実機とPCをUSBで接続する。



【手順6】
1.Sumsung Gear Live(Android Wear)の場合、以下の様に表示されます。




2.スワイプでページを移動できます。

























以上です。


0 件のコメント:

コメントを投稿

注: コメントを投稿できるのは、このブログのメンバーだけです。

関連記事