如何在Android按钮中放置可绘制对象？

Question

我在Android中遇到一些设计问题。 我想做一些带有内部可绘制对象的按钮，并将该可绘制对象放在文本上方。 从某种意义上说，我成功做到了这一点，这为我提供了以下界面。

为了讨论代码，我使用的是TableLayout，其中放置了两个TableRow，其设计如下：

<TableRow
    android:id="@+id/row1"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <Button
        android:id="@+id/actu"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:text="@string/mon_actu"
        android:drawableTop="@drawable/ic_shopping_cart_black_48dp"
        android:paddingTop="100dp"
        android:drawablePadding="-130dp"
        android:gravity="center"/>

    <Button
        android:id="@+id/commerce"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:drawableTop="@drawable/ic_shopping_cart_black_48dp"
        android:paddingTop="100dp"
        android:drawablePadding="-130dp"
        android:text="@string/mes_commerces"
        android:gravity="center" />
</TableRow>

这是我想要的最终结果，但是当我在自己的手机上启动它时，所有图标都在文本上，将其隐藏。 我猜问题出在我的paddingTop和drawablePadding值，因为它是绝对值，并且分辨率因模型而异。

我该怎么做才能解决这个问题？

Answer 1

对于支持多个具有不同分辨率的设备的响应式设计，您不能具有静态和负值。

而是可以将TableLayout与TableRow和LinearLayout.

试试看：

<TableLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@drawable/ic_shopping_cart_black_48dp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Hello World" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@drawable/ic_shopping_cart_black_48dp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Hello World" />
            </LinearLayout>

        </TableRow>

        <TableRow
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@drawable/ic_shopping_cart_black_48dp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Hello World" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:background="@drawable/ic_shopping_cart_black_48dp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Hello World" />
            </LinearLayout>
        </TableRow>
    </TableLayout>

具有不同分辨率和高度-宽度的所有设备都将支持此功能。