1. Effect Demo
1.1. Follow this red floating button
、
As you can see, the float button disappears when the slide is up, because the user desperately wants to know what's underneath instead of going back to the top.
When the user wants to go back to their original position, they can click on the floating button and quickly return to the top. So the floating button bounced up.
2. Define an animated generic class Animatorutil
2.1. The source code is as follows
Public classAnimatorutil {Private StaticLinearoutslowininterpolator Fast_out_slow_in_interpolator =NewLinearoutslowininterpolator (); Private StaticAccelerateinterpolator Liner_interpolator =NewAccelerateinterpolator (); //Show View Public Static voidscaleshow (view view, Viewpropertyanimatorlistener Viewpropertyanimatorlistener) {view.setvisibility (View.VISI BLE); Viewcompat.animate (view). ScaleX (1.0f). ScaleY (1.0f). Alpha (1.0f). Setduration (800). Setlistener (Viewpropertyanimatorlistener). Setinterpolator (Fast_out_slow_in_interpola TOR). Start (); } //Hide View Public Static voidscalehide (view view, Viewpropertyanimatorlistener Viewpropertyanimatorlistener) {viewcompat.animate (view) . ScaleX (0.0f). ScaleY (0.0f). Alpha (0.0f). Setduration (800). Setinterpolator (Fast_out_slow_in_interpolator). Setlistener (Viewpropertyanimatorliste NER). Start (); } //Show View Public Static voidtranslateshow (view view, Viewpropertyanimatorlistener Viewpropertyanimatorlistener) {view.setvisibility (view. VISIBLE); Viewcompat.animate (view). Translationy (0). Setduration (400). Setlistener (Viewpropertyanimatorlistener). Setinterpolator (Fast_out_slow_in_interpola TOR). Start (); } //Hide View Public Static voidtranslatehide (view view, Viewpropertyanimatorlistener Viewpropertyanimatorlistener) {view.setvisibility (view. VISIBLE); Viewcompat.animate (view). Translationy (260). Setduration (400). Setinterpolator (Fast_out_slow_in_interpolator). Setlistener (Viewpropertyanimatorliste NER). Start (); }}
View Code
2.2. Member Variable analysis
This defines a linearoutslowininterpolator, System class.
It then defines a accelerateinterpolator, generic system class.
2.3. Show View Method One
Viewcompat System class. This view is displayed dynamically. Set the period to 800ms.
2.4. Hide View Method One
Viewcompat System class, where this view is dynamically hidden. Set the period to 800ms.
2.5. Show View Method Two
method is similar, but here is a fine tuning.
2.6. Hide View Method Two
method is similar, but here is a fine tuning.
3. Floating button Behavior Controller
3.1. The source code is as follows.
//FAB Behavior Controller Public classScaledownshowbehaviorextendsFloatingactionbutton.behavior { PublicScaledownshowbehavior (Context context, AttributeSet attrs) {Super(); } @Override Public BooleanOnstartnestedscroll (Coordinatorlayout coordinatorlayout, Floatingactionbutton C Hild, view directtargetchild, view target,intnestedscrollaxes) { if(Nestedscrollaxes = =viewcompat.scroll_axis_vertical) { return true; } return Super. Onstartnestedscroll (Coordinatorlayout, Child, Directtargetchild, Target, nestedscrollaxes); } Private BooleanIsanimateing =false;//Are you animating Private BooleanIsshow =true;//is already displayed Public voidOnnestedscroll (coordinatorlayout coordinatorlayout, Floatingactionbutton child, View ta Rget,intDxconsumed,intdyconsumed,intDxunconsumed,intdyunconsumed) { if((dyconsumed > 0 | | dyunconsumed > 0) &&!isanimateing && isshow) {//Swipe your finger to hide the fabAnimatorutil.translatehide (Child,NewStatelistener () {@Override Public voidOnanimationstart (view view) {Super. Onanimationstart (view); Isshow=false; } }); } Else if((dyconsumed < 0 | | dyunconsumed < 0 &&!isanimateing &&!)isshow)) {animatorutil.translateshow (Child,NewStatelistener () {@Override Public voidOnanimationstart (view view) {Super. Onanimationstart (view); Isshow=true; } });//finger slide, show fab } } classStatelistenerImplementsViewpropertyanimatorlistener {@Override Public voidOnanimationstart (view view) {isanimateing=true; } @Override Public voidonanimationend (view view) {isanimateing=false; } @Override Public voidonanimationcancel (view view) {isanimateing=false; } }}
View Code
3.2. Constructor function.
This inherits the behavior of the floating button Floatingactionbutton.behavior, the constructor directly inherits the base class.
3.3. Rewrite the first function here Onstartnestedscroll
This is still the main inheritance of the original can.
3.4. Definition of two variables
3.5. Monitor finger slide and finger slide
The swipe of the finger is judged by dyconsumed>0, and the animatorutil hidden function can be executed.
The finger slide is judged by dyconsumed<0, and executes the animatorutil display function.
3.6.AnimatorUtil custom class functions need to pass in a listener
If the animation starts, sets whether the animation is true
If the animation ends, sets whether the animation is false
If the animation is canceled, sets whether the animation is false
4. Configure the Floating button behavior in the layout
4.1. Set App:layout_behavior in the layout of the floating button
4.2. Then define a custom path in the resource file, which can be written directly on it.
5. Summarize
5.1. First customize an animated universal Class Animatorutil, which is used to dynamically display or hide the view.
5.2. Then define a floating button behavior controller, inherit Floatingactionbutton.behavior, implement two overriding methods.
In the overridden Onnestedscroll, judge the finger to slip, and then call the generic class to implement the hidden view. Judging the finger slipped and then
Call the generic class implementation to display the view.
5.3. Then define a app:layout_behavior in the layout of the floating button, and add the path to the custom class with the resource file.
Android Floating button + Slide up hide button + Slide Show button