I have performed a Translation animation on button ,everything work as i excepted ,but only the problem is after the animation the button not responding to click event please correct me
Button b=(Button)findViewById(R.id.button1);
TranslateAnimation slide=new TranslateAnimation(0, 30, 0,-40);
slide.setDuration(500);
slide.setZAdjustment(TranslateAnimation.ZORDER_TOP);
slide.setFillAfter(true);
b.startAnimation(slide);
This will translate the object in y direction:
ObjectAnimator mover = ObjectAnimator.ofFloat(v, "translationY", 0, 400);
mover.start();
If you are handling animations at lower level API (below HoneyComb) your animation actually does not moves the button but only its images.Its click will be at same place where you have placed it in your layout.
I faced this issue and I did fix it just some second ago. So, I think that I should share my solution with you guys.
In animation xml file,I removed android:fillAfter="true" when keep android:fillEnabled="true".
Register Animation listener, then in onAnimationEnd() method, I call View#Layout() to change the position of the view.
int newLeft = (int) (layoutContent.getLeft() + layoutContent.getWidth() * 0.8);
layoutContent.layout(newLeft,
layoutContent.getTop(),
newLeft + layoutContent.getMeasuredWidth(),
layoutContent.getTop() + layoutContent.getMeasuredHeight());
In my case, what the animation do is that slides the layoutContent to leftside 80% of width.
It works fine. Hope this helps.
#Update: Today, you can use ObjectAnimator on android 3.0 +. If you are developing for android under 3.0, you can find it at support library v.4. ObjectAnimator is bester for animation.
#Update#2: You can use ViewPropertyAnimator on android api higher 12 version.
It provides better performance, and fix problem with click events. Example:
mButton.animate()
.setDuration(TIME)
.translationY(VALUE)
.start();
I could achieve what you wanted but you will have manage co-ordinates manually.
See if it works for you.
public class AnimationTestActivity extends Activity {
private Button mButton;
private LinearLayout.LayoutParams params;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mButton = (Button) findViewById(R.id.button);
mButton.setOnClickListener(mClickListener);
params = (LayoutParams) mButton.getLayoutParams();
}
private android.view.View.OnClickListener mClickListener = new View.OnClickListener() {
#Override
public void onClick(View v) {
TranslateAnimation animation = new TranslateAnimation(0, 0, 0, 400);
animation.setDuration(2000);
animation.setAnimationListener(mAnimationListener);
v.startAnimation(animation);
}
};
private AnimationListener mAnimationListener = new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
params.topMargin = params.topMargin + 400;
mButton.setLayoutParams(params);
}
};
}
The animation do not change the View actually Position. even if you setfillAfter(true), The position it can accept click event is the original position.
I found an easy solution define the button final position in layout and start the animation from some position ,ie specify the fromX or fromY instead of putting as zero
Try to use this:
b.layout(0, -40, b.getWidth(), b.getHeight());
Related
In android 5.0 i am trying to work with circular reveal animation
Problem
When i click on button to start reveal animation, on first click animation doesn't start
Second Click onwards it works normally
My Code
public class MainActivity extends ActionBarActivity {
Animator a;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final View cardType = findViewById(R.id.cardtype);
cardType.setVisibility(View.GONE);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
a = ViewAnimationUtils.createCircularReveal(cardType,
cardType.getWidth(),
cardType.getHeight(),
0,
cardType.getHeight() * 2)
.setDuration(2500);
a.addListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationStart(Animator animation) {
super.onAnimationStart(animation);
cardType.setVisibility(View.VISIBLE);
}
});
a.addListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
cardType.setVisibility(View.GONE);
}
});
findViewById(R.id.icon_first_activity).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
a.start();
}
});
}
}}
I haven't tried your code, but I think you have a small ordering problem. I think you just need to set the cardType visible before you start the animation.
Edited to add:
... and you should be setting your button View.INVISIBLE, not View.GONE.
Here: This code works.
Edited once more to add:
Yes. Your problem is that you set the view GONE initially. That means it has 0 size. Then you use cardType.getHeight and cardType.getWidth as reveal coordinates. They are 0. You are going to want to set the view INVISIBLE, initially, and then use width/2 and height/2 as the center of the reveal.
Basically what others answers say, it's correct, but the problem is if you want visibility GONE (because your layout requires it GONE!) you have to set visibility INVISIBLE in the xml with height 0dp (and/or width 0dp as well) and programmatically set the correct LayoutParams even inside the click event it will work. For example my code:
...
expandButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
//To not have empty scroll, the container is INVISIBLE with 0dp height.
//Otherwise the Reveal effect will not work at the first click.
//Here I set the parameters programmatically.
viewContainer.setLayoutParams(new LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT));
if (viewContainer.getVisibility() == View.VISIBLE) {
expandButton.animate().rotation(0f).setDuration(duration).start();
Utils.unReveal(viewContainer, 0, 0);
} else {
expandButton.animate().rotation(180f).setDuration(duration).start();
Utils.reveal(viewContainer, viewContainer.getWidth(), 0);
}
}
});
...
#TargetApi(VERSION_CODES.LOLLIPOP)
public static void reveal(final View view, int cx, int cy) {
if (!hasLollipop()) {
view.setVisibility(View.VISIBLE);
return;
}
//Get the final radius for the clipping circle
int finalRadius = Math.max(view.getWidth(), view.getHeight());
//Create the animator for this view (the start radius is zero)
Animator animator =
ViewAnimationUtils.createCircularReveal(view, cx, cy, 0, finalRadius);
//Make the view VISIBLE and start the animation
view.setVisibility(View.VISIBLE);
animator.start();
}
#TargetApi(VERSION_CODES.LOLLIPOP)
public static void unReveal(final View view, int cx, int cy) {
if (!hasLollipop()) {
view.setVisibility(View.GONE);
return;
}
//Get the initial radius for the clipping circle
int initialRadius = view.getWidth();
//Create the animation (the final radius is zero)
Animator animator =
ViewAnimationUtils.createCircularReveal(view, cx, cy, initialRadius, 0);
//Make the view GONE when the animation is done
animator.addListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
view.setVisibility(View.GONE);
}
});
//Start the animation
animator.start();
}
If you set only GONE in the xml, the first time will never work because height/width/x/y/etc.. are 0. Also, if you just set INVISIBLE before the call to the animation it will not work as well, but if you start with visibility INVISIBLE it will initialize the layout params.
what i did is, Like i have two view with same height,As we now visibility gone returns 0 {height and width} than i am giving visible view height every time and its work for me.
The solution is don't get values directly into code
Either put the animation code on click and the values outside onclick
or get the values from other activity
By values i mean cardType.getWidth() and cardType.getHeight()
I'm trying to slide in a view on a RelativeLayout via an animation. Once the view is in place I have to alter the layout params of layout so that the new view doesn't block existing content. I call the code to update the layout after the animation but it occurs before the animation causing a block of area to be blank during the animation.
The following screens are before animation, during and after:
Here is the code. The relative layout is adjusted in onShowAd.
float fromY = getAdHeight();
float toY = 0;
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
mAdLayout.startAnimation(slide);
onShowAd();
mAdLayout.setVisibility(View.VISIBLE);
I tried differing orders of calling visible and other things as well as using a handler to postDelayed onShowAd() to wait the same amount of time as the ANIMATION_RATE however what happened you'd stare at the black box for the time it was post delayed and then have to wait for the animation so it was worse. In windows there's an API call LOCKWINDOWUPDATE that I could pass in a window handle to prevent updating...is there anything equivalent for a view in Android? Or any other ideas?
Incidentally when sliding the view OUT it works fine. Here is the code going the other way. onHideAd is where the layoutparams are modified in this one.
float toY = ((View) mAdLayout.getParent()).getBottom();
float fromY = 0;//toY - mAdLayout.getHeight();
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
mAdLayout.startAnimation(slide);
mAdLayout.setVisibility(View.GONE);
onHideAd();
Thanks for any suggestions!
EDIT: I added the listener and that doesn't take care of it. I have isolated it to the following code which in in the "onShowAd()" routine:
RelativeLayout.LayoutParams params = (android.widget.RelativeLayout.LayoutParams) mainFragmentContainer.getLayoutParams();
params.addRule(RelativeLayout.ABOVE, mAdLayout.getId());
mainFragmentContainer.setLayoutParams(params);
I've tried to further separate it by calling it with a handler.postDelayed and it seems like anywhere I place it in the chain of events causes it to occur BEFORE the animation itself shows. Very odd! :-(
This is the updated showAd routine. I tried reordering some of the calls as well.
float fromY = getAdHeight();
float toY = 0;
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation) {
onShowAd();
}
});
mAdLayout.setVisibility(View.VISIBLE);
mAdLayout.startAnimation(slide);
You should use an AnimationListener to accomplish what you are looking for. The problem you are running into is caused because the call to start animation returns instantly even though the animation doesn't complete for the time set to ANIMATION_RATE.
Ex for slide in:
float fromY = getAdHeight();
float toY = 0;
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
onShowAd();
}
});
mAdLayout.setVisibility(View.VISIBLE);
mAdLayout.startAnimation(slide);
i want to animate button(ie; rotation, translation) then change the text of a button. unfortunately, it always first changes the text of the button then do the animation.
How can I achieve my goal?
Pls help me
my code is like this;
AnimationSet set = new AnimationSet(true);
Animation anim1 = new RotateAnimation(0, 360, 500, 750);
anim1.setDuration(3000);
anim1.setFillAfter(true);
set.addAnimation(anim1);
Animation anim2 = new RotateAnimation(0, 360, 1024, 824);
anim2.setDuration(3000);
anim2.setFillAfter(true);
set.addAnimation(anim2);
anim2.setStartOffset(3000);
first.clearAnimation();
set.setFillAfter(true);
first.startAnimation(set);
numbers[0]=min + (int)(Math.random() * ((max - min) + 1));
Your code starts the animation but is not blocking : once the animation is started, the program goes on.
You could try getting an handler and post the change text event at the right time :
Handler mHandler=new Handler();
Runnable lRunnable =new Runnable()
{
public void run()
{
//Your change text code
}
};
mHandler.postDelayed(lRunnable , 3000); // Or any other duration so you have the right effect
A better solution is to add an AnimationListener to the animation, or if you are on JB use the view property animators and the withEndAction() method. You should avoid the old animation framework if possible. It doesn't actually change the properties, it just draw the view with a transformation.
set.setAnimationListener(new AnimationListener() {
public void onAnimationEnd() {
// ...
}
public void onAnimationStart() {
}
public void onAnimationRepeat() {
}
}
But I recommend the view property animations if you can use them. They are much better to work with.
Here is my scenario.
At first I do an animation set to my view (View.startAnimation(animationSet)) where animationSet consists of Translate + Rotate + Scale all at the same time. It works fine.
on that animationSet I have fillAfter(true).
After some time user click on a button and onClick I must start new ScaleAnimation on that same View. So if I do something like:
#Override
public void onClick(View v) {
ScaleAnimation scaleAnimation = new ScaleAnimation(mOldScaleFactor, mScaleFactor, mOldScaleFactor, mScaleFactor, mPivotX, mPivotY);
scaleAnimation.setDuration(ANIMATION_DURATION_MILIS);
scaleAnimation.setStartOffset(ANIMATION_OFFSET_MILIS);
scaleAnimation.setFillAfter(true);
v.startAnimation(scaleAnimation);
}
All the previous animation (Translate + Rotete + Scale) is forgotten.
How to start new animation from where old animation ends?
You could try to implement a listener and possible capture the information from when the previous animation left off, however I'm not sure you'll be able to query the animation for its state. Another option is to make sure the animation stops into a known state. That way you can know how you need to start the next animation.
public float param1;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.splash);
//load text view to add animation
ImageView image1 = (ImageView) findViewById(R.id.splash_imageView1);
Animation fade1 = AnimationUtils.loadAnimation(this, R.anim.fade_anim);
image1.startAnimation(fade1);
fade1.setAnimationListener(new AnimationListener() {
public void onAnimationEnd(Animation animation) {
//interrogate animation here
}
I would like to apply successive animations (say ScaleAnimation) to an ImageView showing a resource image. The animation is triggered by a button. For example, I would like to incrementally enlarge an image upon each button click.
I've set fillAfter="true" on the animation. However, all the animations start from the original state of the ImageView. It seems as if the ImageView resets its state and the animation is always the same, instead of starting from the final state of the previous animation.
What am I doing wrong?
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Button button = (Button)findViewById(R.id.Button01);
button.setOnClickListener(new OnClickListener() {
public void onClick(View arg0) {
animate();
}});
}
private void animate() {
ImageView imageView = (ImageView) findViewById(R.id.ImageView01);
ScaleAnimation scale = new ScaleAnimation((float)1.0, (float)1.5, (float)1.0, (float)1.5);
scale.setFillAfter(true);
scale.setDuration(500);
imageView.startAnimation(scale);
}
It seems as if the ImageView resets
its state and the animation is always
the same, instead of starting from the
final state of the previous animation.
Precisely! I'm sure there's a use for fillAfter="true", but I haven't figured out the point for it yet.
What you need to do is set up an AnimationListener on each Animation of relevance, and do something in the listener's onAnimationEnd() to actually persist the end state of your animation. I haven't played with ScaleAnimation so I'm not quite sure what the way to "persist the end state" would be. If this were an AlphaAnimation, going from 1.0 to 0.0, you would make the widget INVISIBLE or GONE in onAnimationEnd(), for example.
I've had the same problem and created the following code to easily use different animations. It only supports translation and alpha levels for now as I haven't used scaling, but could easily be extended to support more features.
I reset the scroll and the visibility before starting the animation, but that's just because I needed on/off animations.
And the "doEnd" boolean is there to avoid a stack overflow on the recursion (scrollTo calls onAnimationEnd for some obscure reason...)
private void setViewPos(View view, Animation anim, long time){
// Get the transformation
Transformation trans = new Transformation();
anim.getTransformation(time, trans);
// Get the matrix values
float[] values = new float[9];
Matrix m = trans.getMatrix();
m.getValues(values);
// Get the position and apply the scroll
final float x = values[Matrix.MTRANS_X];
final float y = values[Matrix.MTRANS_Y];
view.scrollTo(-(int)x, -(int)y);
// Show/hide depending on final alpha level
if (trans.getAlpha() > 0.5){
view.setVisibility(VISIBLE);
} else {
view.setVisibility(INVISIBLE);
}
}
private void applyAnimation(final View view, final Animation anim){
view.scrollTo(0, 0);
view.setVisibility(VISIBLE);
anim.setAnimationListener(new AnimationListener(){
private boolean doEnd = true;
#Override
public void onAnimationEnd(Animation animation) {
if (doEnd){
doEnd = false;
setViewPos(view, animation, anim.getStartTime() + anim.getDuration());
}
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationStart(Animation animation) {
}
});
view.startAnimation(anim);
}