如何使用TabLayout滚动片段?

时间:2016-11-14 19:47:02

标签: android android-fragments android-tablayout

我试图通过在标签页上从左向右滑动来使我的应用程序可滚动。现在,该应用程序可以通过滚动标签栏滚动标签,但我不知道如何为整个应用程序实现滚动。

主要活动:

public class MainActivity extends AppCompatActivity {

    public static MainActivity instance;

    private FragmentOne fragmentOne;
    private FragmentTwo fragmentTwo;
    private TabLayout allTabs;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        instance=this;

        getAllWidgets();
        bindWidgetsWithAnEvent();
        setupTabLayout();
    }

    public static MainActivity getInstance() {
        return instance;
    }

    private void getAllWidgets() {
        allTabs = (TabLayout) findViewById(R.id.tabs);
    }

    private void setupTabLayout() {
        fragmentOne = new FragmentOne();
        fragmentTwo = new FragmentTwo();

        allTabs.addTab(allTabs.newTab().setText("ONE"),true);
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
        allTabs.addTab(allTabs.newTab().setText("TWO"));
    }

    private void bindWidgetsWithAnEvent()
    {
        allTabs.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                setCurrentTabFragment(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {
            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {
            }
        });
    }

    private void setCurrentTabFragment(int tabPosition)
    {
        switch (tabPosition)
        {
            case 0 :
                replaceFragment(fragmentOne);
                break;
            case 1 :
                replaceFragment(fragmentTwo);
                break;
        }
    }

    public void replaceFragment(Fragment fragment) {
        FragmentManager fm = getSupportFragmentManager();
        FragmentTransaction ft = fm.beginTransaction();
        ft.replace(R.id.frame_container, fragment);
        ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
        ft.commit();
    }
}

XML:

<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">


    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        app:tabMode="scrollable"
        app:tabBackground="@color/colorPrimary"
        app:tabTextColor="#FFFF"
        app:tabSelectedTextColor="#FFFF"
        />

    <FrameLayout
        android:id="@+id/frame_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

1 个答案:

答案 0 :(得分:0)

以下是我对TabLayout的一些示例代码:

摇篮:

dependencies {
     compile 'com.android.support:support-v4:23.2.0'
     compile 'com.android.support:design:23.2.0'
}

主要活动:

private TabLayout tabLayout;
private ViewPager viewPager;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    viewPager = (ViewPager) findViewById(R.id.viewpager);
    setupViewPager(viewPager);

    tabLayout = (TabLayout) findViewById(R.id.tablayout);
    tabLayout.setupWithViewPager(viewPager);

}

private void setupViewPager(ViewPager viewPager) {
    ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
    adapter.addFragment(new PeopleFragment(), "People");
    adapter.addFragment(new PeopleFragment(), "Group");
    adapter.addFragment(new PeopleFragment(), "Calls");
    viewPager.setAdapter(adapter);
}

ViewPagerAdapter:

private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();

public ViewPagerAdapter(FragmentManager fm) {
    super(fm);
}

@Override
public Fragment getItem(int position) {
    return mFragmentList.get(position);
}

@Override
public int getCount() {
    return mFragmentList.size();
}

@Override
public CharSequence getPageTitle(int position) {
    return mFragmentTitleList.get(position);
}

public void addFragment(Fragment fragment, String title) {
    mFragmentList.add(fragment);
    mFragmentTitleList.add(title);
}

main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        />

    <android.support.design.widget.TabLayout
        android:id="@+id/tablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />

</android.support.design.widget.AppBarLayout>

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

 </android.support.design.widget.CoordinatorLayout>