How to apply circular reveal for activity change?

Question

I'm trying to apply the circular reveal animation for a button click which transitions from the SplashScreen activity to the MainActivity. I've tried almost all the solutions given by people but I'm not able to understand the concept of creating the custom animations like the circular reveal for activity change. I can successfully apply it to the current activity views but not to the activity transitions.

Here's my SplashScreen.java

public class SplashScreen extends AppCompatActivity {
    boolean isOpen = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {


        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splash_screen);
        final ImageButton startButton = (ImageButton) findViewById(R.id.button);
        final TextView textView = (TextView)findViewById(R.id.tv1);
        fadeInTextView(textView);
        circularRevealDelayedImageButton(startButton);

    }


    public void fadeInTextView(final TextView textView){
        textView.postDelayed(new Runnable() {
            @Override
            public void run() {
                final TextSwitcher textSwitcher = (TextSwitcher)findViewById(R.id.ssj1);
                textSwitcher.setFactory(new ViewSwitcher.ViewFactory() {

                    public View makeView() {
                        // TODO Auto-generated method stub
                        // create a TextView
                        TextView t = new TextView(SplashScreen.this);
                        // set the gravity of text to top and center horizontal
                        // set displayed text size
                        Resources r = getResources();
                        float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 23, r.getDisplayMetrics());
                        t.setTextSize(px);
                        t.setGravity(Gravity.CENTER_HORIZONTAL | Gravity.CENTER_VERTICAL);
                        t.setPadding(0,240,0,0);
                        Typeface type = Typeface.createFromAsset(getAssets(),"fonts/allura.ttf");
                        t.setTypeface(type);
                        t.setTextColor(getResources().getColor(R.color.black));
                        return t;
                    }
                });
                Animation anim = AnimationUtils.loadAnimation(getApplicationContext(),android.R.anim.fade_in);
                textView.setVisibility(View.VISIBLE);
                textView.setAnimation(anim);
                textSwitcher.postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        textSwitcher.setText("Hey There\nJaadi :)");
                    }
                },2000);

                textSwitcher.postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        textSwitcher.setText("");
                    }
                },7000);
                textSwitcher.postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        textSwitcher.setText("Press That\nHeart\nFor Me");
                    }
                },9000);


            }
        },3000);


    }


    public void circularRevealDelayedImageButton(final ImageButton startButton){
        startButton.postDelayed(new Runnable() {
            @Override
            public void run() {
                // get the center for the clipping circle
                int cx = startButton.getWidth() / 2;
                int cy = startButton.getHeight() / 2;

// get the final radius for the clipping circle
                float finalRadius = (float) Math.hypot(cx, cy);

// create the animator for this view (the start radius is zero)
                Animator anim =
                        ViewAnimationUtils.createCircularReveal(startButton, cx, cy, 0, finalRadius);

// make the view visible and start the animation
                startButton.setVisibility(View.VISIBLE);
                anim.setDuration(350);
                anim.start();
                startButton.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        startActivity(new Intent(SplashScreen.this, MainActivity.class));
                      // WHAT TO ADD HERE??? FOR CIRCULAR REVEAL ANIMATION FOR THE ABOVE INTENT???
                    }
                });
            }
        },13000);
    }


    }

I want to make the custom animation (CircularReveal) when the button is clicked and the SplashScreen transitions to MainActivity. It will be great if you can explain the code. I am trying to get solution for this for over a day now and still can not get hold of anything. And also suggest the changes needed to be done in XML

Here's MainActivity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:id="@+id/layoutcontent"
    android:visibility="invisible"
    android:transitionName="transition"
    android:layout_height="match_parent"
    tools:context="com.yourstrulyssj.foru.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</RelativeLayout>

Here Is My SplashScreen.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/layoutmain"
    android:transitionName="transition"
    tools:context="com.yourstrulyssj.foru.SplashScreen">
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/rwall"
        android:scaleType="centerCrop"

        />

    <TextSwitcher
        android:id="@+id/ssj1"
        android:layout_width="300dip"
        android:layout_height="400dip"

        android:layout_alignStart="@+id/tv1"
        android:layout_alignTop="@+id/tv1"
        android:inAnimation="@android:anim/fade_in"
        android:outAnimation="@android:anim/fade_out">

    </TextSwitcher>

    <TextView
        android:id="@+id/tv1"
        android:layout_width="300dip"
        android:layout_height="400dip"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="51dp"
        android:background="@drawable/back1"
        android:fontFamily="cursive"
        android:gravity="center"
        android:text=""
        android:textSize="80dip"
        android:visibility="invisible" />

    <ImageButton
        android:id="@+id/button"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="26dp"
        android:layout_weight="1"
        android:background="@drawable/roundedbutton"
        android:src="@drawable/ic_favorite_black_24dp"
        android:visibility="invisible" />
</RelativeLayout>

Answer 1

You can use this link : here presentActivity give you idea that how to do effect while move from one class to another.

https://android.jlelse.eu/a-little-thing-that-matter-how-to-reveal-an-activity-with-circular-revelation-d94f9bfcae28

Hope it helps to you.