PagerSlidingTabStrip实施指南

Question

我想在我的应用程序来使用这个库：https://github.com/astuetz/PagerSlidingTabStrip

我读的文件，但我不明白anything.I有两个片段，我想两个标签放置到我的app.Where我把viewpager XML？

我在哪里可以把这个代码块：

// Initialize the ViewPager and set an adapter 
ViewPager pager = (ViewPager) findViewById(R.id.pager); 
pager.setAdapter(new TestAdapter(getSupportFragmentManager())); 

// Bind the tabs to the ViewPager 
PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs); 
tabs.setViewPager(pager); 

只是主要活动或所有片段和主要活动？ （我对viewpager xml有同样的问题）任何人都可以向我解释我如何一步一步地将其实现到我的应用程序？

Ps：https://github.com/astuetz/PagerSlidingTabStrip/tree/master/sample这是示例代码。

Answer 1

步步

我只是让两个选项卡，你问！

0）的库添加到您的构建路径

1）创建两个片段

public class FragmentA extends Fragment { 
    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 
     return inflater.inflate(R.layout.fragment_a,container,false); 
    } 
} 

和

public class FragmentB extends Fragment { 
    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 
     return inflater.inflate(R.layout.fragment_b,container,false); 
    } 
} 

及其布局例如可以是：

<?xml version="1.0" encoding="utf-8"?> 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" android:layout_height="match_parent" 
    android:background="#FFFF00"> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textAppearance="?android:attr/textAppearanceLarge" 
     android:text="This is Fragment A" 
     android:id="@+id/textView" 
     android:gravity="center" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentBottom="true" /> 
</RelativeLayout> 

2）创建MainActivity布局：

<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" > 

    <com.astuetz.PagerSlidingTabStrip 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="48dip" 
     /> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/pager" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/tabs" 
     tools:context=".MainActivity" /> 

</RelativeLayout> 

3）创建viewpager适配器

public class MyPagerAdapter extends FragmentPagerAdapter { 

    public MyPagerAdapter(FragmentManager fm) { 
     super(fm); 
    } 
    @Override 
    public CharSequence getPageTitle(int position) { 
     return (position == 0)? "Tab 1" : "Tab2" ; 
    } 
    @Override 
    public int getCount() { 
     return 2; 
    } 
    @Override 
    public Fragment getItem(int position) { 
     return return (position == 0)? new FragmentA() : new FragmentB() ; 
    } 
} 

3）在指定适配器与viewpager和viewpager到PagerSlidingTabStrip MainActivity

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

     ViewPager pager = (ViewPager) findViewById(R.id.pager); 
     pager.setAdapter(new MyAdapter(getSupportFragmentManager())); 

     // Bind the tabs to the ViewPager 
     PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs); 
     tabs.setViewPager(pager); 
    } 

4）运行

Answer 2

你的布局文件将在顶部和底部的ViewPager标签如下图所示的代码片段：

<com.astuetz.PagerSlidingTabStrip 
    android:id="@+id/tabs" 
    app:pstsShouldExpand="true" 
    app:pstsTextAllCaps="true" 
    android:layout_width="match_parent" 
    android:layout_height="48dp"> 
</com.astuetz.PagerSlidingTabStrip> 


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

创建片段

create fragment [re s/layout/fragment_page.xml]并复制并粘贴此代码

<TextView 
android:id="@+id/tvTitle" 
android:text="Fragment #X" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:gravity="center" /> 

在PageFragment中。java的定义通货膨胀逻辑的选项卡的内容片断部分：

public class PageFragment extends Fragment { 
private int mPage; 
public static final String ARG_PAGE = "ARG_PAGE"; 

public static PageFragment newInstance(int page) { 
    Bundle args = new Bundle(); 
    args.putInt(ARG_PAGE, page); 
    PageFragment fragment = new PageFragment(); 
    fragment.setArguments(args); 
    return fragment; 
} 

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

// Inflate the fragment layout we defined above for this fragment 
// Set the associated text for the title 
@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 
    View view = inflater.inflate(R.layout.fragment_page, container, false); 
    TextView tvTitle = (TextView) view.findViewById(R.id.tvTitle); 
    tvTitle.setText("Fragment #" + mPage); 
    return view; 
} 

实施FragmentPagerAdapter

接下来要做的是实现控制选项卡的顺序为您ViewPager适配器。

public class SampleFragmentPagerAdapter extends FragmentPagerAdapter{ 


final int PAGE_COUNT = 3; 
private String tabTitles[] = new String[] { "Tab1", "Tab2", "Tab3" }; 

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

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

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

@Override 
public CharSequence getPageTitle(int position) { 
    // Generate title based on item position 
    return tabTitles[position]; 
}} 

设置滑动标签

最后，我们需要把我们的ViewPager连接到SampleFragmentPagerAdapter，然后用两个步骤配置滑动标签：

在OnCreate（）的方法你的活动，找到ViewPager并连接适配器。

在PagerSlidingTabStrip上设置ViewPager以将寻呼机与选项卡连接。

public class MainActivity extends FragmentActivity { 

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

    // Get the ViewPager and set it's PagerAdapter so that it can display items 
    ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); 
    viewPager.setAdapter(new SampleFragmentPagerAdapter(getSupportFragmentManager())); 

    // Give the PagerSlidingTabStrip the ViewPager 
    PagerSlidingTabStrip tabsStrip = (PagerSlidingTabStrip) findViewById(R.id.tabs); 
    // Attach the view pager to the tab strip 
    tabsStrip.setViewPager(viewPager); 
}} 

这是结果

了解更多信息，请查看以下link

好运