带有透明内框的圆角内角答案

【问题标题】：Rounded Inner corners with transparent inside frame带有透明内框的圆角内角
【发布时间】：2012-06-27 10:45:45
【问题描述】：

我正在尝试用代码制作一个框架，以便我可以应用它来制作圆形内角，外部填充实心，内部透明。 就像一个实心矩形，里面有透明的椭圆形。附上图片。我尝试了几种形状组合，所有可用的在线显示外部角落。

里面应该是透明的而不是白色的。图片取自post，但这里提供的解决方案不是我想要的我不想使用 9 补丁可绘制但希望在代码中创建。

请只回答有效。

【问题讨论】：

【解决方案1】：

创建以下 rounded_corner.xml：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="-10dp"
        android:left="-10dp"
        android:right="-10dp"
        android:top="-10dp">
        <shape android:shape="rectangle">
            <stroke
                android:width="10dp"
                android:color="#ffffff" />
            <corners android:radius="20dp" />
        </shape>
    </item>
</layer-list>

将此添加到您要在其上应用框架的 imageView 下方：

<View
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignBottom="@+id/my_image_view"
    android:layout_alignLeft="@id/my_image_view"
    android:layout_alignRight="@+id/my_image_view"
    android:layout_alignTop="@id/my_image_view"
    android:background="@drawable/rounded_corner" />

【讨论】：

这是最好的答案。谢谢！
效果很好，但我不明白为什么，你能解释一下吗？
它在覆盖矩形角的矩形上绘制一个更大的“椭圆形描边”。
正是我一直在寻找的！

【解决方案2】：

首先，在drawable文件夹中创建3个xmllayout：

首先：frame.xml
第二：frame_build.xml
第三：red.xml

（您可以随意更改此名称），

frame.xml：

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:bottom="20dp" android:drawable="@drawable/red" android:top="-25dp" />
    <item android:bottom="15dp" android:drawable="@drawable/frame_build" android:top="5dp" android:left="-5dp" android:right="-5dp" />
</layer-list>

frame_build.xml：

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" />
    <corners android:radius="40dp" />
</shape>

red.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <stroke android:width="40dp" android:height="40dp" android:color="#B22222" />
    <padding android:left="8dp" android:top="-1dp" android:right="8dp" android:bottom="9dp" />
    <corners android:radius="-10dp" />
</shape>

最后将您的视图或布局引用到 Frame XML，如下所示：

  android:background="@drawable/frame"

测试并输出如下图：

希望对您有所帮助。

【讨论】：

好像是我刚需要的，让我试试，然后我会标记为答案
@user606669 很高兴为您提供帮助
我试过了，但它是黑色背景而不是透明我做错了什么。我在框架布局中使用它，它应该显示它下面的框架。
@user606669 为 framelayout 和 frame_build.XML 添加相同的颜色，这将为您提供透明度
@AndroidStack 你能解释一下数字之间的关系，还是用常量代替？

【解决方案3】：

调整@Nima K 解决方案，以避免使用额外的视图

创建frame.xml@drawable

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:bottom="-10dp"
        android:left="-10dp"
        android:right="-10dp"
        android:top="-10dp">
        <shape android:shape="rectangle">
            <stroke
                android:width="20dp"
                android:color="@color/frame_color" />
            <corners android:radius="30dp" />
        </shape>
    </item>

    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />

            <stroke
                android:width="20dp"
                android:color="@color/frame_color" />

            <corners android:radius="40dp" />
        </shape>

    </item>

</layer-list>

然后将它与视图的 'android:background' 属性一起使用

<TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/frame" />

And this is the result

【讨论】：

【解决方案4】：

也许更简单；

<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:inset="-6dp">

    <shape android:shape="rectangle">
        <solid android:color="#FFFFFF" />

        <stroke android:width="12dp"
            android:color="#000000" />
    
        <corners android:radius="16dp" />
    </shape>
</inset>

【讨论】：