Question

我试图创建一个标签主机，如附带的屏幕截图所示，但是图标图像和文本对齐有问题 - 图像需要在文本上方对齐，但所有尝试都失败;

我已经包含了一些示例代码但是我无法强制图像顶部对齐文本 - 它只有在我将tab_indicator文件中的layout_height增加到大于66dip但我在空间和提供的图像中受限时才有效。如果您无法看到图像/链接，则图像不会强制在文本上方，因此图像的一部分位于文本后面！

tab_indicator.xml

    <?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="88.0dip"
    android:layout_height="66.0dip"
    android:layout_weight="1.0">

    <include layout="@layout/tab_indicator_portrait" />

</FrameLayout>

tabindicator_protrait.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tab_indicator_portrait"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:paddingBottom="3.0dip"
    android:paddingTop="3.0dip" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top|center"
        android:layout_marginTop="3.0dip" />

    <TextView
        android:id="@+id/title"
        style="?android:attr/tabWidgetStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center"
        android:textColor="@color/tab_indicator_text"
        android:textSize="12.0dip" />

</FrameLayout>

tab_host.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:id="@+id/topLayout"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:padding="0.0dip" >

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0.0dip"
            android:layout_weight="1.0" />

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_margin="0dip"
            android:padding="0dip" />
    </LinearLayout>

</TabHost>

我有这样设置的原因有几个原因;

tab_indicator.xml文件还可以包含横向文件，如果我需要处理不同的格局，即根据市场反馈/测试进一步发布
允许应用程序具有通用外观，因为我只希望当用户在选项卡之间移动时更改图标 - 4.0.4中的tabhost存在问题，这似乎是一种更清晰的处理方式。

我在TabActivity中尝试了一些代码来根据屏幕大小处理布局大小;

private void detectScreen()
{
    Display localDisplay = getWindowManager().getDefaultDisplay();

    if (localDisplay.getWidth() < localDisplay.getHeight())
    {
        int dips = 45;
        TabHost localTabHost = getTabHost();
        DisplayMetrics localDisplayMetrics = getResources().getDisplayMetrics();

        for (int i = 0; i < localTabHost.getTabWidget().getTabCount(); i++)
        {
            View localView = localTabHost.getTabWidget().getChildTabViewAt(i);
            localView.getLayoutParams().height = ImageUtils.convertDIPToPixels(localDisplayMetrics, (float)dips);
        }
    }
}

但同样，改变布局的大小可以使图像更小但不与文本对齐。

清单文件还包含以下内容;

<supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:smallScreens="true"/>

Answer 1

更改指标的代码。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="120dip"
    android:layout_height="64dip"
    android:layout_weight="1"
    android:orientation="vertical"
    android:padding="5dp" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="30dip"
        android:layout_height="30dip"
        android:layout_centerHorizontal="true"
        android:contentDescription="@string/cntDesc" />

    <TextView
        android:id="@+id/title"
        style="?android:attr/tabWidgetStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" />

</RelativeLayout>

这对我来说很合适

Android - 使用tabhost和对齐imageview和textview的问题

1 个答案: