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.TabLayoutandroid: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.ViewPagerandroid: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"><TextViewandroid: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;}@Overridepublic Fragment getItem(int position) {return fragments.get(position);}@Overridepublic int getCount() {return fragments != null ? fragments.size() : 0;}@Overridepublic CharSequence getPageTitle(int position) {return strings.get(position);}}

3.新建4个Fragment，这里的个数由自己需要所定。这里我只建了Fragment1，其他几个只需把Fragment1改成Fragment2、Fragment3……

public class Fragment1 extends Fragment {private View rootView;@Nullable@Overridepublic 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;@Overrideprotected 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>

ViewPager、Fragment和TabLayout实现切页效果相关推荐

TabLayout+ViewPager+Fragment(内部:TabLayout+ViewPager+ Fragment)需要注意！！
之前面试的时候,被面试官问道ViewPager嵌套ViewPager怎么处理的.我还一直在回答用最外层的vp的onInterceptTouchEvent来处理怎样怎样(注意是代码没有写过,就这样说了. ...
android UI Tab切页效果总结
2019独角兽企业重金招聘Python工程师标准>>> 目前市面上APP 切页效果有两类(just android) 1.底部Tab点击不同的按钮来切换页面 && 滑 ...
利用 WAAPI 实现百叶窗切页效果
实现效果在 CodePen 上查看在 Github 上查看简单思路复制要切页的节点,利用 CSS 的 clip-path 属性对节点进行裁剪,将节点分成多个部分,每个部分分成上下两块(因为需要 ...
Android 上实现像微信一样的用Fragment来实现的Tab切页效果提供源码下载
网有不少的例子,但是要么是像微信一样可是没有使用Fragment实现,要么是只实现了一个很简单的切换,没有下面的菜单页.这个例子有实现了,我觉得暂时够我用了 ##实现类: + MainTabFragm ...
Android实现一个简易的新闻列表APP（TabLayout+ViewPager+Fragment）
Android实现一个简易的新闻列表APP(TabLayout+ViewPager+Fragment) 文章目录 Android实现一个简易的新闻列表APP(TabLayout+ViewPager+F ...
launcher切页动画
launcher切页动画刚工作的时候,还是launcher4.4,好像有很多切页特效可以选,重写切页特效类可以自己实现切页效果. 太久不搞launcher,忘记在哪实现切页特效了,比如什么外盒子.内 ...
TabLayout+ViewPager+Fragment实现切页展示
写在前面目前大多数的APP都采用的是几个Tab标签以及多个界面滑动的形式来提供多层次的交互体验,最为常用的做法就是采用TabLayout+ViewPager+Fragment的方式,最近在公司项目中 ...
使用TabLayout+ViewPager+Fragment实现切页展示
使用TabLayout+ViewPager+Fragment是比较常见的实现切页展示的方式,本例是在fragment中实现主要代码步骤: 1,定义TabLayout和ViewPager的布局 2,实 ...
Kotlin + AndroidX + Tablayout + ViewPager + Fragment 实现Tab切页
1.前沿 Google已经受够了V4,V7包的各种冲突.所以直接不再维护V4,V7包了.以后就统一使用AndroidX. 2.gradle配置: 除了原有的androidX的库,还需要使用materi ...

ViewPager、Fragment和TabLayout实现切页效果

文章目录

ViewPager、Fragment和TabLayout实现切页效果

ViewPager、Fragment和TabLayout实现切页效果相关推荐

最新文章

热门文章