Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

prevent partial overlapping of shape drawable stroke

Is there any way to prevent partial overlapping of the stroke on the shape drawable. I prefer to overlap the stroke completely on the borders of the shape.

Here is my xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <padding
        android:bottom="0dp"
        android:top="0dp"
        android:left="0dp"
        android:right="0dp" />
    <solid android:color="@color/green" />
    <stroke android:color="@color/red_50"
        android:width="20dp"
        android:dashGap="2dp"
        android:dashWidth="10dp" />
</shape>

colors.xml

<color name="green">#0f0</color>
<color name="red_50">#8f00</color>

And here is what is achieved
Sample Image

As you can see that the stroke is overlapping the solid part by 50% but I want it to be 100%.

like image 646
Mohammed Atif Avatar asked Oct 21 '16 06:10

Mohammed Atif


1 Answers

Try to divide it into two shapes - one for stroke and one for rectangle. In this solution I manipulate size of rectangle so that I can change its relation with borders.

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

    <item
        android:bottom="@dimen/offset"
        android:left="@dimen/offset"
        android:right="@dimen/offset"
        android:top="@dimen/offset">

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

    </item>

    <item>

        <shape android:shape="rectangle">
            <stroke
                android:width="20dp"
                android:color="@color/red_50"
                android:dashGap="2dp"
                android:dashWidth="10dp" />
        </shape>

    </item>

</layer-list>

You can adjust the offset to get outer or inner stroke.

Outer & inner stroke

These values come from difference of size of transparent rectangle (stroke layer) and the green one. In your case they will be 20dp or none.

like image 181
paulina_glab Avatar answered Oct 22 '22 22:10

paulina_glab