Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Androidの物理ベースアニメーション

 Androidの物理ベースアニメーション

SpringAnimationクラスを例に、追加されたPhysics-based Animationの導入を紹介します。

Takahiro Shimokawa

December 18, 2017
Tweet

More Decks by Takahiro Shimokawa

Other Decks in Programming

Transcript

  1. Androidͷ෺ཧϕʔεΞχϝʔ
    γϣϯ
    Լ઒ܟ߂ on potatotips#46
    1

    View Slide

  2. Introduction
    — Twitter/GitHub : @androhi
    — Android application engineer at FiNC inc.
    — https://play.google.com/store/apps/details?
    id=jp.co.fincapp&hl=ja
    2

    View Slide

  3. Android animation
    — Property Animation
    — ΦϒδΣΫτͷҐஔ΍େ͖͞ͳͲͷϓϩύςΟΛมԽͤ͞Δ
    — View Animation
    — ΞχϝʔγϣϯΛఆٛͨ͠xmlϑΝΠϧΛ࢖͏
    — Drawable Animation
    — ύϥύϥອը
    — Physics-based Animation <- Added!
    — ෺ཧ๏ଇʹԊͬͨϦΞϧͳΞχϝʔγϣϯ
    3

    View Slide

  4. Physics-based Animation
    — APIΨΠυ
    — https://developer.android.com/guide/topics/
    graphics/physics-based-animation.html
    — Google I/O 2017 video (Android Animations Spring to
    Life)
    — https://www.youtube.com/watch?v=BNcODK-Ju0g
    4

    View Slide

  5. Physics-based Animation
    1. Spring Animation
    — όωͷྗʹΑΔΞχϝʔγϣϯ
    2. Fling Animation
    — ॳظͷ੎͍Λ࣋ͪঃʑʹݮ଎͢ΔΞχϝʔγϣϯ
    5

    View Slide

  6. Spring Animation
    dependencies {
    compile "com.android.support:support-dynamic-animation:27.0.2"
    }
    ओʹ͜ΕΒͷΫϥεΛ࢖༻͢Δ
    — SpringAnimation class
    — SpringForce class
    6

    View Slide

  7. Create spring animation
    val springAnimation = SpringAnimation(imageView, SpringAnimation.TRANSLATION_X)
    springAnimation.spring = SpringForce().apply {
    // ݮਰ཰Λઃఆ
    dampingRatio = SpringForce.DAMPING_RATIO_MEDIUM_BOUNCY
    // ߶ੑΛઃఆ
    stiffness = SpringForce.STIFFNESS_MEDIUM
    }
    springAnimation.start()
    7

    View Slide

  8. Demo
    https://github.com/androhi/
    PhysicsBasedAnimationSample
    8

    View Slide

  9. Tips: animateToFinalPosition() method
    ҎԼΛ྆ํॲཧͯ͘͠ΕΔ
    1. ࠷ޙͷҐஔΛηοτ
    — call setFinalPosition()
    2. ΞχϝʔγϣϯΛ։࢝
    — call start()
    9

    View Slide

  10. Summary
    — ͜Ε·ͰͷΞχϝʔγϣϯΫϥεͷΑ͏ʹࡉ͔͍ύϥϝʔ
    λʔΛௐ੔ͤͣʹɺϦΞϧͳΞχϝʔγϣϯ͕࣮૷Ͱ͖
    Δɻ
    — ΦϒδΣΫτಉ࢜ͷ࿈ಈͳͲɺෳࡶͳΞχϝʔγϣϯ΋࣮
    ૷Ͱ͖Δɻ
    10

    View Slide

  11. Thank you for listening
    11

    View Slide