Android 渐变背景

Question

我需要实现这样的东西，底部有黑色渐变效果

我使用了下面的代码 activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_marginBottom="5dp"
    android:background="@drawable/my_custom_drawable"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/dead"
        android:scaleType="fitXY"
        android:id="@+id/place_image"
        />
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:background="#AA000000">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Medeu"
            android:id="@+id/place_id"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="2dp"
            android:textSize="18sp"
            android:textColor="#ffffff"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Almaty region"
            android:textColor="#ffffff"
            android:layout_marginLeft="20dp"
            android:layout_below="@+id/place_id"
            android:textSize="12sp"
            android:id="@+id/place_id_sub"

            />
    </RelativeLayout>
</RelativeLayout>

和my_custom_drawable.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#00000000"
        android:endColor="#80000000"
        android:angle="270"
        android:dither="true"
        />
</shape>

我最终会变成这样

为什么我没有得到第一张图片的效果，我参考了其他问题的几个热门答案

Answer 1

试试这个：

<?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="@color/black_transparent"
        android:endColor="@android:color/transparent"
        />

</shape>

Answer 2

问题是您的 ImageView 覆盖了您设置背景的 RelativeLayout，因此它不可见。

在 ImageView 上方添加具有所需背景的 View 而不是设置 RelativeLayout 的背景应该可行：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_marginBottom="5dp">

    <ImageView
        android:id="@+id/place_image"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/dead" />

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/my_custom_drawable" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true">

        <TextView
            android:id="@+id/place_id"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="2dp"
            android:text="Medeu"
            android:textColor="#ffffff"
            android:textSize="18sp" />

        <TextView
            android:id="@+id/place_id_sub"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/place_id"
            android:layout_marginLeft="20dp"
            android:text="Almaty region"
            android:textColor="#ffffff"
            android:textSize="12sp" />
    </RelativeLayout>
</RelativeLayout>

Answer 3

你的图片在渐变之上。

Answer 4

使用这个

<?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:centerColor="#555994"
        android:endColor="#b5b6d2"
        android:startColor="#555994"
        android:type="linear" />

    <corners
        android:radius="20dp"/>

</shape>

Android 渐变背景

Android gradient background

xml

android

gradient