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需要位于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和class）：

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对这个老问题的回答，我找到了这个解决方案： Icon in Tab is not showing up

片段之间的Android选项卡导航

2 个答案: