如何使用页面滑动视图创建Android选项卡样式

26

我想要一个像这样的选项卡示例:

谷歌Play选项卡

我尝试搜索,但只得到了这个。

viewpageindicator

我无法使用这个资源。有人可以告诉我另一个带有滑动选项的选项卡示例吗?
我认为viewpageindicator与谷歌Play选项卡不同。

因为当我在谷歌Play页面上滚动时,选项卡下方的线条会随着滚动而移动,但在viewpageindicator中不会。

谢谢


查看这个链接: https://androidbeasts.wordpress.com/2015/08/11/tabs-with-swipe-views/#more-79 - Aakash
@Person 为什么你不把Alex Jolig的回答标记为最佳答案? - IntoTheDeep
请查看此链接 https://ps06756.wordpress.com/2016/12/04/how-to-implement-tabs-in-android/。 - Pratik Singhal
3个回答

3

首先,您需要使用viewpager android.support.v4.view.ViewPager创建一个xml布局文件。

然后在主活动中填充此布局,确保您的活动实现了

android.support.v7.app.ActionBar.TabListener。假设您想要有4个选项卡,则创建

4个不同的片段。创建一个通用适配器来根据所选的选项卡方便这些片段。


1
简单的处理碎片标签的方法。
    viewPager = (ViewPager) findViewById(R.id.viewpager);
    setupViewPager(viewPager);

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

在onCreate中,然后。
private void setupViewPager(ViewPager viewPager) {
        ViewPagerAdapter adapter = new 
        ViewPagerAdapter(getSupportFragmentManager());        
        adapter.addFrag(new RootDetailFragment(), "TAB 1");
        adapter.addFrag(new ShiftDetailFragment(), "TAB 2");        
        viewPager.setAdapter(adapter);
}


class ViewPagerAdapter extends FragmentPagerAdapter {
    private final List<Fragment> mFragmentList = new ArrayList<>();
    private final List<String> mFragmentTitleList = new ArrayList<>();

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

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

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

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

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

在布局文件中添加。
 <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#000"
        app:tabGravity="fill"
        app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>

1
当我实现类似的东西时,我以更好的方式完成了它,即使用类。我在名为working的包中创建了适配器。
下面是代码:
public class TabsPagerAdapter extends FragmentPagerAdapter {

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

    @Override
    public Fragment getItem(int index) {

        switch (index) {
        case 0:
          return new WorkingFragment();
        //You can add as many fragments as you wish here by adding the cases and calling the different fragments.
        }      
        return null;
    }

    @Override
    public int getCount() {
        // get item count - equal to number of tabs. 4 is only the number of fragments I had used.
        return 4;
    }
}

你需要创建一个名为 WorkingFragment 的新类,具体示例中会给出。为了编写干净的代码,我在主要包中创建了这个类。
以下是片段的代码:
public class NewEventFragment extends Fragment {

    View rootView;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    //reference the xml file containing the view with all the code here.
    }
}

MainActivity中,您需要实现从一个选项卡切换到另一个选项卡的功能。在我的情况下,我已将其包含在主包中。
下面是MainActivity类的代码:
public class MainActivity extends FragmentActivity implements ActionBar.TabListener {

    private ViewPager ViewPager;
    private TabsPagerAdapter SectionsPagerAdapter;
    private ActionBar actionBar;

    //Include the name for the tabs in this array. Make sure the number of elements in this string matches the number of views you will have in your app. 
    private String[] tabs = {};

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

     // Initialisation
        ViewPager = (ViewPager) findViewById(R.id.pager);
        actionBar = getActionBar();
        SectionsPagerAdapter = new TabsPagerAdapter(getSupportFragmentManager());

        ViewPager.setAdapter(SectionsPagerAdapter);
        actionBar.setHomeButtonEnabled(false);
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 

     // Adding Tabs
        for (String tab_name : tabs) {
            actionBar.addTab(actionBar.newTab().setText(tab_name).setTabListener(this));
        }

        ViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {
                // on changing the page
                // make respected tab selected
                actionBar.setSelectedNavigationItem(position);
            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
            }

            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });
    }

    @Override
    public void onTabReselected(Tab tab, android.app.FragmentTransaction ft) {

    }

    @Override
    public void onTabSelected(Tab tab, android.app.FragmentTransaction ft) {
        ViewPager.setCurrentItem(tab.getPosition());

    }

    @Override
    public void onTabUnselected(Tab tab, android.app.FragmentTransaction ft) {
    }
} 

希望这能帮助您实现应用程序所需的功能 :)

不错的回答,但得票最高的那个更清晰。 - Ali Bdeir

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接