CODEWITHSUNDEEP
androidandroid-imageviewandroid-drawable
Mo Dev
Mo Dev

Reputation: 475

How to add a fully transparent to semi-transparent gradient in Android

I have a situation where I want to add an image view doing the same effect as this app

Screenshot

As you notice there is a drawable or something hiding the bottom side of the view adding a transparent gradient. How can I achieve the same effect?

Upvotes: 5

Views: 2070

Answers (3)

Matthew Strukov
Matthew Strukov

Reputation: 351

Place this drawable in the bottom of your layout:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#FFFFFF"
        android:endColor="@android:color/transparent"
        android:angle="90" />
</shape>

Your layout:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white" > 
    <View
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="@drawable/gradient"
        android:layout_gravity="bottom"/>

</FrameLayout>

Upvotes: 5

Wimukthi Rajapaksha
Wimukthi Rajapaksha

Reputation: 1019

I think you can change alpha value of that image View. Go through this and this for more details.

Upvotes: 0

Shariq Shaikh
Shariq Shaikh

Reputation: 188

Well, you can use fadingEdge attribute of the listView in your xml. Make a listView, then add items xml (images in particular as you've mentioned above).

android:fadingEdge="horizontal" android:fadingEdgeLength="30dp" android:fillViewport="false" android:requiresFadingEdge="vertical"

Upvotes: 4

Related Questions