笔记TabLayout + ViewPager + FragmentPagerAdapter 组合用法

Posted 豆子

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了笔记TabLayout + ViewPager + FragmentPagerAdapter 组合用法相关的知识,希望对你有一定的参考价值。

  • TabLayout的xml文件
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- TODO: Update blank fragment layout -->
    <!-- Toolbar -->
    <LinearLayout
        android:id="@+id/daily_pic"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:paddingTop="16dp"
        android:paddingLeft="18dp"
        android:background="@color/blue_btn_color_normal">

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <ImageButton
                android:id="@+id/btn_wei_left1"
                android:layout_width="wrap_content"
                android:layout_height="20dp"
                android:layout_marginTop="4dp"
                android:background="@drawable/ic_me_left"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="优惠券"
                android:paddingRight="50dp"
                android:layout_marginLeft="115dp"
                android:gravity="left"
                android:textSize="21dp"
                android:textColor="#f7efef"
                android:background="@color/blue_btn_color_normal"/>
        </LinearLayout>
    </LinearLayout>

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        app:tabMode="fixed"
        >
    </android.support.design.widget.TabLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#ffffff"
        />

</LinearLayout>
  • ViewPager里面的内容
<?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:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="暂无"
        android:layout_gravity="center"
        android:layout_marginLeft="150dp"
        android:textSize="50dp"
        />

</LinearLayout>
  • 具体实现代码,创建Fragment
package com.example.accessHand2.Home;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import com.example.accessHand2.R;

/**
 * Created by Douzi on 2017/7/15.
 */

public class PageFragment extends Fragment {

    public static final String ARGS_PAGE = "args_page";
    private int mPage;

    public static PageFragment newInstance(int page) {
        Bundle args = new Bundle();

        args.putInt(ARGS_PAGE, page);
        PageFragment fragment = new PageFragment();
        fragment.setArguments(args);
        return fragment;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mPage = getArguments().getInt(ARGS_PAGE);
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.youhui_fragment,container,false);

        TextView textView = (TextView) view.findViewById(R.id.textView);
        textView.setText("第" + mPage + "页");        //设置ViewPager内容
        textView.setTextSize(20);

        return view;
    }
}
  • 创建适配器
package com.example.accessHand2.Home;

import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

/**
 * Created by Douzi on 2017/7/15.
 */

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {

    public final int COUNT = 2;
    private String[] titles = new String[]{"可用(0)", "暂无可用(0)"};      //设置tab的标题
    private Context context;

    public MyFragmentPagerAdapter(FragmentManager fm, Context context) {
        super(fm);
        this.context = context;
    }

    @Override
    public Fragment getItem(int position) {
        return PageFragment.newInstance(position + 1);
    }

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

    @Override
    public CharSequence getPageTitle(int position) {
        return titles[position];
    }
}

 

  • Fragment+ViewPager+FragmentPagerAdapter的组合
     mTabLayout = (TabLayout) findViewById(R.id.tab_layout2);
        //添加 ViewPager内容
     ViewPager viewPager
= (ViewPager) findViewById(R.id.viewPager); MyFragmentPagerAdapter adapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), this); viewPager.setAdapter(adapter); //将 viewPager 和 tab 关联到一起, 很重要 ! viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(mTabLayout));
       mTabLayout.setupWithViewPager(viewPager);
  • TabLayout的使用 (方法一,手动添加)
   TabLayout tabLayout = ...;
    tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
    tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
    tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));
  •  TabLayout的使用 (方法二,自动添加, 就是上面那个组合的代码)
     mTabLayout = (Tabayout) findViewById(R.id.tab_layout2);
        //添加 ViewPager内容
     ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
        MyFragmentPagerAdapter adapter = new MyFragmentPagerAdapter(getSupportFragmentManager(),
                this);
        viewPager.setAdapter(adapter);

        //将 viewPager 和 tab 关联到一起, 很重要 !
        viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(mTabLayout));
     mTabLayout.setupWithViewPager(viewPager);
     mTabLayout.setTabGravity(TabLayout.GRAVITY_FILL);     //使Tab填满 屏幕宽度
     mTabLayout.setTabMode(TabLayout.MODE_FIXED);

以上是关于笔记TabLayout + ViewPager + FragmentPagerAdapter 组合用法的主要内容,如果未能解决你的问题,请参考以下文章

Android学习笔记--TabLayout的简单使用

tablayout+viewpager怎么设置取消滑动

不使用 ViewPager 的 TabLayout

如何在 Android 中使用 TabLayout 和 ViewPager2

在ViewPager + TabLayout中跳过页面

片段中的Tablayout + viewpager,需要清除viewpager中的edittext数据