Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding a color background and border radius to a Layout

I want to create a layout with rounded corners and a filled color background.

This is my layout:

<LinearLayout     android:layout_width="match_parent"     android:layout_height="210dp"     android:orientation="vertical"     android:layout_marginBottom="10dp"             android:background="@drawable/offerItemLayout">     <LinearLayout         android:id="@+id/offerImageHolder"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="vertical">             .             .             .     </LinearLayout> </LinearLayout> 

I have the following drawable xml (offerItemLayout) that creates the borders correctly:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">     <item>         <shape xmlns:android="http://schemas.android.com/apk/res/android"                android:shape="rectangle">             <corners                 android:radius="5dp"/>             <stroke                 android:width="1dp"                 android:color="@color/bggrey" />                     </shape>     </item>     // The lines below causes an inflation failure.     <item>         <fill             android:color="@color/white"/>     </item> </layer-list> 

But inserting the item with a fill causes the inflation of the layout to fail.

Additionally, if I assign a color background to my inner LinearLayout (offerImageHolder), it overrides the first background with my rounded corners.

Any thoughts on doing this properly? :/

like image 415
Ron Avatar asked Mar 20 '13 16:03

Ron


People also ask

How do I make the background a view color?

To get background color of a Layout: LinearLayout lay = (LinearLayout) findViewById(R. id. lay1); ColorDrawable viewColor = (ColorDrawable) lay.

How do I round corners in XML?

To do that right click on drawable (under resources), choose New, choose Drawable Resource File. Name the resource rounded_blue_border and make the root element shape. We will use the attributes stroke, corners and padding. The stroke determines the width and color of the border.


2 Answers

You don't need the separate fill item. In fact, it's invalid. You just have to add a solid block to the shape. The subsequent stroke draws on top of the solid:

<shape      xmlns:android="http://schemas.android.com/apk/res/android"      android:shape="rectangle">      <corners android:radius="5dp" />     <solid android:color="@android:color/white" />     <stroke         android:width="1dip"         android:color="@color/bggrey" /> </shape> 

You also don't need the layer-list if you only have one shape.

like image 121
Jeffrey Blattman Avatar answered Oct 09 '22 18:10

Jeffrey Blattman


background.xml in drawable folder.

<?xml version="1.0" encoding="UTF-8"?>  <shape xmlns:android="http://schemas.android.com/apk/res/android">      <solid android:color="#FFFFFF"/>         <stroke         android:width="3dp"         android:color="#0FECFF" />      //specify gradient     <gradient         android:startColor="#ffffffff"          android:endColor="#110000FF"          android:angle="90"/>       <padding         android:left="5dp"         android:top="5dp"         android:right="5dp"         android:bottom="5dp"/>      <corners         android:bottomRightRadius="7dp"         android:bottomLeftRadius="7dp"          android:topLeftRadius="7dp"         android:topRightRadius="7dp"/>  </shape>  <LinearLayout     android:layout_width="match_parent"     android:layout_height="210dp"     android:orientation="vertical"     android:layout_marginBottom="10dp"             android:background="@drawable/background"> 
like image 40
Raghunandan Avatar answered Oct 09 '22 19:10

Raghunandan