web-dev-qa-db-fra.com

Ajouter un dégradé à l'image

Je veux ajouter un dégradé au bas de mon image. Quelque chose comme ça :

enter image description here

J'ai essayé quelque chose comme ça mais je n'obtiens le dégradé aucune image ..

    <ImageView
    Android:id="@+id/trendingImageView"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:background="@drawable/trend_donald_sterling"
    Android:src="@drawable/trending_gradient_shape"
  />

trending_gradient_shape:

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

    <gradient
        Android:angle="90"
        Android:endColor="@Android:color/darker_gray"
        Android:startColor="@Android:color/darker_gray" />

    <corners Android:radius="0dp" />

</shape>
androidandroid-imageviewandroid-drawable
38
user1163234

Vous avez besoin de deux couches: un ImageView et un View en plus de cela avec votre dégradé comme Android:background. Mettez ces deux View dans un FrameLayout:

<FrameLayout
    ... >

    <ImageView
        ...
        Android:src="@drawable/trend_donald_sterling" />

    <View
        ...
        Android:background="@drawable/trending_gradient_shape"/>


</FrameLayout>
55
nhaarman

Définissez simplement la valeur alpha dans votre gardient.xml:

Votre imageView:

Android:background="@drawable/trend_donald_sterling"
Android:src="@drawable/trending_gradient_shape"

Votre fichier xml dégradé:

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

<gradient
    Android:angle="90"
    Android:endColor="#00ffffff"
    Android:startColor="#aa000000"
    Android:centerColor="#00ffffff" />

<corners Android:radius="0dp" />
</shape>

Dans la valeur de couleur, les deux premières places après # correspondent à la valeur alpha, tandis que les autres sont la valeur de couleur réelle au format R G B, deux pour chacune.

29
Kaustuv

essayez d'utiliser l'attribut "premier plan" dans votre vue d'image

<ImageView
        ...
        Android:src="@drawable/trend_donald_sterling"
        Android:foreground="@drawable/trending_gradient_shape" />

ça a marché pour moi.

20
swetabh suman

Utilisation Android:foreground="..." au lieu de Android:background="..."

Maintenant, vous n'aurez plus besoin de mettre ImageView et View dans un FrameLayout!

Donc, votre code final sera:

ImageView

<ImageView
    ...
    Android:foreground="@drawable/trend_donald_sterling"/>

Étirable

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

    <gradient
        Android:angle="90"
        Android:endColor="#00ffffff"
        Android:startColor="#aa000000"
        Android:centerColor="#00ffffff" />

    <corners Android:radius="0dp" />
</shape>
7
Slick Slime

c'est comme ça que je vais faire, j'ai utilisé la disposition relative comme ma disposition parent, utilisez le code suivant

 <RelativeLayout
        Android:layout_width="match_parent"
        Android:layout_height="match_parent">
        <ImageView
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:scaleType="centerCrop"
            Android:src="@drawable/img_sample"/>
        <View
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:background="@drawable/gradiant"/>
        <LinearLayout
            Android:layout_marginLeft="10dp"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:orientation="vertical"
            Android:weightSum="1">
            <View
                Android:layout_width="match_parent"
                Android:layout_height="0dp"
                Android:layout_weight="0.55"/>
            <TextView
                Android:layout_width="wrap_content"
                Android:layout_height="0dp"
                Android:layout_weight="0.25"
                Android:text="Events"
                Android:gravity="bottom"
                Android:textStyle="bold"
                Android:textSize="18sp"
                Android:textColor="#ffffff"/>
            <TextView
                Android:layout_width="wrap_content"
                Android:layout_height="0dp"
                Android:layout_weight="0.25"
                Android:text="Some description about the events goes here"
                Android:textSize="14sp"
                Android:textColor="#ffffff"/>
        </LinearLayout>
    </RelativeLayout>

j'espère que vous pouvez comprendre, ici je joins mon code gradiant ci-dessous. utilisez-le dans le dossier dessinable ....

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

<gradient
    Android:angle="90"
    Android:endColor="#00ffffff"
    Android:startColor="#aa000000"
    Android:centerColor="#00ffffff" />

<corners Android:radius="0dp" />
</shape>
3
Ashana.Jackol