關於在toolbar 的menu中控制元件或者menu的item做動畫的實現
阿新 • • 發佈:2019-01-23
突發奇想,突然想給toobar上面的那個掃一掃標誌做個動畫,這樣子明顯一些,
但是真的開始做了,才發現原來跟平常的view做動畫 有點不一樣。
首先是我的menu xml檔案
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/action_capture" android:icon="@drawable/ic_action_scan" android:orderInCategory="100" android:title="@string/menu_capture" app:showAsAction="always" /> <item android:id="@+id/action_about_us" android:orderInCategory="200" android:title="@string/menu_about_us" app:showAsAction="never" /> <item android:id="@+id/action_feedback" android:orderInCategory="300" android:title="@string/menu_feedback" app:showAsAction="never" /> </menu>
可以看到 主要就是那
ic_action_scan
這個 做動畫呢。那麼接下來正式開始了
我又重新建立了個layout佈局檔案,裡面就一個imageview。主要就是顯示 掃一掃圖片的
action_view.xml
<?xml version="1.0" encoding="utf-8"?> <ImageView xmlns:android="http://schemas.android.com/apk/res/android" style="@android:style/Widget.ActionButton" android:layout_width="wrap_content" android:scaleType="centerInside" android:layout_height="wrap_content" /> <!-- 掃一掃動畫-->
最後就是在 activity中做動畫了
@Override public boolean onOptionsItemSelected(MenuItem item) { if (mActionBarDrawerToggle != null && mActionBarDrawerToggle.onOptionsItemSelected(item)) { return true; } switch (item.getItemId()) { case R.id.action_capture: showToast("掃一掃"); showAnimate(item); //這裡開始動畫 break; case R.id.action_about_us: showToast("關於我們"); break; case R.id.action_feedback: showToast("反饋"); break; } return super.onOptionsItemSelected(item); }
/**
* item做動畫
*
* @param item
*/
private void showAnimate(MenuItem item) {
hideAnimate();
menuItem = item;
//這裡使用一個ImageView設定成MenuItem的ActionView,這樣我們就可以使用這個ImageView顯示旋轉動畫了
ImageView qrView = (ImageView) getLayoutInflater().inflate(R.layout.action_view, null);
qrView.setImageResource(R.drawable.ic_action_scan);
menuItem.setActionView(qrView);
//顯示動畫
Animation animation = AnimationUtils.loadAnimation(this,R.anim.shake);
animation.setRepeatMode(Animation.RESTART);
animation.setRepeatCount(Animation.INFINITE);
qrView.startAnimation(animation);
}
/**
* 關閉動畫
*/
private void hideAnimate() {
if(menuItem != null){
View view = menuItem.getActionView();
if(view != null){
view.clearAnimation();
menuItem.setActionView(null);
}
}
}
上面用到了2個動畫布局檔案
cycle_7.xml
<cycleInterpolator xmlns:android="http://schemas.android.com/apk/res/android"
android:cycles="7" />
shake.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXDelta="0"
android:interpolator="@anim/cycle_7"
android:toXDelta="10" />