ViewPager、Fragment和TabLayout实现切页效果
不会上传动图,心里哭唧唧。但是是完整代码!新建一个项目,完全拷贝粘贴就可以用!
1.布局文件
(1)activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:tabIndicatorColor="@color/colorAccent"
app:tabIndicatorHeight="2dp"
app:tabBackground="@android:color/white"
app:tabTextColor="@android:color/black"
app:tabSelectedTextColor="@android:color/holo_orange_dark">
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
</android.support.v4.view.ViewPager>
</RelativeLayout>
(2)新建fragment1.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"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/tv_fragment1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fragment1"
android:textSize="20sp"/>
</LinearLayout>
2.新建MyPagerAdapter
public class MyPagerAdapter extends FragmentPagerAdapter {
private Context context;
private List<Fragment> fragments;
private List<String> strings;
public MyPagerAdapter(List<Fragment> fragments, List<String> strings, FragmentManager fragmentManager, Context context){
super(fragmentManager);
this.strings = strings;
this.context = context;
this.fragments = fragments;
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments != null ? fragments.size() : 0;
}
@Override
public CharSequence getPageTitle(int position) {
return strings.get(position);
}
}
3.新建4个Fragment,这里的个数由自己需要所定。这里我只建了Fragment1,其他几个只需把Fragment1改成Fragment2、Fragment3……
public class Fragment1 extends Fragment {
private View rootView;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
rootView = (View) inflater.inflate(R.layout.fragment1, container, false);
return rootView;
}
}
4.MainActivity.java
public class MainActivity extends BaseActivity {
ViewPager viewPager;
TabLayout tabLayout;
private List<String> strings = new ArrayList<String>();;
private List<Fragment> fragments = new ArrayList<Fragment>();;
private MyPagerAdapter myPagerAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager=findViewById(R.id.view_pager);
tabLayout=findViewById(R.id.tab_layout);
initView();
}
private void initView(){
viewPager.setAdapter(new MyPagerAdapter(fragments,strings,
getSupportFragmentManager(),this));
tabLayout.setupWithViewPager(viewPager);
Fragment1 fragment1 = new Fragment1();
fragments.add(fragment1);
strings.add("页面1");
Fragment2 fragment2 = new Fragment2();
fragments.add(fragment2);
strings.add("页面2");
Fragment3 fragment3 = new Fragment3();
fragments.add(fragment3);
strings.add("页面3");
Fragment4 fragment4 = new Fragment4();
fragments.add(fragment4);
strings.add("页面4");
myPagerAdapter=new MyPagerAdapter(fragments,strings,getSupportFragmentManager(),MainActivity.this);
viewPager.setAdapter(myPagerAdapter);
}
}
注:在build.gradle里配置
implementation 'com.android.support:design:28.0.0'
5.新建menu_main.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.strivestay.tablayoutdemo.MainActivity">
<item android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="Settings"
app:showAsAction="never"/>
</menu>
6.dimens.xml
<resources>
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>
<dimen name="fab_margin">16dp</dimen>
<dimen name="appbar_padding_top">8dp</dimen>
</resources>