如何将控件添加到 Android 中的选项卡布局？

Question

我正在关注本教程https://developer.android.com/guide/tutorials/views/hello-tabwidget.html 并已完成。现在我实际上想在这些选项卡中添加一些控件，例如文本框（文本编辑）。

我该怎么做？我使用 eclipse 作为我的 ide 转到我的 mail.xml 并转到布局视图，现在我得到一个 NullPointerException，所以我什至不能再将东西拖到布局上。

编辑

这就是我所拥有的

<?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
                android:orientation="vertical"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent">            
                <TextView 
                android:id="@+id/textview1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" 
                android:text="this is a tab" />
                <EditText android:text="" android:id="@+id/EditText01" android:layout_width="wrap_content" android:layout_height="wrap_content" android:password="true"></EditText>

            </LinearLayout>

            <TextView 
                android:id="@+id/textview2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" 
                android:text="this is another tab" />
            <TextView 
                android:id="@+id/textview3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" 
                android:text="this is a third tab" />
        </FrameLayout>
    </LinearLayout>
</TabHost>

Answer 1

选项卡刚开始工作有点有趣，因为有很多代码开销，但是一旦你按照自己的方式工作，它们就不会太糟糕了。要让标签正常工作，让我们从改进您的 XML 文件开始，然后我们可以确保实际加载它们的代码是正确的。

首先，您的 XML 文件。您应该使用 include 功能，而不是将所有内容直接包含在 main.xml 中。顾名思义，这使您可以处理一个单独的 xml 文件，然后用一行将其包含在您的主文件中。这使得 main.xml 文件更易于阅读。所以我们会修改你上面的文件，使它看起来像这样：

//No need to change anything above this
<FrameLayout
    android:id="@android:id/tabcontent"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <include layout="@layout/tab1"/>
    <include layout="@layout/tab2"/>
    //and however many other tabs you want to include

</FrameLayout>

然后您需要创建 tab1.xml、tab2.xml 等等。这些是普通的 xml 文件，因为它们以包含任意数量的其他小部件的 ViewGroup（即 LinearLayout、RelativeLayout）开头。这些小部件可以是 EditText、按钮、自定义视图等任何您想要的东西。唯一的规则是父 ViewGroup（顶部的那个）必须有一个唯一的 ID，以android:id="@+id/someUniqueName" 的方式。您将使用它来引用代码中的特定布局/选项卡。例如，这将是：

tab1.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:id="@+id/tab1Layout"
    android:orientation="vertical">

    <TextView ... />
    <EditText ... />
</LinearLayout>

完成后，我们可以查看您的代码。我假设你可能已经得到了这个，但以防万一这是你想要的：

public class YourProject extends TabActivity {

    @Override
    public void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        Resources res = getResources();
        TabHost tabHost = getTabHost();

        tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("Tab1 title",
                res.getDrawable(R.drawable.logo1)).setContent(R.id.tab1Layout));

        (...)

        //You can also fill tabs with a separate activity like so:
        Intent intent = new Intent(this, YourClass.class);
        tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("Another title",
                res.getDrawable(R.drawable.logo2)).setContent(intent));

        tabHost.setCurrentTab(0);
    }
}

如上所示，您可以将其中一个选项卡的内容设置为单独的活动。在这种情况下，活动被定义为具有自己的类、布局等的任何其他活动。通常你不应该这样做，而只是使用不同的视图（使用setContent(R.id.tabXLayout)，但有时需要它。例如，如果如果您希望其中一个选项卡有一个列表，那么您需要在其中启动一个扩展 ListView 的活动，并包含 ListViews 的所有样板代码。

希望对你有帮助！

Answer 2

Eclipse 中的布局视图可能有点不稳定，尤其是对于复杂的布局。一些试验和错误可能会发现它阻塞的 View 节点。

关于进一步开发基于选项卡的布局，您有两种选择，“快速”方式或“正确”方式。首先是通过将其中一个 TextViews 替换为包含您想要的内容的 LinearLayout（或其他一些布局）来调整现有的布局 xml。

http://google.com/codesearch/p?hl=en#HQNWZ1u2Pig/trunk/HelloLayoutAndroid/res/layout/tab_widget.xml

但是，标签通常用于内容复杂的地方。为了可扩展性，最好在布局中定位 TabHost，调用 newTabSpec()，然后使用 setContent() 提供标识内部 Activity 的 Intent，该内部 Activity 提供自己的布局。

Answer 3

包含在解析 XML 时经常会出现问题，我尝试过并得到：无法解析 @layout/mylayout.. 我的代码是 100% 正确的，但是如果您需要 Id 作为布局和其他属性，这是一个常见的问题。 示例： 我通过设计模式解决了这个问题，当您将 tabhost 放到布局中时，将其放置在您想要的任何位置，它会在 XML 编辑器上创建 3 个线性布局（tab1、tab2、tab3）...在每个选项卡（leanearlayout）中插入您需要用作选项卡内容的控件的标记。 并在 java 文件中执行下一个：

  TabHost tabHost = (TabHost)findViewById(R.id.tabHost);
    tabHost.setup();
    TabHost.TabSpec tab1 = tabHost.newTabSpec("smil1");
    TabHost.TabSpec tab2 = tabHost.newTabSpec("smil2");
    TabHost.TabSpec tab3 = tabHost.newTabSpec("smil3");
    tab1.setIndicator("#1");//the name will apear on the first tab
    tab1.setContent(R.id.smiles1); // the Id of the control you put in the first LeanerLayout

    tab2.setIndicator("#2"); // the same as abouv but for the second tab
    tab2.setContent(R.id.smiles2);
    tab3.setIndicator("#3"); // the thierd tab
    tab3.setContent(R.id.smiles3);
    // add the tabs
    tabHost.addTab(tab1);
    tabHost.addTab(tab2);
    tabHost.addTab(tab3);

如果包含在解析 XML 时出现问题，这就是解决问题的方法。

Answer 4

布局编辑器中的NullPointerException 是Android 开发工具中的known bug。