prevent partial overlapping of shape drawable stroke
Asked Answered
S

1

11

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%.

Stupid answered 21/10, 2016 at 6:8 Comment(0)
P
10

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.

Penang answered 24/10, 2016 at 13:12 Comment(5)
In case B isn't padding of the filled rectangle zero? Since there is no stroke to accommodate for.Laparotomy
@EugenPechanec If there is no offset we get the result shown in question - green rect starts half of stroke's width. That is why we have to increase its bounds by this value (by subtracting 'padding').Penang
But the whole point of your post is that the green rectangle has no stroke so it fills the whole available area therefore does not need a negative offset, is it not? (I.e. if you need to offset green rectangle by 20dp to accommodate for 20dp wide stroke, then you need 20-20=0dp offset to draw green underneath the stroke.)Laparotomy
@EugenPechanec You're right. I've edited the answer. Do you agree with it now? I missed it while testing - it looked proper, but indeed your suggestion is correct :)Penang
Yup, looks good now. (Note: The original would cause 10dp extra green space around the view if its parent had android:clipChildren="false".)Laparotomy

© 2022 - 2024 — McMap. All rights reserved.