问题
I have a menu option in my ActionBarSherlock Actionbar that kicks off an AsyncTask. I'm trying to get the icon to animate while the background task is running. I have it working, except when I click on the icon, the icon itself will "jump" a couple pixels over to the right, and it's very noticeable. Not exactly sure what is causing that to happen.
This is what I have so far:
private MenuItem refreshItem;
private void DoRefresh()
{
final LayoutInflater inflater = (LayoutInflater)activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
final ImageView ivRefresh = (ImageView)inflater.inflate(R.layout.refresh_view, null);
final Animation rotation = AnimationUtils.loadAnimation(activity, R.anim.refresh);
ImageView ivRefresh.startAnimation(rotation);
refreshItem.setActionView(ivRefresh);
//AsyncTask is kicked off here
}
@Override
public boolean onOptionsItemSelected(final MenuItem item)
{
if (item.getItemId() == R.id.refresh) {
refreshItem = item;
this.DoRefresh();
return true;
} else {
return super.onOptionsItemSelected(item);
}
}
refresh_view.xml
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="@drawable/refresh"
/>
refresh.xml
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="infinite"
android:interpolator="@android:anim/linear_interpolator"
android:duration="1100"
/>
UPDATE:
Been fooling around with this, with no luck. It has nothing to do with the animation because if I disable the animation, the icon still jumps over to the right. If I comment out setActionView, the icon does not jump, so it has something to do with that. Have no clue, driving me nuts.
回答1:
If the menu option is an action item, you should apply the style Widget.Sherlock.ActionButton to the ImageView to keep consistency. Read this article I wrote on how to animate action items properly. http://alexfu.tumblr.com/post/19414506327/android-dev-animate-action-items
回答2:
I don't know if this will have any effect but if you play around with the pivotvalues you might sort out this problem. Perhaps only pivoting on one axis?
回答3:
Alex Fu, your article was very helpful, but there are some improvements that can be made.
Restarting the animation in onAnimationEnd each time is inefficient. Instead, set the animation repeatcount to infinite before you start it, then when the action finishes, set the repeatcount to 0. The animation will finish the current loop, and then call onAnimationEnd, where you can call setActionView(null).
I've also encountered a problem (in the emulator at least, haven't tested on a real device, as I don't have one) with both ActionBarSherlock and the native ICS ActionBar, that the last few frames of the animation overlap with the static button after calling setActionView(null). My solution was to wrap the ImageView that is being animated in a LinearLayout, and then call setVisibility(View.GONE) on the LinearLayout. If you animate a view, using setVisibility to hide it won't work, but hiding its parent will.
Here's all the relevant code:
layout/actionbar_progress.xml (note that I've added ids, though only the ImageView needs one):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/actionbar_progress_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/actionbar_progress_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:src="@drawable/ic_action_refresh"
style="@style/Widget.Sherlock.ActionButton"
/>
</LinearLayout>
anim/refresh_rotate.xml:
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:interpolator="@android:anim/linear_interpolator"
android:repeatCount="infinite">
</rotate>
repeatCount is set to infinite, but this isn't necessary, as the java code has to set it to infinite anyway.
In onCreateOptionsMenu I have
...
menuInflater.inflate(R.menu.main, menu);
mRefreshItem = menu.findItem(R.id.menu_refresh);
...
this is just to avoid doing the findItem each time the refresh button is clicked.
In onOptionsItemSelected:
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
...
case R.id.menu_refresh:
refresh();
break;
...
}
}
the refresh method is just a dummy 5 second delayed post; it calls refreshAnim to start the animation, then refreshAnimEnd when it's done to stop the animation:
private void refresh() {
refreshAnim();
getWindow().getDecorView().postDelayed(
new Runnable() {
@Override
public void run() {
refreshAnimEnd();
}
}, 5000);
}
And here are the most important parts, with comments:
private void refreshAnim() {
LayoutInflater inflater = (LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
//The inflated layout and loaded animation are put into members to avoid reloading them every time.
//For convenience, the ImageView is also extracted into a member
if (mRefreshIndeterminateProgressView == null || mRefreshRotateClockwise == null) {
mRefreshIndeterminateProgressView = inflater.inflate(R.layout.actionbar_progress, null);
mRefreshRotateClockwise = AnimationUtils.loadAnimation(this, R.anim.refresh_rotate);
mRefreshImage = mRefreshIndeterminateProgressView.findViewById(R.id.actionbar_progress_image);
}
//reset some stuff - make the animation infinite again,
//and make the containing view visible
mRefreshRotateClockwise.setRepeatCount(Animation.INFINITE);
mRefreshIndeterminateProgressView.setVisibility(View.VISIBLE);
mRefreshRotateClockwise.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {}
@Override
public void onAnimationRepeat(Animation animation) {}
@Override
public void onAnimationEnd(Animation animation) {
//This is important to avoid the overlapping problem.
//First hide the animated icon
//setActionView(null) does NOT hide it!
//as long as the animation is running, it will be visible
//hiding an animated view also doesn't work
//as long as the animation is running
//but hiding the parent does.
mRefreshIndeterminateProgressView.setVisibility(View.GONE);
//make the static button appear again
mRefreshItem.setActionView(null);
}
});
mRefreshItem.setActionView(mRefreshIndeterminateProgressView);
//everything is set up, start animating.
mRefreshImage.startAnimation(mRefreshRotateClockwise);
}
private void refreshAnimEnd() {
//sanity
if ( mRefreshImage == null || mRefreshItem == null ) {
return;
}
Animation anim = mRefreshImage.getAnimation();
//more sanity
if (anim != null) {
//let the animation finish nicely
anim.setRepeatCount(0);
} else {
//onAnimationEnd won't run in this case, so restore the static button
mRefreshItem.setActionView(null);
}
}
回答4:
Just add this to your img_layout.xml if you are using the normal ActionBar:
style="?android:attr/actionButtonStyle"
Or this with the SherLock ActionBar:
style="@style/Widget.Sherlock.ActionButton"
来源：https://stackoverflow.com/questions/10056083/actionbarsherlock-animation-moves-position