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

好運