带间距的多笔画
Multiple strokes with spacing
我想要一个按钮样式,其中有两个笔划,它们之间有一些间距。我的第一种方法并不令人满意,因为在拐角处笔划之间的间距不同:
灰色笔划应该紧紧围绕蓝色渐变,白色笔划的角半径应该适合其他笔划。
这是我的代码:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<stroke
android:width="1dp"
android:color="#7F7F7F"/>
<corners
android:radius="6dp"/>
</shape>
</item>
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<gradient
android:startColor="@color/colorBlueLight"
android:endColor="@color/colorBlueDark"
android:angle="270"/>
<corners
android:radius="6dp" />
</shape>
</item>
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<stroke
android:width="2dp"
android:color="#FFFFFF"/>
<corners
android:radius="6dp"/>
</shape>
</item>
</layer-list>
嗯...这就是几何学的原理。
距离A
不等于B
只要你保持内圆角和外圆角相同的角radius
。
你可以做的是通过将内角radius
修改为较小的值来尝试"hide"这种效果。找到满足您需求的合适值(我在下面的代码中使用 4dp
作为示例)。
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<stroke
android:width="2dp"
android:color="#FFFFFF"/>
<corners
android:radius="4dp"/>
</shape>
</item>
和较小的内部 radius
:
我想要一个按钮样式,其中有两个笔划,它们之间有一些间距。我的第一种方法并不令人满意,因为在拐角处笔划之间的间距不同:
灰色笔划应该紧紧围绕蓝色渐变,白色笔划的角半径应该适合其他笔划。
这是我的代码:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<stroke
android:width="1dp"
android:color="#7F7F7F"/>
<corners
android:radius="6dp"/>
</shape>
</item>
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<gradient
android:startColor="@color/colorBlueLight"
android:endColor="@color/colorBlueDark"
android:angle="270"/>
<corners
android:radius="6dp" />
</shape>
</item>
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<stroke
android:width="2dp"
android:color="#FFFFFF"/>
<corners
android:radius="6dp"/>
</shape>
</item>
</layer-list>
嗯...这就是几何学的原理。
距离A
不等于B
只要你保持内圆角和外圆角相同的角radius
。
你可以做的是通过将内角radius
修改为较小的值来尝试"hide"这种效果。找到满足您需求的合适值(我在下面的代码中使用 4dp
作为示例)。
<item >
<shape android:shape="rectangle">
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"/>
<stroke
android:width="2dp"
android:color="#FFFFFF"/>
<corners
android:radius="4dp"/>
</shape>
</item>
和较小的内部 radius
: