Android：将 imageButton 放在 Button 上答案

【问题标题】：Android: Placing imageButton over a ButtonAndroid：将 imageButton 放在 Button 上
【发布时间】：2025-12-18 08:45:02
【问题描述】：

我想在占据屏幕 1/3 的大按钮上放置 2 个小图标（带有操作）。当我们点击它们时，这 2 个图标和按钮必须支持动作。我很确定我必须使用 imageButton 作为图标。但是我找不到任何方法将图标（imageButton）保留在按钮顶部。

这是我的代码：

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_weight="1"
    android:layout_height="0dp">

    <ImageButton
        android:id="@+id/icon1"
        android:src="@drawable/ic1"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:contentDescription="@string/ic1"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:onClick="action1"/>

    <ImageButton
        android:id="@+id/icon2"
        android:src="@drawable/ic2"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"           
        android:contentDescription="@string/ic2"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:onClick="action2"/>

    <com.myapp.CustomViews.myButton
        android:id="@+id/big_button1"
        android:text="@string/text_big_button1"
        android:background="@drawable/changing_button1"
        android:textColor="@color/white"
        android:layout_height="match_parent"
        android:textSize="@dimen/font_size_buttons"
        android:layout_width="match_parent"
        android:gravity="center"
        android:textAllCaps="false"
        android:capitalize="none"
        android:onClick="bigAction1"/>
</RelativeLayout>

大按钮上的“@drawable/changeing_button1”允许我为按钮设置一种颜色，并在聚焦或按下时为按钮设置另一种颜色。

我尝试了很多不同的方法，但我确定有一个简单的解决方案，但我找不到方法。图标仍然隐藏在大按钮后面。

感谢您的帮助！

【问题讨论】：

I'm pretty sure I have to use imageButton for the icons 您也可以使用 ImageViews 或 TextViews。只是要找到正确的技巧来在 RelativeLayout 中排列视图。
我可以使用 ImageViews 作为图标吗？他们仍然可以拥有android:onClick="action2" 吗？它会起作用吗？
当然。我经常使用 ImageViews 或 TextViews，就好像它们是按钮一样。只需添加android:clickable="true" 属性即可。
但是海拔没有问题吗？还是我的背景属性？
非常感谢。我要试试这个，如果它有效，我会发布答案:)

标签： java android android-layout button imagebutton

【解决方案1】：

您可以使用FrameLayout 覆盖视图。例如：

<FrameLayout
    android:layout_width="match_parent"
    android:layout_weight="1"
    android:layout_height="0dp">

    <com.myapp.CustomViews.myButton
        android:layout_gravitiy="center"
        .../>

    <ImageButton
        android:layout_gravitiy="left|center_vertical"
        .../>

    <ImageButton
        android:layout_gravitiy="right|center_vertical"  
        .../>

</FrameLayout>

【讨论】：

【解决方案2】：

这是您的布局稍作修改的版本，效果很好。

我用普通的 android 和标准按钮替换了您所有的自定义内容，并将大按钮在布局中向上移动，因为如果它在底部，它具有更高的 z-index 并覆盖了两个小按钮。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent">
    <Button
        android:id="@+id/big_button1"
        android:text="BIG BUTTON"
        android:background="@android:color/holo_blue_dark"
        android:textColor="@color/white"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:gravity="center"
        android:textAllCaps="false"
        android:capitalize="none"
        android:onClick="bigAction1"/>    

        <Button
            android:id="@+id/icon1"
            android:text="BT1"
            android:background="@android:color/holo_red_dark"
            android:layout_alignParentTop="true"
            android:layout_alignParentLeft="true"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:onClick="action1"/>

        <Button
            android:id="@+id/icon2"
            android:text="BT2"
            android:background="@android:color/holo_green_dark"
            android:layout_alignParentTop="true"
            android:layout_alignParentRight="true"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:onClick="action2"/>

</RelativeLayout>

【讨论】：

【解决方案3】：

改变布局中的顺序怎么样？将您的 Button 小部件放在顶部，然后声明 2 个图标？

您应该为 2 imageButton 添加android:translationZ="5dip"。它可以工作（你应该运行看看，它在 IDE 上并没有出现）

【讨论】：

您应该为 2 imageButton 添加 android:translationZ="5dip"。它可以工作（你应该运行看看，它在 IDE 上没有出现）
是的，但android:translationZ 仅适用于 API 21，我需要一个更低的... :( 非常感谢。

【解决方案4】：

我终于找到了办法。解决方案是将RelativeLayout 用作按钮，并将Button 替换为简单的TextView：

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_weight="1"
    android:layout_height="0dp"
    android:background="@drawable/custom_button_changing_color"
    android:clickable="true"
    android:focusable="true"
    android:id="@+id/button_layout"
    android:onClick="bigAction1">

    <TextView
        android:id="@+id/text_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/text"
        android:gravity="center"
        android:layout_centerVertical="true"
        android:textColor="@color/white"
        android:textSize="@dimen/font_size_buttons"
        android:textAllCaps="false"
        android:background="@color/transparent"/>

    <ImageButton
        android:id="@+id/icon1"
        android:src="@drawable/ic1"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"           
        android:contentDescription="@string/ic1"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:onClick="action2"/>

    <ImageButton
        android:id="@+id/icon2"
        android:src="@drawable/ic2"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"           
        android:contentDescription="@string/ic2"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:onClick="action3"/>
</RelativeLayout>

我希望这会有所帮助！ :)

【讨论】：