Android仿Google語音呼吸按鈕效果

實現(xiàn)該效果,重要的是我們要如何實現(xiàn)這種動態(tài)的呼吸效果,因為是一種非線性運動,直接實現(xiàn)起來有些麻煩,但是幸好,android的SDK提供了一種叫interpolator屬性,通過設(shè)置該屬性為accelerate_decelerate_interpolato可以實現(xiàn)加速效果,使動畫看起來更豐滿,更具活力。?
首先,我們需要三個anim文件。?
進入效果anim:
android:interpolator="@android:anim/decelerate_interpolator"android:shareInterpolator="true">android:fromXScale="0.0"android:toXScale="0.9"android:fromYScale="0.0"android:toYScale="0.9"android:pivotX="50%"android:pivotY="50%"android:duration="1000"/>
呼吸效果anim:
android:interpolator="@android:anim/accelerate_decelerate_interpolator"android:shareInterpolator="true">android:fromXScale="0.9"android:toXScale="1.0"android:fromYScale="0.9"android:toYScale="1.0"android:duration="1500"android:pivotX="50%"android:pivotY="50%"android:repeatCount="infinite"android:repeatMode="reverse"/>
退出效果anim:
android:interpolator="@android:anim/accelerate_interpolator"android:shareInterpolator="true">android:fromXScale="0.95"android:toXScale="0.0"android:fromYScale="0.95"android:toYScale="0.0"android:pivotX="50%"android:pivotY="50%"android:duration="1000"/>
然后是Java代碼,代碼很簡單,在MainActivity中,對按鈕設(shè)置點擊事件,喚起開始動畫->執(zhí)行呼吸動畫->喚起結(jié)束對話。同時對開始和接收的動畫進行監(jiān)聽,執(zhí)行完畢后完成顯示和隱藏背景的設(shè)置。部分代碼:
private void initView() {voice.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {if (!isVisible) {back.startAnimation(animationIn);isVisible = true;} else {back.startAnimation(animationExit);isVisible = false;????????????????}}????????});}
Animtion動畫相關(guān)部分代碼:
//動畫監(jiān)聽animationIn.setAnimationListener(new Animation.AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationRepeat(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {back.startAnimation(animationVoice); //開始呼吸動畫back.setVisibility(View.VISIBLE);}});animationExit.setAnimationListener(new Animation.AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {back.clearAnimation(); //清除動畫back.setVisibility(View.INVISIBLE);}@Overridepublic void onAnimationRepeat(Animation animation) {}});
好了,一個呼吸按鈕就成了,有興趣的可以把呼吸按鈕封裝一下,做成一個自定義按鈕來使用。
評論
圖片
表情
