Android渐变背景

时间:2016-06-23 16:20:21

标签: android xml gradient

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

我使用了以下代码 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>

我最终得到这样的

Image 2

为什么我没有获得第一张图片的效果,我从其他问题中提到了几个最佳答案

4 个答案:

答案 0 :(得分:1)

试试这个:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="description-part">
  ...
  <textarea></textarea>
  <div></div>
  <input type="submit" name="save" class="button" />...
</div>

答案 1 :(得分:1)

问题是,ImageView覆盖了您设置背景的RelativeLayout,因此无法看到。

View上方添加所需背景的ImageView而不是设置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>

答案 2 :(得分:0)

使用此

<?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>

答案 3 :(得分:-1)

您的图片位于渐变之上。