ViewPager
AndroidStudio

[Android Studio]viewpagerの実装方法

ページを作る

今回は3つのページを作る。

[res/layout/fragment0.xml]

?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Fragment 0"
        android:textSize="30sp"
        android:padding="50dp"/>
</LinearLayout>

[java/com.example.ruihirano.myapplication3/fragment0.java]

package com.example.ruihirano.myapplication3;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment0 extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater,
                             ViewGroup container,
                             Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment0, null);
    }

}

fragment1,fragment2も同じように作る。

pagerAdapterを作る

[java/com.example.ruihirano.myapplication3/pageradapter.java]

package com.example.ruihirano.myapplication3;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
/*
Fragment0,1,2が同じディレクトリにないときに必要になるかも?
import com.example.ruihirano.myapplication3.Fragment0;
import com.example.ruihirano.myapplication3.Fragment1;
import com.example.ruihirano.myapplication3.Fragment2;
*/

public class PagerAdapter extends FragmentPagerAdapter {
    private static final int PAGE_NUM = 3;

    public PagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        Fragment fragment = null;
        switch (position){
            case 0:
                fragment = new Fragment0();
                break;
            case 1:
                fragment = new Fragment1();
                break;
            default:
                fragment = new Fragment2();
        }
        return fragment;
    }

    @Override
    public int getCount() {
        return PAGE_NUM;
    }
}

下のimportはfragment0,1,2が同じディレクトリにないときにimportする必要があるかもしれない。

import com.example.ruihirano.myapplication3.Fragment0;
import com.example.ruihirano.myapplication3.Fragment1;
import com.example.ruihirano.myapplication3.Fragment2;

app-bar-main.xmlにviewpagerのアクティビティの詳細を記載する

app_bar_main.xmlはactivity_main.xmlからapp_barに関する情報を分岐したもの。
最終的にはactivity_main.xmlでincludeされている。

[res/layout/app_bar_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">
        <android.support.v4.view.PagerTitleStrip
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:background="#CCCCCC"
            android:textColor="#000000"
            android:paddingTop="10dp"
            android:paddingBottom="10dp"/>
    </android.support.v4.view.ViewPager>

mainActivity.javaに記述する。

[java/com.example.ruihirano.myapplication3/MainActivity.java]

/*importされてないものをimportする*/

import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
/*
pageradapter.javaが同じディレクトリになければ必要かも?
import com.example.ruihirano.myapplication3.PagerAdapter;
*/


public class MainActivity extends AppCompatActivity {

    private ViewPager pager;

    private FragmentPagerAdapter adapter;

    private int currentPage;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        pager = (ViewPager) findViewById(R.id.pager);

        adapter = new UserInfoViewPagerAdapter(getSupportFragmentManager());
        pager.setAdapter(adapter);
        currentPage = 0;

    }

まとめ

以上のことを記述すればスワイプによる画面遷移ができる。