Search code examples
androidborderandroid-linearlayout

Android LinearLayout : Add border with shadow around a LinearLayout


I would like to create the same border of this LinearLayout as the example :

enter image description here

In this example, we can see that the border is not the same all around the linearLayout. How can I create this using an XML drawable file?

For now, I have only able to create a simple border all around the LinearLayout like this :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
  <corners
      android:radius="1dp"
      android:topRightRadius="0dp"
      android:bottomRightRadius="0dp"
      android:bottomLeftRadius="0dp" />
  <stroke
      android:width="1dp"
      android:color="#E3E3E1" />

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

</shape>

Solution

  • Try this, as shown in Android Developer Tips & Tricks by an anonymous contributor:

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape android:shape="rectangle">
                <solid android:color="#CABBBBBB"/>
                <corners android:radius="2dp" />
            </shape>
        </item>
    
        <item
            android:left="0dp"
            android:right="0dp"
            android:top="0dp"
            android:bottom="2dp">
            <shape android:shape="rectangle">
                <solid android:color="@android:color/white"/>
                <corners android:radius="2dp" />
            </shape>
        </item>
    </layer-list>