I’m attempting to create a layout border with corners that are square on the outside and round on the inside. I’ve gathered that I need to create an .xml drawable definition composed of two shapes: one with a stroke width and corner radius and another with a stroke width only:
The drawables
round_border.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="4dp" android:color="#FF000000" />
<padding android:left="7dp" android:top="7dp"
android:right="7dp" android:bottom="7dp" />
<corners android:radius="4dp" />
<solid android:color="#FFC0C0C0" />
</shape>
square_border.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="2dp" android:color="#FF000000" />
<solid android:color="#FFC0C0C0" />
</shape>
Each of these works independantly as a border when appliedby itself like so:
android:background="@drawable/round_border"
but when they either or both are added to an item-list drawable like so:
composite_border.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<layer-list>
<item android:drawable="@drawable/round_border"/>
<!-- <item android:drawable="@drawable/square_border"/> -->
</layer-list>
</shape>
and:
android:background="@drawable/composite_border"
The layout's background is completely black instead of just a black border.
Does anyone know how to make the layer list work for this task?
Try this will work fine enough:
solid
is background color
stroke
is border
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid
android:color="@color/white"/>
<stroke android:width="1dp" android:color="#ffaaaaaa" />
<size
android:width="15dp"
android:height="15dp"/>
</shape>
From Shape Drawable Doc you can see that shape can't have layer-list inside so you should define your composite_border.xml like this
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="@drawable/square_border"/>
<item android:drawable="@drawable/round_border"/>
</layer-list>
note that I changed the order of your items inside the layer-list as stated in the documentation of layer-listEach drawable in the list is drawn in the order of the list—the last drawable in the list is drawn on top
and you want it to be squared from outside
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With