既然 TabHosts 已被弃用，如何在 Android 中实现选项卡？

Question

我正在尝试以与 Instagram 应用 相似的外观和感觉实现五个标签。现在不推荐使用 TabHost 和 TabActivity 的最佳做法是什么？

我希望在屏幕顶部（操作栏下方）有五个选项卡，每个选项卡都有一个表示该选项卡内容的可绘制对象。

由于选项卡将始终显示，我希望将它们放在一个活动中。然而，每个选项卡的内容将取决于按下了哪个选项卡。因此，我希望在加载片段的选项卡下方的同一 Activity 中有一个视图，一次一个，具体取决于按下的哪个。

总结一下： 我希望有一个一个活动，顶部有标签，下面有一个视图，我在其中一次加载五个不同片段之一。

请帮助我在不使用已弃用的类的情况下实现这一点:)

Answer 1

您可以使用这两个新类来创建标签SlidingTabLayout、SlidingTabStrip，您必须将带有一些片段的 ViewPager 传递给此类，对于每个标签上的自定义视图，请使用 setCustomTabView。你可以用谷歌找到例子。

编辑：

对于自定义布局（我的包含图像和文本），像这样设置您的标签：

slideTab = (SlidingTabLayout) findViewById(R.id.getbook_sliding_tabs);
slideTab.setDistributeEvenly(true);
slideTab.setCustomTabView(R.layout.cat_tab_layout, R.id.main_tab_title);

cat_tab_layout：

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="6dip"
    android:background="@drawable/cat_tab_background">

    <ImageView
        android:id="@+id/main_tab_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/cat_all_book_icon"
        android:layout_centerHorizontal="true"/>

    <TextView
        android:id="@+id/main_tab_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="tab1"
        android:textColor="@color/medium_gray"
        android:layout_below="@id/main_tab_image"
        android:layout_centerHorizontal="true"/>

</RelativeLayout>

对populateTabStrip() 形式的SlidingTabLayout 类进行一些更改：

adapter = (GetBookFragmentPagesAdapter)mViewPager.getAdapter();// get your view pager adapter
for (int i = 0; i < adapter.getCount(); i++) {
....
if (mTabViewLayoutId != 0) {
    // If there is a custom tab view layout id set, try and inflate it
    tabView = LayoutInflater.from(getContext()).inflate(mTabViewLayoutId, mTabStrip, false);
    tabTitleView = (TextView) tabView.findViewById(mTabViewTextViewId);

    ImageView tabImage = (ImageView)tabView.findViewById(R.id.main_tab_image);
    tabImage.setImageResource(adapter.getImages(i)); // getImage() return image id for each tab

}

....

那么你最终会得到这样的结果：

Answer 2

我正在尝试以与 Instagram 应用相似的外观和感觉实现五个标签

由于不是每个人都使用 Instagram，因此将来请在某处发布您想要的内容的屏幕截图，并从您的问题中链接到它。

我希望有一个 Activity，其顶部有选项卡，下方有一个视图，我在其中一次加载五个不同片段之一。

Use FragmentTabHost。或者，使用 ViewPager 和选项卡式指示器（例如，TabPageIndicator 与来自 the ViewPagerIndicator library 的 IconPagerAdapter）。