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.
Related
I have a expand more icon on linearLayout in expandable recycler view
I want when click on linearLayout is clicked layout will expand and this icon will rotate with animation in 180 degrees like below-
here is my action code:
rotationAngle = rotationAngle == 0 ? 180 : 0;
expandArrow.animate().rotation(rotationAngle).setDuration(500).start();
where rotationalAngle=0; is declared globally.
Can you find me a proper solution?
ImageV.animate().rotation(isExpanded()? -180 : 0 )
.setInterpolator(new SineInOut60())
.setDuration(2000)
.withLayer();
You can use an AnimationListener to set a new Drawable when Animation is finished:
expandArrow.animate().setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationStart(Animator animator) {
}
#Override
public void onAnimationEnd(Animator animator) {
expandIcon.setImageResource(R.drawable.arrow_up);
}
#Override
public void onAnimationCancel(Animator animator) {
}
#Override
public void onAnimationRepeat(Animator animator) {
}
}).rotation(rotationAngle).setDuration(500).start();
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'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();
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 want to implement zoom feature on an ImageButton by Property Animation. For example, when I click the button, it will zoom out. And when I click it again, it will zoom in.
Here is part of my code:
OnClickListener clickPlayButtonHandler = new OnClickListener() {
#Override
public void onClick(View v) {
final ImageButton clickedButton = (ImageButton) v;
if((Boolean) v.getTag()) {
// zoom out
clickedButton.animate().setInterpolator(new AnticipateInterpolator()).setDuration(500).scaleXBy(-0.4f).scaleYBy(-0.4f).setListener(new Animator.AnimatorListener() {
#Override
public void onAnimationStart(Animator animation) {
clickedButton.setImageResource(R.drawable.bg_pause);
System.out.println(clickedButton.getWidth()); // output the width of the button for checking
}
#Override
public void onAnimationEnd(Animator animation) {
clickedButton.setTag(false);
int d = clickedButton.getWidth();
System.out.println(clickedButton.getWidth());// output the width of the button for checking
}
#Override
public void onAnimationCancel(Animator animation) {}
#Override
public void onAnimationRepeat(Animator animation) { }
});
} else {
// process zoom in
}
}
};
I printed the width of the button before the animation start and the animation finished. However, I found they were the same. I thought when the zoom out animation finished the button width should be small than before. But it didn't.
Could not change view size by ViewPropertyAnimator?
There won't be changes in clickedButton.getWidth(), because the width of a view is not affected by scaling. You can think of getWidth() as a way to get unscaled width of a view. To change the width of a View requires a new measure/layout pass.
ViewPropertyAnimator doesn't change View's width/height or anything that could potentially trigger another layout pass. This is simply because layout passes are expensive and therefore could cause frame skipping, which is the last thing we want see during an Animation.
If you need to get scaled width of the button, you can do getScaleX() * clickedButton.getWidth()
Try the ObjectAnimator:
ObjectAnimator xAnimator =
ObjectAnimator.ofFloat(clickedButton, "scaleX", 1.0f, -0.4f);
ObjectAnimator yAnimator =
ObjectAnimator.ofFloat(clickedButton, "scaleY", 1.0f, -0.4f);
AnimatorSet animatorSet = new AnimatorSet();
animatorSet.setDuration(500);
animatorSet.playTogether(xAnimator, yAnimator);
animatorSet.setInterpolator(new AnticipateInterpolator());
animatorSet.addListener(new Animator.AnimatorListener() {
#Override
public void onAnimationStart(Animator animation) {
clickedButton.setImageResource(R.drawable.bg_pause);
System.out.println(clickedButton.getWidth());
}
#Override
public void onAnimationEnd(Animator animation) {
clickedButton.setTag(false);
int d = clickedButton.getWidth();
System.out.println(clickedButton.getWidth());
}
#Override
public void onAnimationCancel(Animator animation) {
}
#Override
public void onAnimationRepeat(Animator animation) {
}
});
animatorSet.start();