1

I was wondering if it is possible to have multiple borders/"stroke" elements on a shape, or if I need to use an image (or a bunch of shapes covering each other). My code:

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

    <item>        
        <shape>
            <gradient
                android:endColor="@color/editTextBG"
                android:startColor="@color/editTextBG"
                android:angle="270" />
            <stroke
                android:width="1dp"
                android:color="@color/editTextEdgeInner" />
            <stroke
                android:width="1dp"
                android:color="@color/editTextEdgeCenter" />
            <stroke
                android:width="1dp"
                android:color="@color/editTextEdgeOuter" />
            <corners
                android:radius="3dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>

</selector>

I've tried just using the code, which didn't work, and giving the earlier strokes a bigger width (so that the later, if drawn over, would only color part). However, it seems the last stroke overrides the others?

beewall
  • 131
  • 1
  • 10
  • 1
    Maybe you're looking for a [layer-list drawable](https://developer.android.com/guide/topics/resources/drawable-resource.html#LayerList)? There is an [example](https://stackoverflow.com/questions/36506953/what-is-wrong-with-my-layer-list-drawable) on Stack Overflow with concentric circles – Bö macht Blau Jan 19 '18 at 19:24

2 Answers2

2

A workaround for borders is to overlay elements:

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

    <item>
        <color android:color="@color/colorAccent"/>
    </item>

    <item android:top="8dp">
        <color android:color="@color/colorPrimaryDark"/>
    </item>

    <item android:top="16dp">
        <color android:color="@color/colorPrimary"/>
    </item>

    <item android:top="32dp" android:right="8dp">
        <color android:color="@android:color/holo_red_dark"/>
    </item>

</layer-list>

This is the result: multi bordered drawable android

The first element in the layer-list from top to bottom is the background and every other is mounted on top.

Saeed Zhiany
  • 2,051
  • 9
  • 30
  • 41
cutiko
  • 9,887
  • 3
  • 45
  • 59
  • The issue with that is that it cuts into the element, while stroke is a border (I'm using it as a background for an EditText). – beewall Jan 20 '18 at 00:18
0
 <item>
    <shape android:shape="rectangle">

        <corners android:radius="8dp" />

        <solid android:color="@color/colorWhite" />

        <stroke
            android:width="1dp"
            android:color="#979797" />

    </shape>
</item>


<item
    android:bottom="5dp"
    android:left="5dp"
    android:right="5dp"
    android:top="5dp">

    <shape android:shape="rectangle">

        <corners android:radius="4dp" />

        <solid android:color="#ffd400" />



    </shape>

</item>
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jan 24 '23 at 07:54