I'm trying to animate a button to fade away, and then set its visibility to VIEW.GONE in order for it to not take up space on the page.
The code is as follows
myContinueButton.animate().setListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator animation) {
myContinueButton.setEnabled(false);
myContinueButton.setVisibility(View.GONE);
}
}).alpha(0f);
The issue is that the button will fade away, but then it will briefly appear in full when the visibility is set in side the onAnimationEnd.
Ive tried setting alpha before the listener, but the result is always the same:
Object fades away, then appears again on screen, then hides as it is set to View.Gone
Try to use this code
myContinueButton.animate().alpha(0f).setDuration(500).setInterpolator(new LinearInterpolator()).setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationStart(Animator animation) {
}
#Override
public void onAnimationEnd(Animator animation) {
myContinueButton.setAlpha(0f);
myContinueButton.setEnabled(false);
myContinueButton.setVisibility(View.GONE);
}
#Override
public void onAnimationCancel(Animator animation) {
}
#Override
public void onAnimationRepeat(Animator animation) {
}
}).start();
Related
I have a login screen with some EditText TextView and Button what I want to do is when the login screen is created I want to animate the first EditText from top to bottom then the second EditText from top to bottom after the first EditText is animated, so it should look like all the views are animating from top to bottom one by one.
This is kinda ugly but it'll work.
float pixels = 20f;
view1.animate().translationY(pixels).setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationEnd(Animator animation) {
view2.animate().translationY(pixels).setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationEnd(Animator animation) {
view3.animate().translationY(pixels);
}
#Override
public void onAnimationCancel(Animator animation) {
}
#Override
public void onAnimationRepeat(Animator animation) {
}
});
}
#Override
public void onAnimationCancel(Animator animation) {
}
#Override
public void onAnimationRepeat(Animator animation) {
}
});
Step 1
Animation scaleDown = AnimationUtils.loadAnimation(youContext, R.anim.scale_down);
ImagView v = findViewById(R.id.your_view);
v.startAnimation(scaleDown);//Start Animation
Step 2 Set Animation listener
Step 3 On Animation end start animated next view like above
so on.....
i started learning animation on android today, and i'm having trouble positioning views after animations end.
When app starts, It shows an search EditText in the center of the screen, and when you search for something, this EditText should slide to top using this code below
public void slideToTop(View view){
view.animate()
.translationY((-parent.getHeight()/2) + view.getHeight())
.setInterpolator(new AccelerateInterpolator())
.setDuration(500)
.setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationStart(Animator animator) {
}
#Override
public void onAnimationEnd(Animator animator) {
layoutContent.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationCancel(Animator animator) {
}
#Override
public void onAnimationRepeat(Animator animator) {
}
});
fadeOutAndHideImage(logo);
}
How can I show the results below the EditText that now is on top of the layout?
I tried to use layout_below attribute from RelativeLayout, the set the visibility when the animation ends, but it seems that the position is calculated before the animation
You have to set position of your view programatically to (-parent.getHeight()/2) + view.getHeight() using Layout Params when the animation ends, this might help you to solve your problem.
I am trying to achieve something like that
I have white circle image views in Stack currently I am doing like this to animate but it's not working properly please help me what am I doing wrong
this my code for animating but my imageViews falls down all together viewPasscodeis Linear layout to which I add imageViews pragmatically please I need little help
private void animPass() {
float bottomOfScreen = getResources().getDisplayMetrics()
.heightPixels - (viewPasscode.getHeight() * 4);
//bottomOfScreen is where you want to animate to
for (final ImageView imageView1 : passViewsStack) {
imageView1.animate()
.translationY(bottomOfScreen)
.setInterpolator(new AccelerateInterpolator())
.setInterpolator(new BounceInterpolator())
.setDuration(2000).setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationStart(Animator animation) {
}
#Override
public void onAnimationEnd(Animator animation) {
viewPasscode.removeView(imageView1);
}
#Override
public void onAnimationCancel(Animator animation) {
}
#Override
public void onAnimationRepeat(Animator animation) {
}
});
}
All is good. Just keep some difference of duration for respective views i.e. kepp a difference of 300-500 in .setDuration(2000). e.g.,
for view 1: .setDuration(2000)
for view 2: .setDuration(1500)
so on.
you will get expected results.
I have this ObjectAnimator:
cloudAnim2 = ObjectAnimator.ofFloat(cloud2ImageView, "x",500, 1000);
cloudAnim2.setDuration(3000);
cloudAnim2.setRepeatCount(ValueAnimator.INFINITE);
cloudAnim2.setRepeatMode(ValueAnimator.RESTART);
cloudAnim2.start();
cloudAnim2.addListener(new AnimatorListener() {
#Override
public void onAnimationCancel(Animator animation) {}
#Override
public void onAnimationEnd(Animator animation) {}
#Override
public void onAnimationRepeat(Animator animation) {}
#Override
public void onAnimationStart(Animator animation) {}
});
As you can see, the cloud will start of position 500 and will animate to position 1000, and then it will repeat the animation.
The problem is that the animation is becoming slower as it is near his finish. I mean, the speed of the movement is not allways the same.
I want that the speed becomes allways the same. How can this be done?
thanks
The default interpolator is AccelerateDecelerateInterpolator, so you will need to set it manually to the LinearInterpolator.
animation.setInterpolator(new LinearInterpolator());
I have some spots, which are buttons, animating vertically from top to the bottom of the screen. I have implemented the below:
spot.animate().x(x2).y(y2).scaleX(SCALE_X).scaleY(SCALE_Y).setDuration(animationTime).setListener
(
new AnimatorListenerAdapter()
{
#Override
public void onAnimationStart(Animator animation)
{
animators.add(animation);
}
public void onAnimationEnd(Animator animation)
{
animators.remove(animation);
if (!gamePaused )
{
....
}
}
}
);
Question:
I discover that the buttons animating with accelerating speed at the start and decelerating speed upon end of animation.
How could the code be modified with a LinearInterpolator such that the animation is having uniform speed throughout its journey?
Thanks!!
Did you try to use setInterpolator(TimeInterpolator interpolator) method from ViewPropertyAnimator class? So your code would look like:
spot.animate().x(x2).y(y2).scaleX(SCALE_X).scaleY(SCALE_Y).setInterpolator(new LinearInterpolator()).setDuration(animationTime).setListener(
new AnimatorListenerAdapter()
{
#Override
public void onAnimationStart(Animator animation)
{
animators.add(animation);
}
public void onAnimationEnd(Animator animation)
{
animators.remove(animation);
if (!gamePaused )
{
....
}
}
}
);