Fond de dégradé LinearLayout Android

J'ai du mal à appliquer un fond dégradé à un LinearLayout.

Cela devrait être relativement simple d'après ce que j'ai lu, mais cela ne semble tout simplement pas fonctionner. Pour référence, je développe sur 2.1-update1.

header_bg.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:angle="90"
        android:startColor="#FFFF0000"
        android:endColor="#FF00FF00"
        android:type="linear"/>
</shape>

main_header.xml:

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

Si je change @ drawable / header_bg en une couleur - par exemple # FF0000 cela fonctionne parfaitement bien. Suis-je en train de manquer quelque chose d'évident ici?

Ok, j'ai réussi à résoudre ce problème en utilisant un sélecteur. Voir le code ci-dessous:

main_header.xml:

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

main_header_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape>
        <gradient
            android:angle="90"
            android:startColor="#FFFF0000"
            android:endColor="#FF00FF00"
            android:type="linear" />
    </shape>
</item>
</selector>

J'espère que cela aide quelqu'un qui a le même problème.

Il est également possible d'avoir la troisième couleur (centre). Et différents types de formes.

Par exemple dans drawable / gradient.xml:

<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#000000"
        android:centerColor="#5b5b5b"
        android:endColor="#000000"
        android:angle="0" />
</shape>

Cela vous donne du noir - gris - noir (de gauche à droite) qui est mon atmosphère de fond sombre préférée.

N'oubliez pas d'ajouter gradient.xml en arrière-plan dans votre mise en page xml:

android:background="@drawable/gradient"

Il est également possible de faire pivoter, avec:

angle = "0"

vous donne une ligne verticale

et avec

angle = "90"

vous donne une ligne horizontale

Les angles possibles sont:

0, 90, 180, 270.

Il existe également peu de formes différentes:

android: shape = "rectangle"

Forme arrondie:

android: forme = "ovale"

et probablement un peu plus.

J'espère que ça aide, bravo!

Dans un fichier dessinable XML:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <gradient android:angle="90"
                android:endColor="#9b0493"
                android:startColor="#38068f"
                android:type="linear" />
        </shape>
    </item>
</selector>

Dans votre fichier de mise en page: android: background = "@ drawable / gradient_background"

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

</LinearLayout>

Essayez de supprimer android: gradientRadius = "90". En voici une qui fonctionne pour moi:

<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
>
    <gradient
        android:startColor="@color/purple"
        android:endColor="@color/pink"
        android:angle="270" />
</shape>

Mon problème était que l'extension .xml n'a pas été ajoutée au nom de fichier du fichier XML nouvellement créé. L'ajout de l'extension .xml a résolu mon problème.

Avec Kotlin, vous pouvez le faire en seulement 2 lignes

Modifier les valeurs de couleur dans le tableau

                  val gradientDrawable = GradientDrawable(
                        GradientDrawable.Orientation.TOP_BOTTOM,
                        intArrayOf(Color.parseColor("#008000"),
                                   Color.parseColor("#ADFF2F"))
                    );
                    gradientDrawable.cornerRadius = 0f;

                   //Set Gradient
                   linearLayout.setBackground(gradientDrawable);

Résultat

Je ne sais pas si cela aidera quelqu'un, mais mon problème était que j'essayais de définir le dégradé sur la propriété "src" d'une ImageView comme ceci:

<ImageView 
    android:id="@+id/imgToast"
    android:layout_width="wrap_content"
    android:layout_height="60dp"
    android:src="@drawable/toast_bg"
    android:adjustViewBounds="true"
    android:scaleType="fitXY"/>

Je ne sais pas à 100% pourquoi cela n'a pas fonctionné, mais maintenant je l'ai changé et j'ai mis le dessinable dans la propriété "background" du parent de ImageView, qui est un RelativeLayout dans mon cas, comme ceci: (cela a fonctionné avec succès)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:id="@+id/custom_toast_layout_id"
    android:layout_height="match_parent"
    android:background="@drawable/toast_bg">

Je vérifierais votre canal alpha sur vos couleurs dégradées. Pour moi, lorsque je testais mon code, le canal alpha était mal réglé sur les couleurs et cela ne fonctionnait pas pour moi. Une fois que j'ai réglé le canal alpha, tout a fonctionné!

Vous pouvez utiliser une vue personnalisée pour ce faire. Avec cette solution, c'est fini les formes dégradées de toutes les couleurs dans vos projets:

class GradientView(context: Context, attrs: AttributeSet) : View(context, attrs) {

    // Properties
    private val paint: Paint = Paint()
    private val rect = Rect()

    //region Attributes
    var start: Int = Color.WHITE
    var end: Int = Color.WHITE
    //endregion

    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
        super.onSizeChanged(w, h, oldw, oldh)
        // Update Size
        val usableWidth = width - (paddingLeft + paddingRight)
        val usableHeight = height - (paddingTop + paddingBottom)
        rect.right = usableWidth
        rect.bottom = usableHeight
        // Update Color
        paint.shader = LinearGradient(0f, 0f, width.toFloat(), 0f,
                start, end, Shader.TileMode.CLAMP)
        // ReDraw
        invalidate()
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        canvas.drawRect(rect, paint)
    }

}

Je crée également un projet open source GradientView avec cette vue personnalisée:

https://github.com/lopspower/GradientView

implementation 'com.mikhaellopez:gradientview:1.1.0'