Android: Ripple Background Programmatically

后端 未结 3 1929
忘掉有多难
忘掉有多难 2020-12-14 10:37

I am currently creating an Android app where someone can input their name, press a button, and then it just outputs their name back to them.

One effect that I would

相关标签:
3条回答
  • 2020-12-14 10:47

    check this site, "Android Ripple Background" is a library to do it and the min sdk is 11 (Android 3.0 Honeycomb)
    https://android-arsenal.com/details/1/1107

    0 讨论(0)
  • 2020-12-14 10:59

    EDIT:

    I tested this by making a small app

    First of all hide the view you want to reveal in this animation.

    The view can be from the same layout and in xml its visibility should be invisible so that the animation will reveal it.

    You can set the view height and width to match parent if you want to create a full screen animation...

    Take your original and reveal view both in frame layout

    In my case,I have used this:

     <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">
    
                <TextView android:text="Hello World!"                    
                    android:layout_width="wrap_content"
                    android:textSize="20sp"
                    android:layout_height="wrap_content" />
                <LinearLayout 
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:orientation="vertical" android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/colorPrimaryDark"
                android:id="@+id/revealiew"
                android:visibility="invisible"
                >
    </FrameLayout>
    

    then in your activity on button click or some event do this:

        fab.setOnClickListener(new View.OnClickListener() {
                @TargetApi(Build.VERSION_CODES.LOLLIPOP)
                @Override
                public void onClick(View view) {
                    // previously invisible view
                    View myView = findViewById(R.id.revealview);
    
    // get the center for the clipping circle
                    int cx = myView.getWidth() / 2;
                    int cy = myView.getHeight() / 2;
    
    // get the final radius for the clipping circle
                    int finalRadius = Math.max(myView.getWidth(), myView.getHeight());
    
    // create the animator for this view (the start radius is zero)
                    Animator anim =
                            ViewAnimationUtils.createCircularReveal(myView, cx, cy, 0, finalRadius);
    
                    //Interpolator for giving effect to animation
                    anim.setInterpolator(new AccelerateDecelerateInterpolator());
                    // Duration of the animation
                    anim.setDuration(1000);
    
    // make the view visible and start the animation
                    myView.setVisibility(View.VISIBLE);
                    anim.start();
                }
            });
        }
    

    You can take detailed look at official documentation here: http://developer.android.com/training/material/animations.html

    0 讨论(0)
  • 2020-12-14 11:11

    What you are describing is a reveal effect on the background.

    From the official doc you can find ready to use examples:

    1) Here is how to reveal a previously invisible view using reveal effect:

     // previously invisible view
     View myView = findViewById(R.id.my_view);
    
     // get the center for the clipping circle
     int cx = myView.getWidth() / 2;
     int cy = myView.getHeight() / 2;
    
     // get the final radius for the clipping circle
     int finalRadius = Math.max(myView.getWidth(), myView.getHeight());
    
     // create the animator for this view (the start radius is zero)
     Animator anim =
         ViewAnimationUtils.createCircularReveal(myView, cx, cy, 0, finalRadius);
    
     // make the view visible and start the animation
     myView.setVisibility(View.VISIBLE);
     anim.start();
    

    2) Here is how to hide a previously visible view using the reveal effect:

     // previously visible view
     final View myView = findViewById(R.id.my_view);
    
     // get the center for the clipping circle
     int cx = myView.getWidth() / 2;
     int cy = myView.getHeight() / 2;
    
     // get the initial radius for the clipping circle
     int initialRadius = myView.getWidth();
    
     // create the animation (the final radius is zero)
     Animator anim =
         ViewAnimationUtils.createCircularReveal(myView, cx, cy, initialRadius, 0);
    
     // make the view invisible when the animation is done
     anim.addListener(new AnimatorListenerAdapter() {
         @Override
         public void onAnimationEnd(Animator animation) {
             super.onAnimationEnd(animation);
             myView.setVisibility(View.INVISIBLE);
         }
     });
    
     // start the animation
     anim.start();
    

    In you app, you can use a colored background layer (invisible at the beginning) and then use the reveal effect on it.

    0 讨论(0)
提交回复
热议问题