如何在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"/>

在图标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 =＆＃34; @ id / icon＆＃34;你的布局会更好一些。