android选项卡:在顶部写文字

时间:2011-11-15 05:53:38

标签: android tabs

我正在android中实现标签布局。我能够实现制表符,但我的实现提供了以下输出:

enter image description here

在此图像中,文本“标签1”“标签2”“标签3”全部写在标签的底部。我希望它写在顶部。我已经使用了android:gravity="top"以及android:layout_gravity="top"但我没有做任何事情。请帮忙。我正在使用以下布局:

    <?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+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"
        android:padding="5dp"
         android:gravity="top"
           android:layout_gravity="top"
        >
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" 
            android:gravity="top"
            android:layout_gravity="top"
            />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:padding="5dp" />
    </LinearLayout>
</TabHost>

请帮忙。

1 个答案:

答案 0 :(得分:1)

我们可以通过使用自定义视图设置TabSpec内容来实现此目的。这是示例。

在main.xml中

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

    <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">
            <View android:layout_width="fill_parent" android:layout_height="0.5dip"
                android:background="#000" />
            <TabWidget android:id="@android:id/tabs"
                android:layout_width="fill_parent" android:layout_height="wrap_content"
                android:layout_marginLeft="0dip" android:layout_marginRight="0dip" />
            <View android:layout_width="fill_parent" android:layout_height="2dip"
                android:background="#696969" />
            <View android:layout_width="fill_parent" android:layout_height="2dip"
                android:background="#000" />
            <FrameLayout android:id="@android:id/tabcontent"
                android:layout_width="fill_parent" android:layout_height="fill_parent" />
        </LinearLayout>
    </TabHost>

</LinearLayout>

在tabs_bg.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tabsLayout" android:layout_width="fill_parent"
    android:layout_height="fill_parent" android:background="@drawable/tab_bg_selector"
    android:padding="10dip" android:gravity="center" android:orientation="vertical">

    <TextView android:id="@+id/tabsText" android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:text="Title"
        android:textSize="15dip" android:textColor="@drawable/tab_text_selector" />
</LinearLayout>

我使用一些自定义选择器进行查看,您可以自己创建。

在活动Main.class中,

private TabHost mTabHost;

private void setupTabHost() {
    mTabHost = (TabHost) findViewById(android.R.id.tabhost);
    mTabHost.setup();
}

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

    setupTabHost();
    mTabHost.getTabWidget().setDividerDrawable(R.drawable.tab_divider);

    setupTab(new TextView(this), "Tab 1");
    setupTab(new TextView(this), "Tab 2");
    setupTab(new TextView(this), "Tab 3");
}

private void setupTab(final View view, final String tag) {
    View tabview = createTabView(mTabHost.getContext(), tag);

    TabSpec setContent = mTabHost.newTabSpec(tag).setIndicator(tabview).setContent(new TabContentFactory() {
        public View createTabContent(String tag) {return view;}
    });
    mTabHost.addTab(setContent);

}

private static View createTabView(final Context context, final String text) {
    View view = LayoutInflater.from(context).inflate(R.layout.tabs_bg, null);
    TextView tv = (TextView) view.findViewById(R.id.tabsText);
    tv.setText(text);
    return view;
}

提供这样的输出...... enter image description here