Create Google Pay (Tez) like scratch card

Every Monday we pick up our smartphone and send ₹150 to our friends in order to earn some cashback. Cashback is a smart move to keep the user engaged in the app and maintain user retention.

For a normal user, it’s just a lottery. But are you an app developer who is amazed by the UI and want to implement the same in your app? Then you are in the right place. In this blog, I’ll tell you how can you clone Google Pay scratch card view into your app.

In this approach, we will first create a layout of our cashback card and then cover it will an overlay. This overlay can be scratched to reveal the view below it. Question: which layout supports overlapping of view? Recall your android lessons, the answer is RelativeLayout. RelativeLayout is the most suitable layout for building a scratch card in android.

STEP 1: Creating the content under scratch card

The content under the scratch view is just an image (trophy) with some text under it (You’ve won ₹899), though in my case its mostly “Better luck next time” 😂😂😂. So its XML code looks as follows:

<LinearLayout
 android:layout_width=”match_parent”
 android:layout_height=”match_parent”
 android:gravity=”center”
 android:orientation=”vertical”
 android:padding=”15dp”>
    <ImageView…