如何组织视图层？将图像放在按钮上方

Question

我希望图像显示在按钮上方，并且按钮仍可单击。我想要这个是因为我希望按钮（最终具有渐变）出现在背景中，以便更清楚地表明它是一个按钮。 imageButton不能满足我的需求，因为我实际上将在按钮“顶部”有两个图像，但是为了简单起见，附加的图像只有一个。

Answer 1

要理解该问题，以下是我假设您已经尝试过的内容：

<FrameLayout>
    <Button/>
    <ImageView/>
</FrameLayout>

我敢打赌，您看到Button漂浮在ImageView上方。也许您已经知道这一点，但这是因为默认情况下按钮具有elevation而图像没有。

我认为最好的做法是不在这里尝试与Android框架抗争。您可以可以在图像上添加高程以确保其位于按钮“上方”，但是我认为最好还是按照游戏规则进行游戏。

您可以使用LayerDrawable将许多图像/绘图合并为一个。结合例如插图和形状，您可以在一个LayerDrawable中全部包含多个图像和渐变，然后可以在ImageButton中使用该单个drawable。

例如，这是一个LayerDrawable，它是一个渐变+两个小机器人：

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:drawable="@drawable/gradient"/>

    <item
        android:right="32dp"
        android:bottom="32dp"
        android:drawable="@drawable/drawable_one"/>

    <item
        android:top="32dp"
        android:left="32dp"
        android:drawable="@drawable/drawable_one"/>

</layer-list>

我可以在ImageButton中使用它：

<ImageButton
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_gravity="center"
    android:src="@drawable/layer_drawable"/>