如何在安卓中创建带有弧形底部边框的矩形？

Question

如何使用XML创建具有完美曲线底部的Android可绘制对象，如下所示：

我尝试了这个XML，但结果并不完美。

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#5f9c63"/>

    <padding android:left="1dp"
        android:top="1dp"
        android:right="1dp"
        android:bottom="1dp" />

    <corners android:bottomRightRadius="100dp"
        android:bottomLeftRadius="100dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="0dp"/>
</shape>

有什么想法吗？

谢谢。

- andri_sasuke

---

你好，你能提供你期望的形状的图片吗？ - Sheychan

嗨@Sheychan，这是我期望的形状图片。https://i.stack.imgur.com/UMvDq.png - andri_sasuke

Answer 1

您可以使用以下方式来使用oval形状。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
            android:bottom="0dp"
            android:left="-160dp"
            android:right="-160dp"
            android:top="-80dp">
        <shape android:shape="oval">
            <solid android:color="@color/colorPrimary"/>
        </shape>
    </item>
</layer-list>

你可以改变 left,right,top 的值来使曲线更多或更少。

- Asif Mushtaq

Answer 2

我认为您正在寻找这样的内容：-

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="48dp"
        android:height="48dp"
        android:viewportHeight="12"
        android:viewportWidth="12">

    <path
        android:fillColor="@android:color/holo_red_light"
        android:pathData="M 2,9 C 2,9 4,10 6,10 C 8,10 10,9 10,9 L 10,0 2,0 2,8"
        android:strokeWidth="0.1"/>

</vector>

使用最新的Android矢量可绘制对象，可以让你在绘制时更加灵活，并且获得更好的效果。你可以按照像素进行绘制。

我会给您提供多个选项，这样您就可以清楚地看到仅仅一些小改变可以对矢量可绘制对象产生何等影响。

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="48dp"
        android:height="48dp"
        android:viewportHeight="12"
        android:viewportWidth="12">

    <path
        android:fillColor="@android:color/holo_red_light"
        android:pathData="M 2,9 C 2,9.5 4,10 6,10 C 8,10 10,9.5 10,9 L 10,0 2,0 2,8"
        android:strokeWidth="0.1"/>

</vector>

在这张第二张图片中，你可以看到通过改变小值曲线更加圆润。如果你真的想学习关于矢量可绘制，请参考这里，它将为你提供与矢量可绘制一起工作的极佳体验。

- VikasGoyal

---

耶耶，它对我有效。太好了。非常感谢你。你救了我的一天。 :) @avi - andri_sasuke

@avi 这个可以用，但我需要将这个形状的宽度设置为与父级相匹配。我该怎么做？ - Mayur More

您想要从左侧或右侧删除填充，还是需要其他操作？ - VikasGoyal

将上述代码中的这一行 *android:pathData="M 0,0 L 0,11 C 1,12 5,12 8,12 C 12,12 12,11 12,11 L 12,0 0,0" 替换即可实现此效果。 - VikasGoyal

我该如何在这里添加渐变颜色，而不是纯色？ - user2189878

我没有检查，但可能这个可以帮助你：https://dev59.com/YlgR5IYBdhLWcg3ww_3e#40927551 - VikasGoyal

Answer 3

将你的角落更改为以下内容：

    <corners
    android:radius="200dp"
    android:topLeftRadius="0dp"
    android:topRightRadius="0dp"
    />

它会完美地圆形，也许不是你想要的水平。

- statosdotcom

---

刚刚尝试了android:radius="200dp"，但还没有达到我期望的完美效果，就像 https://i.stack.imgur.com/UMvDq.png 一样。顺便说一下，谢谢你的建议。 :) - andri_sasuke