2012-03-14 94 views
5

用SherlockActionBar創建了一個不錯的界面。在橫向模式中,您可以看到listfragment和「detailsfragment」。Viewpageindicator裏面的片段

現在我想一個加detailsframe內viewpageindicator(https://github.com/JakeWharton/Android-ViewPagerIndicator),所以我想是這樣的:

--------------------------| 
|_1___|TAB1 | TAB2 | ETC | 
|_2___|-------------------| 
|_3___|Example: content | 
|_4___| TAB1 of listitem 1| 
|_5___|___________________| 

我希望這是顯而易見的。所以基本上我會在片段內的一個FragmentManager/TabPageIndicator。

我可能嗎?我無法弄清楚.. :(

謝謝!

+0

所以你有一個左側的ListViewFragment? 然後每個ListView項目將加載一個不同的RHS片段,其中包含:TabPageIndicator和ViewPager? – 2012-03-14 10:21:06

回答

6

您不應將Fragment放在Fragment的內部。然而,您可以在片段中放入ViewPager並獲得您要查找的結果。

我前段時間面對同一個問題,我的一個應用程序(只有我想要ViewPager包含一些ListView s)。這是最終的結果(見線,紅色含有Fragment,藍色ViewPagerIndicator,綠色ViewPager):

Example ViewPager inside a Fragment

我做到了這一點與下面的步驟。拳,對於細節的片段,我創建了下面的XML文件:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 

    <com.viewpagerindicator.TabPageIndicator 
     android:id="@+id/viewpagerIndicator" 
     android:layout_height="wrap_content" 
     android:layout_width="match_parent" /> 
    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" /> 

</LinearLayout> 

然後,我設置了一個自定義PagerAdapter填充ViewPager和TabPageIndicator:

public class MainPagerAdapter extends PagerAdapter implements TitleProvider { 

    // constructor 
    ...   

    @Override 
    public void destroyItem(ViewGroup container, int position, Object object) { 
     // remove the object (we don't want to keep it in memory as it will get recreated and cached when needed) 

     ViewPager viewPager = (ViewPager) container; 
     View view = (View) object; 
     viewPager.removeView(view); 
    } 

    @Override 
    public Object instantiateItem(View pager, final int position) { 
     // inflate your 'content'-views here (in my case I added a listview here) 
     // similar to a listadapter's `getView()`-method 

     View wrapper = ... // inflate your layout 
     ... // fill your data to the appropriate views 

     ((ViewPager) pager).addView(wrapper); 
    } 

    public String getTitle(int position) { 
     ... // return the title of the tab 
    } 
} 

接下來,在我的片段,我設置了以下內容:

public class MainFragment extends Fragment { 

    private MainPagerAdapter pagerAdapter; 
    private TabPageIndicator mIndicator; 
    private ViewPager viewPager; 

    @Override 
    public void onActivityCreated(Bundle savedInstanceState) { 
     super.onActivityCreated(savedInstanceState); 

     View detailsFrame = context.findViewById(R.id.details_fragment); 
     // setup your adapter: pass data, etc. 
     this.pagerAdapter = new MainPagerAdapter(...); 
     this.viewPager = (ViewPager) context.findViewById(R.id.viewpager); 
     viewPager.setAdapter(pagerAdapter); 

     this.mIndicator = (TabPageIndicator) context.findViewById(R.id.viewpagerIndicator); 
     this.mIndicator.setViewPager(viewPager); 
    } 
} 
+1

優秀的答案! – 2012-03-14 16:29:05

+0

你好,請提供完整的代碼..我無法理解在某種程度上先謝謝 – VENKI 2014-08-26 13:28:20

+0

@Reinier,這是什麼查看detailsFrame = context.findViewById(R.id.details_fragment);它代表什麼? i.d在哪個佈局中放置? – 2015-06-10 22:03:04