标签:
先上图,手指在手机向左或者向右滑就可以实现相应的页面切换。
先看activity_main.xml文件,非常简单,主要是三个标题TextView和viewpager
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:layout_width="match_parent" 4 android:layout_height="fill_parent" 5 android:layout_centerVertical="true" 6 android:orientation="vertical" 7 android:paddingTop="2dp"> 8 9 <LinearLayout 10 android:layout_width="match_parent" 11 android:layout_height="30dp" 12 android:layout_marginTop="5dp" 13 android:orientation="horizontal" 14 android:paddingLeft="20dp" 15 android:paddingRight="20dp"> 16 17 <TextView 18 android:id="@+id/tv_layout_one" 19 android:layout_width="0dp" 20 android:layout_height="fill_parent" 21 android:layout_weight="0.5" 22 android:gravity="center" 23 android:text="one" /> 24 25 <TextView 26 android:id="@+id/tv_layout_two" 27 android:layout_width="0dp" 28 android:layout_height="fill_parent" 29 android:layout_weight="0.5" 30 android:gravity="center" 31 android:text="two" /> 32 33 <TextView 34 android:id="@+id/tv_layout_three" 35 android:layout_width="0dp" 36 android:layout_height="fill_parent" 37 android:layout_weight="0.5" 38 android:gravity="center" 39 android:text="three" /> 40 </LinearLayout> 41 42 <android.support.v4.view.ViewPager 43 android:id="@+id/vp" 44 android:layout_marginTop="5dp" 45 android:layout_width="fill_parent" 46 android:layout_height="fill_parent" /> 47 </LinearLayout>
我们再看看相应的MainActivity需要准备些什么
1 package com.example.keranbin.view.activity; 2 3 import android.app.Activity; 4 import android.os.Bundle; 5 import android.support.design.widget.FloatingActionButton; 6 import android.support.design.widget.Snackbar; 7 import android.support.v4.app.Fragment; 8 import android.support.v4.app.FragmentActivity; 9 import android.support.v4.app.FragmentPagerAdapter; 10 import android.support.v4.view.ViewPager; 11 import android.support.v7.app.AppCompatActivity; 12 import android.support.v7.widget.Toolbar; 13 import android.view.View; 14 import android.view.Menu; 15 import android.view.MenuItem; 16 import android.widget.TextView; 17 18 import com.example.keranbin.view.R; 19 import com.example.keranbin.view.adapter.MFragmentPagerAdapter; 20 import com.example.keranbin.view.fragment.OneFragment; 21 import com.example.keranbin.view.fragment.ThreeFragment; 22 import com.example.keranbin.view.fragment.TwoFragment; 23 24 import java.util.ArrayList; 25 26 public class MainActivity extends FragmentActivity { 27 private ViewPager viewPager; //页面viewpager 28 private ArrayList<Fragment> fragmentlists; //fragment集合, 29 private MFragmentPagerAdapter mFragmentPagerAdapter; //viewpager适配器 30 private TextView tvOne; 31 private TextView tvTwo; 32 private TextView tvThree; 33 34 35 36 @Override 37 protected void onCreate(Bundle savedInstanceState) { 38 super.onCreate(savedInstanceState); 39 setContentView(R.layout.activity_main); 40 initView(); //初始化页面组件及一些数据 41 setListener(); //对页面一些组件设置一些监听事件 42 43 } 44 45 46 //初始化页面组件及一些数据 47 private void initView() { 48 viewPager= (ViewPager) this.findViewById(R.id.vp); 49 tvOne= (TextView) this.findViewById(R.id.tv_layout_one); 50 tvTwo= (TextView) this.findViewById(R.id.tv_layout_two); 51 tvThree= (TextView) this.findViewById(R.id.tv_layout_three); 52 53 54 //初始化one two three的背景 55 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_blue_left); 56 tvTwo.setBackgroundResource(R.drawable.solid_transparent_rectangle); 57 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_transparent_right); 58 59 //往fragment集合里添加fragment 60 fragmentlists=new ArrayList<Fragment>(); 61 OneFragment oneFragment=new OneFragment(); 62 TwoFragment twoFragment=new TwoFragment(); 63 ThreeFragment threeFragment=new ThreeFragment(); 64 fragmentlists.add(oneFragment); 65 fragmentlists.add(twoFragment); 66 fragmentlists.add(threeFragment); 67 68 69 //初始化viewpager适配器 70 initViewPagerAdapter(); 71 72 } 73 74 75 //初始化viewpager适配器 76 private void initViewPagerAdapter() { 77 mFragmentPagerAdapter=new MFragmentPagerAdapter(getSupportFragmentManager(),fragmentlists); 78 viewPager.setAdapter(mFragmentPagerAdapter); 79 viewPager.setCurrentItem(0); 80 } 81 82 //对页面一些组件设置一些监听事件 83 private void setListener() { 84 //分别对one,two,three三个TextView设置点击监听事件,发生点击事件时改变相应的背景及viewpager的内容 85 tvOne.setOnClickListener(new View.OnClickListener() { 86 @Override 87 public void onClick(View v) { 88 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_blue_left); 89 tvTwo.setBackgroundResource(R.drawable.solid_transparent_rectangle); 90 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_transparent_right); 91 viewPager.setCurrentItem(0); 92 } 93 }); 94 95 tvTwo.setOnClickListener(new View.OnClickListener() { 96 @Override 97 public void onClick(View v) { 98 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_transparent_left); 99 tvTwo.setBackgroundResource(R.drawable.solid_blue_rectangle); 100 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_transparent_right); 101 viewPager.setCurrentItem(1); 102 } 103 }); 104 105 tvThree.setOnClickListener(new View.OnClickListener() { 106 @Override 107 public void onClick(View v) { 108 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_transparent_left); 109 tvTwo.setBackgroundResource(R.drawable.solid_transparent_rectangle); 110 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_blue_right); 111 viewPager.setCurrentItem(2); 112 } 113 }); 114 115 116 117 118 //对页面viewpager设置监听事件 119 viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { 120 @Override 121 public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 122 123 } 124 125 @Override 126 public void onPageSelected(int position) { 127 //页面滑动时改变"one","two","three"三个TextView的背景颜色 128 if(position==0){ 129 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_blue_left); 130 tvTwo.setBackgroundResource(R.drawable.solid_transparent_rectangle); 131 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_transparent_right); 132 }else if(position==1){ 133 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_transparent_left); 134 tvTwo.setBackgroundResource(R.drawable.solid_blue_rectangle); 135 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_transparent_right); 136 }else if(position==2){ 137 tvOne.setBackgroundResource(R.drawable.solid_half_elipse_transparent_left); 138 tvTwo.setBackgroundResource(R.drawable.solid_transparent_rectangle); 139 tvThree.setBackgroundResource(R.drawable.solid_half_elipse_blue_right); 140 } 141 } 142 143 @Override 144 public void onPageScrollStateChanged(int state) { 145 146 } 147 }); 148 149 150 151 } 152 153 }
大体思路是,我们先定义一个页面集合ArrayList<Fragment>,接着建立相应的Fragment装载到集合中,然后定义自己的viewPager适配器,最后调用viewpager的setAdapter即可。
自定义的viewpager适配器代码如下
1 package com.example.keranbin.view.adapter; 2 3 import android.support.v4.app.Fragment; 4 import android.support.v4.app.FragmentManager; 5 import android.support.v4.app.FragmentPagerAdapter; 6 7 import java.util.ArrayList; 8 9 /** 10 * Created by keranbin on 2015/10/12. 11 */ 12 public class MFragmentPagerAdapter extends FragmentPagerAdapter { 13 private ArrayList<Fragment> fragmentlists; 14 15 public MFragmentPagerAdapter(FragmentManager fm,ArrayList<Fragment> fragmentlists) { 16 super(fm); 17 this.fragmentlists=fragmentlists; 18 } 19 20 @Override 21 public int getCount() { 22 return fragmentlists.size(); 23 } 24 25 @Override 26 public Fragment getItem(int position) { 27 return fragmentlists.get(position); 28 } 29 }
标签:
原文地址:http://www.cnblogs.com/bdsdkrb/p/4872998.html