animations (lecture 17 – animations)

Download Animations (Lecture 17 – animations)

Post on 13-Apr-2017

82 views

Category:

Education

0 download

Embed Size (px)

TRANSCRIPT

  • AnimationsAndroid

  • Animation Frameworks (Drawable Animations, View Animations, Propertry Animations)Layout Transitions (Layout Animations, Transitions Framework)Window Transitions (Custom Animations, Shared Elements)Moar (Ripples, Reveals, Links)

  • Animation Frameworks

    Drawable Animations - View Animations - viewProperty Animations -

  • Drawable Animations

    :

    1 2 3 4 5

    :

    1 AnimationDrawable mAnimation = new AnimationDrawable(); 2 // 3 mAnimation.setOneShot(false); 4 mAnimation.addFrame(smile1, 250); 5 mAnimation.addFrame(smile1, 250); 6 7 AnimationDrawable animation = (AnimationDrawable)image.getBackground(); 8 animation.start()

  • +/- Drawable Animations

    -> ,

  • View Animations1 2 4 9

    Animation anim = AnimationUtils.loadAnimation(this, R.anim.test); view.startAnimation(anim);

  • Views (alpha, translate, scale, rotate)

  • Property Animations1 ValueAnimator animation = ValueAnimator.ofFloat(0f, 1f); 2 animation.setDuration(1000);3 animation.start(); 4 5 ObjectAnimator anim = ObjectAnimator.ofFloat(shape, "translationX",300); 6 anim.start();

  • Change Fragment animation

    ft.setCustomAnimations(android.R.animator.fade_in, android.R.animator.fade_out);

    1

  • Animating Layout Changes1

  • Transitions Framework

  • 1 3 7 9 10 11

    mSceneRoot = (ViewGroup) ndViewById(R.id.scene_root);

  • 1

    1 5

  • Layout1 Scene mAScene; 2 Scene mAnotherScene; 3 4 // Create the scenes 5 mAScene = Scene.getSceneForLayout(mSceneRoot, R.layout.a_scene, this); 6 mAnotherScene = 7 Scene.getSceneForLayout(mSceneRoot, R.layout.another_scene, this);

  • Transition

    1. res/transition/

    2. xml (res/transition/fade_transition.xml)

    Transition mFadeTransition = TransitionInflater.from(this). inflateTransition(R.transition.fade_transition);

    3. Transition mFadeTransition = new Fade();

  • Transition

    1.

    TransitionManager.go(mEndingScene, mFadeTransition);

    1.

    TransitionManager.beginDelayedTransition(mRootView, mFade); mRootView.addView(mLabelText);

  • Shared element 1 final View imgContainerView = findViewById(R.id.img_container); 2 3 // get the common element for the transition in this activity 4 final View androidRobotView = findViewById(R.id.image_small); 5 6 // define a click listener 7 imgContainerView.setOnClickListener(new View.OnClickListener() { 8 @Override 9 public void onClick(View view) { 10 Intent intent = new Intent(this, Activity2.class); 11 // create the transition animation - the images in the layouts 12 // of both activities are defined with android:transitionName="robot" 13 ActivityOptions options = ActivityOptions 14 .makeSceneTransitionAnimation(this, androidRobotView, "robot"); 15 // start the new activity 16 startActivity(intent, options.toBundle()); 17 } 18 });

  • Animate View State Changes 1 2 3 4 8 9 10 13 14 18 19 20

  • Ripples1 2 3 4 5 6 7

  • Circular Reveal1 int finalRadius = Math.hypot(myView.getWidth(), myView.getHeight()); 2 3 // create the animator for this view (the start radius is zero) 4 Animator anim = 5 ViewAnimationUtils.createCircularReveal(myView, 0, 0, 0, finalRadius); 6 anim.start();

  • View animationView animation examplesMaterial animationsShared Element Activity TransitionTransitionsAndroid arsenal

    http://developer.android.com/guide/topics/graphics/view-animation.htmlhttp://www.androidhive.info/2013/06/android-working-with-xml-animations/https://developer.android.com/training/material/animations.htmlhttps://github.com/codepath/android_guides/wiki/Shared-Element-Activity-Transitionhttp://developer.android.com/training/transitions/index.htmlhttps://android-arsenal.com/