Attribute animation
DEMO address: github.com/chaozhouzha…
ValueAnimator 1
Value animation specific steps:
/** * Attribute animation value animation: * 3. Specify an estimator and calculate the specific animation value according to the progress change rule of the interpolator * 4. Set a listener and listen to the specific animation value returned by the estimator. To set property changes to the control */Copy the codeUse value animation to achieve parabolic animation:
ValueAnimator animator = ValueAnimator.ofObject(new FallingBallEvaluator(),new Point(0,0),new Point(500,500));
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
mPoint = (Point) animation.getAnimatedValue();
mIvBall.layout(mPoint.x,mPoint.y,mPoint.x+mIvBall.getWidth(),mPoint.y+mIvBall.getHeight());
}
});
animator.setDuration(2000);
animator.start();
Copy the code
DEMO address: github.com/chaozhouzha…
2, ObjectAnimator
Object animation concrete steps:
/** * Attribute animation object animation: * 1, specify the animation numerical interval and * 2 attributes and controls, to specify the interpolation, numerical definition animation of the progress change law * 3, specify the value, based on the progress of the interpolator change law of numerical calculation of specific animation * 4, set the tone of the systems with control set method, according to the attributes assembled set method and reflection calls, And pass the current value as an argument to */Copy the codeCustom ImageView:
public class FallingImageView extends androidx.appcompat.widget.AppCompatImageView { public FallingImageView(Context context) { super(context); } public FallingImageView(Context context, AttributeSet attrs) { super(context, attrs); } public FallingImageView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } @param point */ public void setFallingPos(point point){ layout(point.x,point.y,point.x+getWidth(),point.y+getHeight()); } @return */ public Point getFallingPos(){return new Point(0,0); }}Copy the codeUse value animation to achieve parabolic animation:
ObjectAnimator objectAnimator = ObjectAnimator.ofObject(mIvBall,"fallingPos",new FallingBallEvaluator(),new Point (0, 0), new Point (500500)); objectAnimator.setDuration(2000); objectAnimator.start();Copy the codeDEMO address: github.com/chaozhouzha…
3. AnimatorSet
Menu animation using animation collections:
Open:
private void menuOpen(View view, int currIndex, int totalIndex, Int radius) {// Double degree = math.toradians (90)/(totalIndex - 1) * currIndex; Int translationX = -(int) (radius * math.sin (degree)); Int translationY = -(int) (radius * math.cos (degree)); AnimatorSet animatorSet = new AnimatorSet(); ObjectAnimator objectAnimatorTranslationX = ObjectAnimator.ofFloat(view, "translationX", 0, translationX); ObjectAnimator objectAnimatorTranslationY = ObjectAnimator.ofFloat(view, "translationY", 0, translationY); ObjectAnimator objectAnimatorScaleX = ObjectAnimator.ofFloat(view, "ScaleX", 0F, 1F); ObjectAnimator objectAnimatorScaleY = ObjectAnimator.ofFloat(view, "ScaleY", 0F, 1F); ObjectAnimator objectAnimatorAlpha = ObjectAnimator.ofFloat(view, "alpha", 0F, 1F); animatorSet.playTogether(objectAnimatorTranslationX, objectAnimatorTranslationY, objectAnimatorScaleX, objectAnimatorScaleY, objectAnimatorAlpha); animatorSet.setDuration(500); animatorSet.start(); }Copy the codeClose:
private void menuClose(View view, int currIndex, int totalIndex, Int radius) {// Double degree = math.pi * currIndex /(totalIndex-1)*2); Int translationX = -(int) (radius * math.sin (degree)); Int translationY = -(int) (radius * math.cos (degree)); AnimatorSet animatorSet = new AnimatorSet(); ObjectAnimator objectAnimatorTranslationX = ObjectAnimator.ofFloat(view, "translationX", translationX, 0); ObjectAnimator objectAnimatorTranslationY = ObjectAnimator.ofFloat(view, "translationY", translationY, 0); ObjectAnimator objectAnimatorScaleX = ObjectAnimator.ofFloat(view, "ScaleX", 1F, 0F); ObjectAnimator objectAnimatorScaleY = ObjectAnimator.ofFloat(view, "ScaleY", 1F, 0F); ObjectAnimator objectAnimatorAlpha = ObjectAnimator.ofFloat(view, "alpha", 1F, 0F); animatorSet.playTogether(objectAnimatorTranslationX, objectAnimatorTranslationY, objectAnimatorScaleX, objectAnimatorScaleY, objectAnimatorAlpha); animatorSet.setDuration(500); animatorSet.start(); }Copy the code
DEMO address: github.com/chaozhouzha…
4. Property value and Keyframe PropertyValuesHolder Keyframe
/** * Keyframe, to facilitate the control of animation speed, indicates that a certain point in time should be in a certain position * video, 1 second to play 24 frames of pictures * two elements of a keyframe: Time and location * fraction Animation progress * value Specifies the animation value for the animation progress * KeyFrame can be set with interpolators. Linear interpolators are used by default * Phone ringing animation, one phone picture, 11 keyframes */Copy the codeAnimate a ringing phone using property values and keyframes:
Keyframe1 = keyframe.offloat (0f, 0); Keyframe keyframe2 = keyframe.offloat (0.1f, -20f); Keyframe keyframe3 = keyframe.offloat (0.2f, 20f); Keyframe Keyframe4 = keyframe.offloat (0.3f, -20f); Keyframe Keyframe5 = keyframe.offloat (0.4f, 20f); Keyframe keyframe6 = keyframe.offloat (0.5f, -20f); Keyframe Keyframe7 = keyframe.offloat (0.6f, 20f); Keyframe Keyframe8 = keyframe.offloat (0.7f, -20f); Keyframe keyframe9 = keyframe.offloat (0.8f, 20f); Keyframe keyframe10 = keyframe.offloat (0.9f, -20f); Keyframe keyframe11 = keyframe.offloat (1.0f, 0f); PropertyValuesHolder propertyValuesHolder = PropertyValuesHolder.ofKeyframe("rotation", keyframe1, keyframe1, keyframe2, keyframe3, keyframe4, keyframe5, keyframe6, keyframe7, keyframe8, keyframe9, keyframe10, keyframe11); X Keyframe keyFramesescalex0 = keyframe.offloat (0,1f); Keyframe keyframeScaleX1 = Keyframe. OfFloat (0.1 f to 1.1 f); Keyframe keyframeScaleX9 = Keyframe. OfFloat (0.9 f to 1.1 f); Keyframe keyframeScaleX10 = Keyframe.ofFloat(1f,1f); PropertyValuesHolder propertyValuesHolderScaleX = PropertyValuesHolder.ofKeyframe("ScaleX", keyframeScaleX0,keyframeScaleX1,keyframeScaleX9,keyframeScaleX10); Y Keyframe keyFramesescaley0 = keyframe.offloat (0,1f); Keyframe keyframeScaleY1 = Keyframe. OfFloat (0.1 f to 1.1 f); Keyframe keyframeScaleY9 = Keyframe. OfFloat (0.9 f to 1.1 f); Keyframe keyframeScaleY10 = Keyframe.ofFloat(1f,1f); PropertyValuesHolder propertyValuesHolderScaleY = PropertyValuesHolder.ofKeyframe("ScaleY", keyframeScaleY0,keyframeScaleY1,keyframeScaleY9,keyframeScaleY10); ObjectAnimator objectAnimator = ObjectAnimator.ofPropertyValuesHolder(mIvPhone, propertyValuesHolder,propertyValuesHolderScaleX,propertyValuesHolderScaleY); objectAnimator.setDuration(1000); objectAnimator.start();Copy the code
DEMO address: github.com/chaozhouzha…
5, Layout animation LayoutTransition
/** * LayoutTransition.APPEARING; Animations of new elements appearing in the container; * LayoutTransition.CHANGE_APPEARING; Display new elements in the container, other elements need to change the animation; * LayoutTransition.CHANGE_DISAPPEARING; Animation when old elements are removed from the container and other elements need to be changed; * LayoutTransition.CHANGING; * LayoutTransition.DISAPPEARING; Animation of old elements being removed from the container; * /Copy the codeAnimation to remove layout internal controls:
/** * LayoutTransition LayoutTransition = new LayoutTransition(); ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(null, "rotation", 0f, 90f, 0f); layoutTransition.setAnimator(LayoutTransition.DISAPPEARING, objectAnimator); / * * * set spacing between animation * / layoutTransition setStagger (layoutTransition. DISAPPEARING, 1000); mClLayoutTransition.setLayoutTransition(layoutTransition);Copy the code/ * * * * remove layout/mClLayoutTransition removeView (mIvTest);Copy the codeDEMO address: github.com/chaozhouzha…
6. Evaluator
Estimator, according to the change rule of the numerical progress of the interpolator, calculate the specific animation value. A custom evaluator that implements TypeEvaluator TypeEvaluator<Integer> and passes in the concrete type of the generic type. Extension: Custom Interpolation, implementation time Interpolation TimeInterpolator, realize Interpolation method for Interpolation, can directly implement Interpolator Interpolator, because Interpolator inheritance is time Interpolator TimeInterpolator.Copy the codeCustom estimator:
Public class ReverseEvaluator implements TypeEvaluator<Integer> {/** * @param fraction * @param endValue specifies the endValue of the animation value range. * @return specifies the animation value that the valuer returns to the listener. */ @override public Integer evaluate(float fraction, Integer startValue, Integer endValue) { return (int) (endValue - fraction * (endValue - startValue)); }}Copy the codeDEMO address: github.com/chaozhouzha…
Android technology stack public number:
