片段之间的Android标签导航

Question

我想知道以下屏幕中的这些导航选项卡是如何实现的：

http://s1.directupload.net/images/user/140803/6pg9mpk7.png

由于这些导航选项卡已在手机的多个菜单中使用，因此它应该是标准的android布局项。 他们使用FragmentTabHost吗？ 如果是，您如何设法像这样标记选定的选项卡？ 我刚刚找到了解决方案，其中所选选项卡带有下划线标记。

如果有人可以提供解释或教程链接会很不错。

提前致谢。

Answer 1

您需要创建一个xml文件，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"/>
    </LinearLayout>
</TabHost>

对于每个图标，您需要创建以下xml布局文件：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- When selected, use grey -->
    <item android:drawable="@drawable/photos_gray"
          android:state_selected="true" />
    <!-- When not selected, use white-->
    <item android:drawable="@drawable/photos_white" />
</selector>

可绘制对象必须位于drawables文件夹中。

该活动的编码应类似于以下代码：

公共类AndroidTabLayoutActivity扩展了TabActivity {

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        TabHost tabHost = getTabHost();

        // Tab for Groups
        TabSpec groupSpec = tabHost.newTabSpec("Gruppen");
        // setting Title and Icon for the Tab
        photospec.setIndicator("Photos", getResources().getDrawable(R.drawable.icon_photos_tab));
        Intent photosIntent = new Intent(this, GroupActivity.class);
        photospec.setContent(photosIntent);

        // Tab for Telephones
        TabSpec telephoneSpec = tabHost.newTabSpec("Telefon");        
        songspec.setIndicator("Songs", getResources().getDrawable(R.drawable.icon_songs_tab));
        Intent songsIntent = new Intent(this, TelephoneActivity.class);
        songspec.setContent(songsIntent);

        // Tab for Contacts
        TabSpec contactSpec = tabHost.newTabSpec("Kontacte");
        videospec.setIndicator("Videos", getResources().getDrawable(R.drawable.icon_videos_tab));
        Intent videosIntent = new Intent(this, ContactActivity.class);
        videospec.setContent(videosIntent);

        // Adding all TabSpec to TabHost
        tabHost.addTab(groupSpec);
        tabHost.addTab(telephoneSpec);
        tabHost.addTab(contactSpec);
    }
}

最后，您需要为每个选项卡创建两个文件（xml和类）：

public class KontactActivity extends Activity {
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.kontacte_layout);
    }
}

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

  <TextView android:text="Contacts here"
            android:padding="15dip"
            android:textSize="18dip"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>

</LinearLayout>

Answer 2

所以几天前我找到了解决方案。 我使用本教程来实现这些选项卡：

http://maxalley.wordpress.com/2013/05/18/android-creating-a-tab-layout-with-fragmenttabhost-and-fragments/

有很多类似的教程，但是如果您使用的Holo.Light主题却很少被提及，就会出现问题。 那里的问题是图像只是不显示在选项卡中，而您只能看到文本。

要解决此问题，我必须确保在style.xml中包含此主题的Tab.Widget：

<style name="MyAppTheme" parent="@android:style/Theme.Holo.Light">
    <item name="android:tabWidgetStyle">@android:style/Widget.TabWidget</item>
</style>

现在，即使当我使用Holo.Light时，也会显示选项卡的图像。 如果您使用的是Theme.Black或Light，则不应顺便出现此问题。

我找到了这个解决方案，这要归功于Andrei Buneyeu对这个老问题的答案： Tab中的图标未显示