制作一个自定义视图，该视图具有多个视图作为带有圆角边框的子视图

Question

我正在尝试设计如下所示的自定义布局：

到目前为止，我已经完成了下图的操作，但这与预期的不完全一样：

这是我试过的代码。

***et_rounded_corner*********

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
     <solid android:color="@android:color/white" />
     <corners android:radius="10dp" />
     <padding
          android:left="0dp"
          android:top="0dp"
          android:right="0dp"
          android:bottom="0dp"    >
     </padding>
     <stroke
          android:width="0dp"
          android:color="@color/white"/>
</shape>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/et_rounded_corner"
    android:padding="5dp">

    <TextView
        android:id="@+id/et_search"
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:layout_alignParentStart="true"
        android:layout_toStartOf="@+id/imageView"          
        android:maxLines="1"
        android:padding="5dp"
        android:text="@string/loading"
        android:textAppearance="@style/Small"
        android:visibility="visible" />

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_alignParentEnd="true"
        android:layout_centerVertical="true"
        android:background="@color/red"
        android:padding="5dp"
        android:visibility="visible"
        app:srcCompat="@drawable/ic_search" />

</RelativeLayout>

Answer 1

将边角 radius 增加到一个很大的数字，例如 100dp。

<corners android:radius="100dp" />

Android 将在两端为您创建一个圆圈。

对 `ImageView~ 的红色背景应用相同的技巧，使实际图像具有透明背景。这将为您提供红色右侧的正确圆角。但是现在左边会变圆。

要使红色按钮的左边框垂直，可以覆盖一个白色块，或者更好地向这个新的红色背景可绘制对象添加一个负的左填充。然后左边的圆角部分会尝试画到视图外，所以不会显示。

如其他答案所述，您还需要从封闭视图中删除 padding，因为这是在红色图像上添加垂直 space 和右侧填充。

出于同样的原因，删除图片上的填充。

Answer 2

郑重声明，我已通过将以下背景与 imageview 结合使用来修复它。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/red" />
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="20dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="20dp" />
    <padding
        android:left="0dp"
        android:top="0dp"
        android:right="0dp"
        android:bottom="0dp"    >
    </padding>
    <stroke
        android:width="0dp"
        android:color="@color/red"/>
</shape>

制作一个自定义视图，该视图具有多个视图作为带有圆角边框的子视图

Make a custom view that has multiple view as childs with a rounded corner border

android

android-custom-view