如何在 RelativeLayout 中创建十字按钮

Question

我要为 RelativeLayout 中的图标创建一个交叉删除按钮。

它应该是这样的：

很遗憾，我无法将删除按钮放在图标外。

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/icon"/>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@id/icon"
        android:src="@mipmap/delete_button"/>
</RelativeLayout>

如果我给删除按钮添加一些边距，按钮会变小，但它仍然在图标内。

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignRight="@id/icon"
    android:layout_marginLeft="45dp"
    android:src="@mipmap/delete_button"/>

我给icon imageview添加边距后，位置还是不对，如果我把删除按钮的layout_alignRight去掉，左边是右边的位置

Answer 1

您不能将嵌套视图放置在父视图矩形之外（实际上可以，但它会与父视图矩形一起裁剪）。

尝试做这样的事情（将 layout_margin 添加到图标）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
<!-- 1st solution with RelativeLayout (icon size 32x32dip, margin 10dip, layout w(h) = icon size + 2 * margin) -->
<RelativeLayout android:layout_width="52dip"
                android:layout_height="52dip">
    <ImageView
            android:id="@+id/icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dip"
            android:src="@drawable/ic_action_add"/>

    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignParentRight="true"
            android:src="@drawable/star"/>
</RelativeLayout>
<!-- 2nd solution with FrameLayout -->
<FrameLayout android:layout_width="wrap_content"
             android:layout_height="wrap_content">
    <ImageView
            android:id="@+id/icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dip"
            android:src="@drawable/ic_action_add"/>

    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top|right"
            android:src="@drawable/star"/>
</FrameLayout>
</LinearLayout>

去掉android:layout_alignRight="@id/icon" 你的布局会好一点。

如何在 RelativeLayout 中创建十字按钮

How to create cross button in RelativeLayout

android

android-relativelayout