[Android] TranslateAnimation 移動アニメーション

android.view.animation.Animationのクラスを使って、Viewを移動させるTranslateAnimationを簡単に組むことができます。
 

Android Studio 3.0.1
Android 8.1.0
 



TranslateAnimation

 
Viewにアニメーションを施したいときはこのAnimationが簡単です。ただし途中で止めるなど込み入ったことはできません。Property Animation 等を使いましょう。
 
設定方法は2通りあります。
 

 

XML attributes

 
res以下にanimというフォルダーを作成してxmlファイルを置きます。

animationの属性設定は<translate />タグを使って以下のように設定します。

  • fromXDelta:開始時のx位置
  • toXDelta:終了時のx位置
  • fromYDelta:開始時のy位置
  • toYDelta:終了時のy位置
  • fillAfter:アニメーション終了時にそのままにする(true)
  • duration:アニメーション期間[msec]

移動アニメーションの開始位置と終了位置設定は3通りあります。

  • Animation.ABSOLUTE:240 のようなpixel絶対値
  • Animation.RELATIVE_TO_SELF:自分のサイズの割合、%
  • Animation.RELATIVE_TO_PARENT:parentサイズの割合、%p

TranslateAnimationは画面上を移動するので%pを使うのは画面サイズを気にせずできるのでメリットがあります。今回その方法で試してみます。
res\anim\translate_animation.xml

 
MainActivity.java

 
activity_main.xml

 
リソース
strings.xml

 
Animationしたい画像をImageViewに設定します。
 

 

コードで記述

 
TranslateAnimationのConstructorは幾つかありますが、今回使いやすいのはこれです。

    • TranslateAnimation
      • int fromXType:開始時のx位置座標のタイプ
      • float fromXValue:開始時のx位置
      • int toXType:終了時のx位置座標のタイプ
      • float toXValue:終了時のx位置
      • int fromYType:開始時のy位置座標のタイプ
      • float fromYValue:開始時のy位置
      • int toYType:終了時のy位置座標のタイプ
      • float toYValue:終了時のy位置
    • setRepeatCount():繰り返し回数
    • setDuration(msec):アニメーションの期間[msec]
    • startAnimation():アニメーションを開始
    • setFillAfter(true):アニメーション終了時にViewをそのままにする

移動アニメーションの開始位置と終了位置設定は3通りあります。

  • Animation.ABSOLUTE:240 のようなpixel絶対値
  • Animation.RELATIVE_TO_SELF:自分のサイズの割合、1.0が100%に相当
  • Animation.RELATIVE_TO_PARENT:parentサイズの割合、1.0が100%に相当

MainActivity.java

 
レイアウトはXML attributesと同じです。

 

サンプル動画

 

 
移動には以下のような異なる設定が可能です。

  • Animation.ABSOLUTE
  • Animation.RELATIVE_TO_SELF
  • Animation.RELATIVE_TO_PARENT

これらの違いを分かるように切り分けで試してみました。

実際はそれぞれのサイズを計算する必要が出てくるので、使うアプリ次第でしょうか
 
 

関連ページ:

 
References:
TranslateAnimation
Animation Resources

誤字脱字、意味不明で分からにゃイ、
などのご意見はこちらから mailフォーム

ブックマークしておくと便利です このエントリーをはてなブックマークに追加


 


ページのトップへ戻る




シェアする

  • このエントリーをはてなブックマークに追加

フォローする