[Android] TransitionDrawable クロス・フェード animation

LayerDrawableの拡張で、first layerとsecond layerのクロスフェードをさせることができます。
 
transition drawable 01 - [Android] TransitionDrawable クロス・フェード animation

Android Studio 3.5.3
API 29

 

R904D.P21641J - [Android] TransitionDrawable クロス・フェード animationimpression?a id=2545321&p id=969&pc id=1263&pl id=47128 - [Android] TransitionDrawable クロス・フェード animation

cross-fade

 
AlphaAnimationではAlpha値を変化させてfede in/out を実現していましたが、TransitionDrawableはfirst layerとsecond layerのcross-fade効果をImageViewに設定できます。
 
transitiondrawable - [Android] TransitionDrawable クロス・フェード animation

 

TransitionDrawable

 
最初の画像とフェード後の画像を2枚@drawableに配置
同じdrawableにtransitionを記述した下のようなxmlファイルも置きます。
 
animation.xml

 
レイアウトファイルでImageViewをセットして、その背景として先のanimation.xmlを設定します。(srcにするとエラーになります)
 

 

 

サンプルコード

 
MainActivity.java

 
activity_main.xml

 
strings.xml

 

サンプル動画

 

 
setCrossFadeEnabled(boolean)
これは設定した画像で効果が分からないことがあります。
trueの場合は、最初の画像が消えていきますが
falseにすると最初の画像も残ります。背景を透明にした2枚の画像ではそれが明確です。
 
 
関連ページ:

 
References:
TransitionDrawable
LayerDrawable

アプリ開発が上達するお勧め

アプリ開発を始めたけどわからないところがあり、誰かに聞きたいけど周りにはそんな人はいない…あるいは、会社で働いていて日中そんなに時間をとれないなど、オンラインのプログラミングスクールがいいでしょう。

TECH ACADEMY
Androidアプリコース



Code Camp
現役エンジニアによるオンラインプログラミングスクール【CodeCamp】


直接(ネットで)誰か分かる人に聞いた方が早く解決して、上達も早いと思います。



侍エンジニア塾
侍エンジニア塾 無料体験レッスン


とても簡単なことなのに本やネットの画像だけでは分かりにくいことはあります。実際に質問してピンポイントで教えてもらうと、なんだそんなこと、と言うのがけっこうあります。


シェアする

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

フォローする