Rectangle shape drawable, specify top and bottom stroke colors?

0 votes
asked Sep 9, 2010 by user246114

Is there any way to define a top and bottom stroke for a gradient, or create a compound shape drawable?:

// option1:
<shape
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">

  <gradient
    android:startColor="#f00"
    android:endColor="#0f0"
    />
  <stroke
    top=1dip, yellow
    bottom=1dip, purple
    />
</shape>

// option2
<shape
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">

  <shape
    android:shape="rectangle"
    height=1dip, color=yellow />

  <gradient
    android:startColor="#f00"
    android:endColor="#0f0"
    />

  <shape
    android:shape="rectangle"
    height=1dip, color=purple />
</shape>

I don't think either are possible?

Thanks

4 Answers

0 votes
answered Jan 20, 2012 by goddchen

Can't think of any way to make this possible in XML.

But you always have the option to do the drawing on your own...

http://developer.android.com/reference/android/view/View.html#onDraw(android.graphics.Canvas)

0 votes
answered Sep 20, 2012 by vijay-c

I guess, it can be done by using layer-list.

Following is the res/drawable/layer_list_shape.xml
I have used hard-coded dimensions..

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
    <shape android:shape="rectangle">
        <size android:width="150dp" android:height="6dp"/>
        <solid android:color="#ff0" />
    </shape>
</item>
<item android:top="6dp">
    <shape android:shape="rectangle" >
        <size android:width="150dp" android:height="50dp"/>
        <gradient
            android:endColor="#0f0"
            android:startColor="#f00" />
    </shape>
</item>
<item android:top="82dp">
    <shape android:shape="rectangle" >
        <size android:width="150dp" android:height="6dp"/>
        <solid android:color="#ff0" />
    </shape>
</item>

res/layout/main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/layer_example" />
 </LinearLayout>

Hope this helps..

0 votes
answered Jan 29, 2013 by malimo

If you don't want to use hardcoded dimensions it's possible to use 3 views:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@android:color/black" >

<View 
    android:layout_width="match_parent"
    android:layout_height="1dip" 
    android:background="@android:color/white"/>

<TextView
    android:id="@+id/header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    style="@style/header" />

<View 
    android:layout_width="match_parent"
    android:layout_height="1dip" 
    android:background="@android:color/white"/>

</LinearLayout>

The header element has a gradient background. Of course, you could use any other layout as well.

0 votes
answered Sep 15, 2017 by ankur-jain

building up on the answer given by Vijay C, you can create a drawable and include in any layout. The previous answer was ok but it added hard-coded dimensions which made it impossible to be used in background as wrap_content. Also, this way you reduce the number of items from 3 to 2.

<?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="#d8dae3" />
        </shape>
    </item>
    <item
        android:bottom="2dp"
        android:top="2dp">
        <shape android:shape="rectangle">
            <gradient
                android:endColor="@android:color/white"
                android:startColor="@android:color/white" />
        </shape>
    </item>
</layer-list>
Welcome to Q&A, where you can ask questions and receive answers from other members of the community.
Website Online Counter

...