I played this style in drawable to have border in my EditText, it worked but I did not understand anything of it

1

I copied this code to give a border but I do not understand why it has three items, does anyone help me?

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- most important is order of layers -->
    <!-- Bottom right side 2dp Shadow -->
    <item >
        <shape android:shape="rectangle">
            <solid android:color="#363636" />
        </shape>
    </item>

    <!-- Bottom 2dp Shadow -->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#363636" />
        </shape>
    </item>

    <!-- White Top color -->
    <item android:bottom="3dp" android:right="3dp" android:top="3dp" android:left="3dp" >
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF" />
        </shape>
    </item>
</layer-list>
    
asked by anonymous 29.11.2016 / 14:28

1 answer

3

You are right to question why you have 3 items.

In fact one of them is the most.

A layer-list , as the name implies, is a list of layers, in this case of Drawables . Each of the Drawables is drawn over the previous one.

Drawing two identical things, one on top of the other, is the same as drawing only one. It can eliminate one of the first two that the behavior is maintained.

The "border" effect is achieved by overlapping a white rectangle over a #363636 color. As the white rectangle is smaller, it makes visible a portion of 3dp on the other side of the rectangle.

    
29.11.2016 / 14:51