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

我想要一个像这样的标签的例子

谷歌播放选项卡

我搜查,但刚刚得到这个。

viewpageindicator

我无法使用这个来源。 有人可以告诉我另一个滑动选项标签的例子。
我认为viewpageindicator是不一样的谷歌播放标签。

因为当我滚动谷歌播放页面下面的标签线移动,而在滚动,但在viewpageindicator它不是。

谢谢

Solutions Collecting From Web of "如何使用页面滑动视图创buildAndroid选项卡样式"

20159月13日发布的本文 ( 使用Tabs的Android Material Design )将指导您创build选项卡页面。

例如,创build固定标签

如果选项卡数量有限,则应使用固定的选项卡。 这些标签固定在位。 在androiddevise支持库中,很多像CoordinatorLayoutAppBarLayoutTabLayout等新元素都被引入。 我不会涵盖所有这些,因为这不是本文的议程。

打开主要活动的布局文件( activity_main.xml )并添加下面的布局代码。

app:tabMode – 定义选项卡布局的模式。 在我们的情况下,价值应该是“固定的”

activity_main.xml中

 <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" 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.ActionBar"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:layout_scrollFlags="scroll|enterAlways" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabMode="fixed" app:tabGravity="fill"/> </android.support.design.widget.AppBarLayout> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> </android.support.design.widget.CoordinatorLayout> 

打开MainActivity.java并执行以下更改。

tabLayout.setupWithViewPager() – 将ViewPager分配给TabLayout。

setupViewPager() – 通过设置适当的片段和选项卡名称来定义选项卡的数量。

ViewPagerAdapter – 自定义适配器类提供视图寻呼机所需的片段。 MainActivity.java

 package info.androidhive.materialtabs.activity; import android.os.Bundle; import android.support.design.widget.TabLayout; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import java.util.ArrayList; import java.util.List; import info.androidhive.materialtabs.R; import info.androidhive.materialtabs.fragments.OneFragment; import info.androidhive.materialtabs.fragments.ThreeFragment; import info.androidhive.materialtabs.fragments.TwoFragment; public class MainActivity extends AppCompatActivity { private Toolbar toolbar; private TabLayout tabLayout; private ViewPager viewPager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); getSupportActionBar().setDisplayHomeAsUpEnabled(true); viewPager = (ViewPager) findViewById(R.id.viewpager); setupViewPager(viewPager); tabLayout = (TabLayout) findViewById(R.id.tabs); tabLayout.setupWithViewPager(viewPager); } private void setupViewPager(ViewPager viewPager) { ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager()); adapter.addFragment(new OneFragment(), "ONE"); adapter.addFragment(new TwoFragment(), "TWO"); adapter.addFragment(new ThreeFragment(), "THREE"); 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 addFragment(Fragment fragment, String title) { mFragmentList.add(fragment); mFragmentTitleList.add(title); } @Override public CharSequence getPageTitle(int position) { return mFragmentTitleList.get(position); } } } 

现在运行应用程序。 您应该能够在选项卡之间看到显示的滑动function。

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

然后在主要活动中膨胀此布局,确保您的活动实施

android.support.v7.app.ActionBar.TabListener比方说,你想有4个选项卡,然后创build

4个不同的片段。 创build一个通用的适配器来促进这些片段的基础上

您select的标签。

下面是代码片段的简单例子, http://www.feelzdroid.com/2014/10/android-action-bar-tabs-swipe-views.html

注意:上面的例子适用于android支持lib,它提供了向后的actionbar

兼容早期版本的Android手机

希望能帮助到你。

谢谢

当我实施了类似的东西的时候,我已经用更好的方式做了,就上课而言。 我在一个名为working的包里创build了适配器。

以下是代码:

 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; } } 

然后,您需要在我给出的示例中创build一个名为WorkingFragment的新类。 为了干净的编码,我在主包中创build了这个类。

以下是片段的代码:

 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 ,您需要将function从一个标签更改为另一个标签。 在我的情况下,我已经把它包括在主包中。

以下是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) { } } 

希望这可以帮助你为你的应用程序实现必要的function:)

简单的方法来处理片段标签

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

在创造,然后

 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>