I have been trying to animate view in android and I have done that animation but that problem is that some times the animation stuck in the middle I don't know why.
what I am doing is I have a view in the middle and that view contains horizontal list view and when an item is clicked the view animates to the top and on the top when user clicks it goes down to its original position
here is the code for animation.
public class DropDownAnim extends Animation {
private final float targetHeight;
private final View view;
private final boolean down;
public DropDownAnim(View view, float targetHeight, boolean down) {
this.view = view;
this.targetHeight = targetHeight;
this.down = down;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
int newHeight;
if (down) {
newHeight = (int) (targetHeight * interpolatedTime);
} else {
newHeight = (int) (targetHeight * (1 - interpolatedTime));
}
view.getLayoutParams().height = newHeight;
view.requestLayout();
}
#Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
}
#Override
public boolean willChangeBounds() {
return true;
}
}
when the view that contains horizontal list view and in that an item is clicked I am doing
DropDownAnim drop = new DropDownAnim(_View, (width_And_Height[1] / 100) *
Utils.get_Percentage_For_animate_View_Based_On_Mobile_Resloution(),
true); //true means go to top
drop.setDuration(DURATION);
_View.setAnimation(drop);
_View.startAnimation(drop);
and when the view is on the top
DropDownAnim drop = new DropDownAnim(_View, (width_And_Height[1] / 100) * Utils.get_Percentage_For_animate_View_Based_On_Mobile_Resloution(),
false);//false means go to is orignal position
drop.setDuration(DURATION);
_View.setAnimation(drop);
_View.startAnimation(drop);
this is returning the height of the screen.
width_And_Height[1]
first when the horizontal scroll view is in the center and i click on mad it goes up and when the horizontal scroll view is on top and i click on map it comes to its orignal position.
But now the problem is some times the view not come to its orignal position from top and stuck in the middle
here are the images.
when the horizontal scroll view is in the middle of screen
when the horizontal scroll view is on The Top of screen
when the view not come to its original position from top and stuck in the middle
I dont know what is the problem
Thank's for making time for my question,and please HELP :)
I am not sure why you are extending an Animation. If you are trying to change the position or height of a view you should be using PropertyAnimations.
If you are trying to grow a view use a simple ObjectAnimator and do the following.
ObjectAnimator animation = ObjectAnimator.ofFloat(mView,"scaleX",0,2);
animation.setDuration(duration);
animation.start();
Related
I am using following code to animate expandable layout:
class ExpandAnimation extends Animation {
private View _view;
private int _startHeight;
private int _finishHeight;
public ExpandAnimation( View view, int startHeight, int finishHeight ) {
_view = view;
_startHeight = startHeight;
_finishHeight = finishHeight;
setDuration(500);
System.out.println(_startHeight);
System.out.println(_finishHeight);
}
#Override
protected void applyTransformation( float interpolatedTime, Transformation t ) {
int newHeight = (int)((_finishHeight - _startHeight) * interpolatedTime + _startHeight);
_view.getLayoutParams().height = newHeight;
_view.requestLayout();
}
#Override
public void initialize( int width, int height, int parentWidth, int parentHeight ) {
super.initialize(width, height, parentWidth, parentHeight);
}
#Override
public boolean willChangeBounds( ) {
return true;
}
};
This animation is created every time I click a button. It is called properly (checked System.out.println and it prints correct values) however in emulator animation runs only like once of 15 times. To be exact hiding it works great but expanding works only once a few times (on emulator, cant get it working on phone).
What could be the problem?
Thanks in forward
EDIT: layout I am trying to animate is FrameLayout. It has TextView as child and finishHeight is measured by textView measure height. The values are correct. I have also tried calling textView.requestLayout() in apply transformation to redraw layout but it is not working. It still expands only sometimes. If you need any more code feel free to ask.
Calling
((View) toExpand.getParent()).invalidate();
just after startAnimation solved my problem. Must check it on other devices but I think it will work.
I need to implement this things, a height of item in ListView will be reduced slowly, when its height reduce to 0, it's gone. On this process, the remain views that below the item, should move up slowly.
At First, I use the ObjectAnimator to change the 'scaleY', but the size of item occupy was not changed, when Animator ends, ListView refresh, the empty rectangle was gone.
ObjectAnimator oa = ObjectAnimator.ofFloat(itemView, 'scaleY', 1f, 0f);
And I found another way to do this, I write a Runnable to change the height of the item, but there are some child view in my item, like a ImageView, with the height changing, the ImageView changing too, I think this is not look well.
LayoutParams lp = itemView.getLayoutParams();
lp.height = newHeight;
itemView.setLayoutParams(lp);
At last, I found third way to do, change the 'bottom' value of the item, yes, It looks like a window with reducing height, but height not changed, the remain views that below the item didn't move until Runnable ends and ListView refresh.
itemView.setBottom(itemView.getTop() + newHeight);
How to solve this?
I do something similar to this and work fine:
public void collapse(final View v, final int toHeight, final int toWidth) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = (int) (toHeight * interpolatedTime);
v.getLayoutParams().width = (int) (toWidth * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration(ANIMATION_DURATION);
a.setInterpolator(new AccelerateInterpolator());
v.startAnimation(a);
}
the height set in the layout can not be fixed (put wrap_content). Hope it help you!!
I have 2 LinearLayouts with views within them held in a container LinearLayout that is using layout_weight to determine their sizes. I am trying to shrink the top view when the user clicks inside the bottom view with an animation.
I extended Animation with a class:
public class ShrinkTopViewAnimation extends Animation {
protected int mOriginalHeight;
protected final LinearLayout mView;
public ShrinkTopViewAnimation(LinearLayout view) {
this.mView = view;
}
#Override
public void initialize(int width, int height, int parentWidth, int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
mOriginalHeight = height;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation transformation
) {
int shrinkAmount = (int)(mOriginalHeight * interpolatedTime);
ViewGroup.LayoutParams layoutParams = mView.getLayoutParams();
layoutParams.height = mOriginalHeight - shrinkAmount;
mView.setLayoutParams(layoutParams);
mView.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
}
The BottomView onClick calls:
ShrinkTopViewAnimation shrinkTopViewAnimation = new ShrinkTopViewAnimation(mTopLinearLayout);
shrinkTopViewAnimation.setDuration(1000);
mTopLinearLayout.startAnimation(shrinkTopViewAnimation);
I am very confused as to what is happening. What I am seeing is that the first time through the applyTransform the interpolatedTime is 0 so the .height is set to the exact same number that it was before. But the next call to the applyTransformation a getHeight call to the mView gives a number way bigger than the starting height and at the end of the transform when interpolatedTime is 1 the view is back to the original size. The visual effect is the top view jumps larger, then shrinks back to original size.
Both getHeight() and the initialize Height are listed as px in the documentation, and the LayoutParams.Height is listed as px. But it seems like there is some translation to dp possibly going on?
Any ideas?
To keep the animated result, use Animation.setFillAfter(true).
When set to true, the animation transformation is applied after the animation is over.
What you used here is View Animation. This kind of animation only modify rendering transformation, so the actual size of view is not changed.
If you need to changed the actual size, you have to set LayoutParams via a AnimationListener, or use a Property Animation.
This is so weird, I've this animation code:
public class ExpandAnimation extends Animation {
private View mAnimatedView;
private MarginLayoutParams mViewLayoutParams;
private int mMarginStart, mMarginEnd;
private boolean mWasEndedAlready = false;
/**
* Initialize the animation
* #param view The layout we want to animate
* #param duration The duration of the animation, in ms
*/
public ExpandAnimation(View view, int duration) {
setDuration(duration);
mAnimatedView = view;
mViewLayoutParams = (MarginLayoutParams) view.getLayoutParams();
mMarginStart = mViewLayoutParams.rightMargin;
mMarginEnd = (mMarginStart == 0 ? (0- view.getWidth()) : 0);
view.setVisibility(View.VISIBLE);
mAnimatedView.requestLayout();
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
super.applyTransformation(interpolatedTime, t);
if (interpolatedTime < 1.0f) {
// Calculating the new bottom margin, and setting it
mViewLayoutParams.rightMargin = mMarginStart
+ (int) ((mMarginEnd - mMarginStart) * interpolatedTime);
// Invalidating the layout, making us seeing the changes we made
mAnimatedView.requestLayout();
// Making sure we didn't run the ending before (it happens!)
} else if (!mWasEndedAlready) {
mViewLayoutParams.rightMargin = mMarginEnd;
mAnimatedView.requestLayout();
mWasEndedAlready = true;
}
}
}
And I use this Animation:
View parent = (View) v.getParent();
View containerMenu = parent.findViewById(R.id.containerMenu);
ExpandAnimation anim=new ExpandAnimation(containerMenu, 1000);
containerMenu.startAnimation(anim);
This animation toggle a layout hidding / showing it.
By default, its hidden. When I click, animation works and it's shown. When I click again, it shrinks correctly. But the 3rd time, it does nothing. I've debugged and I found out that the constructor is called but not applyTransformation.
Somehow, if I click any layout around the screen, the animation suddenly starts.
Any idea?
Edit
Does anyone know WHEN is applyTransformation triggered?
I can't understand why, but when I click or do any action to any layout, the animation finally starts. So I programatically added a workaround. I've a scrollview in my layout, so I move the scroll position:
hscv.scrollTo(hscv.getScrollX()+1, hscv.getScrollY()+1);
This just after containerMenu.startAnimation(anim);
This just works, I can't understand why.
Also, I found out that some animations worked flawless on android > 4, but on 2.3 for instance, it had the same issue, worked to expand, and to shrink, but not to expand for the second time.
parent.invalidate();
Did the trick.
Hi I am trying to animate the height of a view in android say every 5 seconds :-
height goes from 0 to 5
height goes from 5 to 10
height goes from 10 to 3 etc
I am using the code below :-
public class ShowAnimation extends Animation{
float finalHeight;
View imageview;
public ShowAnimation(View view,float deltaheight){
this.imageview=view;
this.finalHeight=deltaheight;
}
protected void applyTransformation(float interpolatedtime,Transformation t){
imageview.getLayoutParams().height=(int)(finalHeight*interpolatedtime);
imageview.requestLayout();
}
#Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
}
#Override
public boolean willChangeBounds() {
return true;
}
}
and initialize it like this:-
Animation anidelta = new ShowAnimation(delta, deltaheight);
anidelta.setDuration(500/* animation time */);
delta.startAnimation(anidelta);
But with this i get the below:-
height goes from 0 to 5
height goes from 0 to 10
height goes from 0 to 3
i want the height to be animated from its previous height rather than from 0 everytime.
Can someone please help me here
Edit1:-
I did this
Animation anidelta = new ShowAnimation(delta, deltaheight);
anidelta.setDuration(500/* animation time */);
anidelta.setFillAfter(true);
delta.startAnimation(anidelta);
But it still animates from 0 to the newheight.
Ok so this is how I finally solved it:-
public class ResizeAnimation extends Animation
{
View view;
int startH;
int endH;
int diff;
public ResizeAnimation(View v, int newh)
{
view = v;
startH = v.getLayoutParams().height;
endH = newh;
diff = endH - startH;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t)
{
view.getLayoutParams().height = startH + (int)(diff*interpolatedTime);
view.requestLayout();
}
#Override
public void initialize(int width, int height, int parentWidth, int parentHeight)
{
super.initialize(width, height, parentWidth, parentHeight);
}
#Override
public boolean willChangeBounds()
{
return true;
}}
You need an extra flag to tell your applyTransformation method whether you want to increase or decrease the view height.
Add a flag to the constructor and save that flag as an instance variable, and use that flag to decide whether to increase or decrease the view height:
public class ShowAnimation {
// other instance variables
private boolean increaseHeight;
public ShowAnimation(View view, float deltaheight, boolean increaseHeight) {
// other initializations
this.increaseHeight = increaseHeight;
}
protected void applyTransformation(float interpolatedTime, Transformation t) {
if (increaseHeight)
imageview.getLayoutParams().height = (int) (finalHeight * interpolatedTime);
else {
imageview.getLayoutParams().height = (int) (finalHeight * (1 - interpolatedTime));
}
imageview.requestLayout();
}
}
I know this post has not been active for over a year but I will post what I think is the easiest way to animate view's height anyway.
Instead of declaring Animation class, you could use View.setScaleY API available from API level 11.
Using this, you can specify view to scale within the range from 0-1 (0 means no height and 1 means original height) in desired second.
In XML set your view's height to its maximum height, then when inflating the view (e.g. in Activity#onCreate() or Fragment#onViewCreated()) you can
yourView.setScaleY(0);
Then after 5 seconds you can set
yourView.setScaleY(0.5f);
This will scale your view's height instantly. If you want to scale the view with animation, you can for example do something like this:
yourView.animate().scaleY(0.5f).setDuration(200).start();
I hope it helps.
Try animation set. I am not sure whether this is what you want.
Animation 1 for : height goes from 0 to 5
Animation 2 for : height goes from 0 to 10
Animation 3 for : height goes from 0 to 3
public void applyAnimation(ImageView ivDH) {
System.out.println("Inside applyAnimation()");
scaleAnim1 = new ScaleAnimation(0, 5, 0, 5);
scaleAnim1.setDuration(5000);
scaleAnim1.setRepeatCount(0);
scaleAnim1.setInterpolator(new AccelerateDecelerateInterpolator());
scaleAnim1.setFillAfter(true);
scaleAnim2 = new ScaleAnimation(-5, 10, -5, 10);
scaleAnim2.setDuration(5000);
scaleAnim2.setRepeatCount(0);
scaleAnim2.setInterpolator(new AccelerateDecelerateInterpolator());
scaleAnim2.setFillAfter(true);
scaleAnim3 = new ScaleAnimation(10, 3, 10, 3);
scaleAnim3.setDuration(5000);
scaleAnim3.setRepeatCount(0);
scaleAnim3.setInterpolator(new AccelerateDecelerateInterpolator());
scaleAnim3.setFillAfter(true);
AnimationSet animationSet = new AnimationSet(true);
animationSet.addAnimation(scaleAnim1);
animationSet.addAnimation(scaleAnim2);
animationSet.addAnimation(scaleAnim3);
animationSet.setDuration(15000);
animationSet.setFillAfter(true);
ivDH.clearAnimation();
ivDH.startAnimation(animationSet);
}