androidで画面をスワイプしてページを変更する
スワイプって
ページ移動とかする際に指で横にス~と伸ばすやつです。
フリックの指を離さない版と思えば簡単かも…
参考
Android Tips #30 ViewPager を使ってスワイプで View を切り替える | Developers.IO
※ブログみただけではうまくイメージつかないので実際に作成したほうがいいですね
作成
画面
→ なんもしてないよ
build.gradle
apply plugin: 'com.android.application' android { compileSdkVersion 22 buildToolsVersion "23.0.0 rc3" defaultConfig { applicationId "jp.mshige1979.app.sampleapppager1" minSdkVersion 15 targetSdkVersion 22 versionCode 1 versionName "1.0" } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } } dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.android.support:appcompat-v7:22.2.1' compile 'com.android.support:support-v4:22.0.+' }
※”compile 'com.android.support:support-v4:22.0.+'”を追加しないとPagerAdapterが使用できません
CustomPagerAdapter
package jp.mshige1979.app.sampleapppager1; import android.content.Context; import android.support.v4.view.PagerAdapter; import android.view.Gravity; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import java.util.ArrayList; /** * カスタム PagerAdapter クラス. */ public class CustomPagerAdapter extends PagerAdapter { /** コンテキスト. */ private Context mContext; /** リスト. */ private ArrayList<Integer> mList; /** * コンストラクタ. */ public CustomPagerAdapter(Context context) { mContext = context; mList = new ArrayList<Integer>(); } /** * リストにアイテムを追加する. * @param item アイテム */ public void add(Integer item) { mList.add(item); } @Override public Object instantiateItem(ViewGroup container, int position) { // リストから取得 Integer item = mList.get(position); // View を生成 TextView textView = new TextView(mContext); textView.setText("Page:" + position); textView.setTextSize(30); textView.setTextColor(item); textView.setGravity(Gravity.CENTER); // コンテナに追加 container.addView(textView); return textView; } @Override public void destroyItem(ViewGroup container, int position, Object object) { // コンテナから View を削除 container.removeView((View) object); } @Override public int getCount() { // リストのアイテム数を返す return mList.size(); } @Override public boolean isViewFromObject(View view, Object object) { // Object 内に View が存在するか判定する return view == (TextView) object; } }
※ページ用のアダプターです。まだ良くわかっていないけどこいつでうまくやってくれている感じ
MainActivity
package jp.mshige1979.app.sampleapppager1; import android.graphics.Color; import android.os.Bundle; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.view.Menu; import android.view.MenuItem; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // カスタム PagerAdapter を生成 CustomPagerAdapter adapter = new CustomPagerAdapter(this); adapter.add(Color.BLACK); adapter.add(Color.RED); adapter.add(Color.GREEN); adapter.add(Color.BLUE); adapter.add(Color.CYAN); adapter.add(Color.MAGENTA); adapter.add(Color.YELLOW); // ViewPager を生成 ViewPager viewPager = new ViewPager(this); viewPager.setAdapter(adapter); // レイアウトにセット setContentView(viewPager); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } }
※ブランクの画面にページを追加しています。今回は色を変えているだけ?
結果
所感
compileに設定するものとかかってに増やしてくれると有りがたいけどまあその辺は諦めよう。
アプリを使っているとたまに「これどうやってんの?」みたいなことがあるのでいろいろと参考にしながらやっていくことにする。