FragmentTabHost 内容填充剩余空间

Question

我一直在尝试在 android 上使用标签导航，但我无法正确设置内容区域。 应用布局：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.app.FragmentTabHost
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tabhost"
android:tag="tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:tag="linear">

        <TabWidget
            android:id="@+id/tabs"
            android:tag="tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >
        </TabWidget>
           <FrameLayout
            android:id="@+id/tabFrameLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
        />
    </RelativeLayout>
</android.support.v4.app.FragmentTabHost>

片段：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/info_drawer_root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#e0e0e0">

    <FrameLayout
        android:id="@+id/info_content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Fragment info"
        android:id="@+id/info_textView"
        android:layout_gravity="center_horizontal" />
    </FrameLayout>

    <ListView android:id="@+id/info_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp"
        android:background="#111"/>
</android.support.v4.widget.DrawerLayout>

以及我在活动中使用的代码：

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    tabHost = (FragmentTabHost)findViewById(R.id.tabhost);
    tabHost.setup(this, getSupportFragmentManager(), R.id.tabFrameLayout);

    tabHost.addTab(tabHost.newTabSpec("Tab 0").setIndicator("", getResources().getDrawable(R.drawable.ic_launcher)), InfoFragment.class, null);
    tabHost.addTab(tabHost.newTabSpec("Tab 1").setIndicator("Tab 1"), HomeFragment.class, null);
    tabHost.addTab(tabHost.newTabSpec("Tab 2").setIndicator("", getResources().getDrawable(R.drawable.ic_launcher)), AppsFragment.class, null);
}

这会产生以下结果：

如您所见，内容区域与选项卡重叠。我只是希望它位于它们下方并像这样填充剩余空间：

我尝试将它们包装在 RelativeLayout 标记中并应用以下属性，但它不起作用。我也尝试过使用 weight 属性，但没有任何运气。

谢谢。

Answer 1

您不需要在 Tabhost 中包含 FrameLayout，当您这样做时，您将相同的空间用于片段的内容和选项卡本身。

只需将 TabHost 放在一个垂直的 LinearLayout 内，然后将 FrameLayout 放在 TabHost 下方。

就像这样：

<?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">

    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TabWidget 
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"/>
    </android.support.v4.app.FragmentTabHost>

    <FrameLayout 
        android:id="@+id/realtabcontent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />

</LinearLayout>

Answer 2

抱歉，我无法详细介绍您的具体代码，但如果您只是第一次尝试实现它，我会采用这种方法，它真的很容易理解和管理。代码很简单，可以满足我的所有需求。

您只需为 3 个（或其他）片段制作自己的布局文件，如下所示：

片段的布局文件：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_margin="15sp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Notebook"
        android:id="@+id/tv_hdl_tab3"
        android:textColor="@android:color/holo_blue_light"
        android:textSize="@dimen/dim_hdl_h1" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceMedium"
    android:text="@string/tab3_introText"
    android:id="@+id/tv_tab3_IntroText"
    android:layout_marginTop="5sp"
    android:layout_marginBottom="5sp"
    android:textSize="@dimen/dim_txt_p" />

主活动：

public class MainActivity extends Activity {
ActionBar.Tab tab1, tab2, tab3;
Fragment fragmentTab1 = new FragmentTab1();
Fragment fragmentTab2 = new FragmentTab2();
Fragment fragmentTab3 = new FragmentTab3();

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_tab_test);

    ActionBar actionBar = getActionBar();
    actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

    tab1 = actionBar.newTab().setText("Home");
    tab2 = actionBar.newTab().setText("Calculator");
    tab3 = actionBar.newTab().setText("Notebook");

    tab1.setTabListener(new MyTabListener(fragmentTab1));
    tab2.setTabListener(new MyTabListener(fragmentTab2));
    tab3.setTabListener(new MyTabListener(fragmentTab3));

    actionBar.addTab(tab1);
    actionBar.addTab(tab2);
    actionBar.addTab(tab3);
}

然后一个片段看起来像这样（当然，其中 3 个，每个选项卡一个，只要它应该不同）：

public class FragmentTab3 extends Fragment {
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
    View view = inflater.inflate(R.layout.tab3, container, false);
    TextView textview = (TextView) view.findViewById(R.id.tabtextview);
    textview.setText(R.string.Three);
    return view;
}

}

还有 Tablistener：

public  class MyTabListener  implements ActionBar.TabListener {
Fragment fragment;


public MyTabListener(Fragment fragment) {
    this.fragment = fragment;
}


public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
    ft.replace(R.id.fragment_container, fragment);
}

public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {
    ft.remove(fragment);
}

public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {
    // nothing done here
}

}

代码来自http://www.linux.com/learn/tutorials/761642-android-app-development-for-beginners-navigation-with-tabs