Question

How can I position a radial gradient shape as background in a LinearLayout ? Here is what I presently have :

The shape :

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:endColor="#e6e6e6"
        android:gradientRadius="800"
        android:startColor="#fafaf9"
        android:type="radial"/>
</shape>

The LinearLayout :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:background="@drawable/accueil_bg_gradient">
</LinearLayout>

I just want to have my gradient starting from the left upper corner of the screen, and ending at the right lower corner.

Thanks a lot !

Answer 1

You can move the middle of the radial gradient at a different position of the drawable using “centerX” and “centerY” attributes of the gradient. They are a floating point values ranging from 0 to 1.0 where (values of centerX,centerY accordingly) 0,0 is upper left and 1,1 is bottom right corner.

Default is 0.5,0.5 which is the middle of the drawable / assigned space.
Example for a 100px long (radius), black-white gradient whose middle starts at upper left corner would be:

    <shape android:shape="rectangle">
        <gradient
            android:type="radial"
            android:startColor="#ffffff"
            android:endColor="#000000"
            android:gradientRadius="100"
            android:angle="270"
            android:centerX="0"
            android:centerY="0"/>

    </shape>