Say I have a "main screen" Layout which has to move up, to reveal a "history bar".
if ( HistoryBar == false )
{
HistoryBar = true;
TranslateAnimation MainScreenPullUp = new TranslateAnimation(0, 0, 0, -200 );
MainScreenPullUp.setDuration(350);
MainScreenPullUp.setFillAfter(true);
LinLayMain.startAnimation(MainScreenPullUp);
}
Right now I am doing it like that. But the problem is, that while the main screen layout itself moves up, all the button places keep the same, i.e. the button picture moves, but the click-spot remains in place. Any ideas how to fix that?
I tried useing an animationListener, instead setFillAfter(true) , which would TanslateY the main screen layout, once the animation stops, but it makes the layout jump and flicker. Are there any other ways?
edit:
Thanks, Vineet.
Got it working with:
ObjectAnimator pullUp = ObjectAnimator.ofFloat(LinLayMain, "translationY", 0f, -200f);
pullUp.setDuration(350);
pullUp.start();
I faced the same problem. From 3.0 android has property animation. Below 3.0 I tackled this issue with the help of view's method offsetLeftAndRight (int offset) and offsetTopAndBottom (int offset). You can refer this link for more details.
For Property animation refer this link.
Related
I have a RecyclerView in which user selects an item. Upon selection certain view becomes visible before the text (see image). I want to animate its appearance.
animateLayoutChanges property on the item's layout does the job perfectly, except for the animation type for view appearance - it fades in. I want it to scale from 0 to 100% size, I believe it's called 'pop up' animation.
If I disable animateLayoutChanges and use XML animation for that, it works, but the nearby text is no longer animated (it should slide to accomodate space for the view and its margin). It instantly shifts to the right and then animation is played. This is worse with reverse animation, since the text overlaps the view before it has disappeared.
So I need to combine default mechanism and my own animation somehow.
What would be the simplest way to accomplish that without delving into custom animations?
After much digging in the wrong places, found the answer myself. Might help somebody.
animateLayoutChanges property if enabled utilizes an instance of LayoutTransition to do its job in ViewGroup.
So in order to change animations, you can create an instance of LayoutTransition, set Animator for the transition that you need to change and then assign that instance to ViewGroup via setLayoutTransition().
In my case the result is:
Animator scaleDown = ObjectAnimator.ofPropertyValuesHolder((Object)null, PropertyValuesHolder.ofFloat("scaleX", 1, 0), PropertyValuesHolder.ofFloat("scaleY", 1, 0));
scaleDown.setDuration(300);
scaleDown.setInterpolator(new OvershootInterpolator());
Animator scaleUp = ObjectAnimator.ofPropertyValuesHolder((Object)null, PropertyValuesHolder.ofFloat("scaleX", 0, 1), PropertyValuesHolder.ofFloat("scaleY", 0, 1));
scaleUp.setDuration(300);
scaleUp.setStartDelay(300);
scaleUp.setInterpolator(new OvershootInterpolator());
LayoutTransition itemLayoutTransition = new LayoutTransition();
itemLayoutTransition.setAnimator(LayoutTransition.APPEARING, scaleUp);
itemLayoutTransition.setAnimator(LayoutTransition.DISAPPEARING, scaleDown);
ViewGroup av = (ViewGroup)v.findViewById(R.id.animated_layout);
av.setLayoutTransition(itemLayoutTransition);
More info in LayoutTransition reference documentation.
You can do same thing with animateLayoutChange just see following article
https://proandroiddev.com/the-little-secret-of-android-animatelayoutchanges-e4caab2fddec
It's easy to add layout transitions with this attribute:
android:animateLayoutChanges="true"
However, the animation you get does not create a pleasing user experience. When elements are added to the layout (I'm using a simple vertical LinearLayout) or change from gone to visible there's a 2-stage process that I think is rather annoying. First, room is prepared for the new element (everything else is pushed down). Then when there's enough room, the new view fades into existence. Likewise, when a view is removed or changes from visible to gone, first it fades out, then the room claimed by it gradually shrinks to zero.
I would really like a way to change the animation to what I really think is the natural way to do it: When adding a view its height gradually changes from zero to its full size, so that first you see just the top, without ever changing the alpha. When removing a view its height gradually changes to its full size to zero, so that near the end of the animation you see just the top, without ever changing the alpha.
How can I accomplish this in Android? (Note: the user can tap on several buttons together and cause several elements to appear / disappear in quick succession, before the animation for the other views ended - or even make something appear while it's still appearing).
Another question that this is perhaps not the place to ask: why isn't this the default?
(And if it's possible, can a slightly different behavior be specified in which first just the bottom of the view appears, rather than the top, like the new view slides down from under the one above it?)
You have to write your own animator and set it.
Code:
final ViewGroup profileParent = (ViewGroup) view.findViewById(R.id.profileParent);
LayoutTransition transition = new LayoutTransition();
Animator appearingAnimation = ObjectAnimator.ofFloat(null, "translationY", 600/*profileParent.getHeight()*/, 0);
appearingAnimation.addListener(new AnimatorListenerAdapter() {
public void onAnimationEnd(Animator anim) {
View view = (View) ((ObjectAnimator) anim).getTarget();
view.setTranslationY(0f);
}
});
Animator disappearingAnimation = ObjectAnimator.ofFloat(null, "translationY", 0, 600/*profileParent.getHeight()*/);
appearingAnimation.addListener(new AnimatorListenerAdapter() {
public void onAnimationEnd(Animator anim) {
View view = (View) ((ObjectAnimator) anim).getTarget();
view.setTranslationY(0f);
}
});
transition.setAnimator(LayoutTransition.APPEARING, appearingAnimation);
transition.setDuration(LayoutTransition.APPEARING, 300);
transition.setStartDelay(LayoutTransition.APPEARING, 0);
transition.setAnimator(LayoutTransition.DISAPPEARING, disappearingAnimation);
transition.setDuration(LayoutTransition.DISAPPEARING, 300);
transition.setStartDelay(LayoutTransition.DISAPPEARING, 0);
profileParent.setLayoutTransition(transition);
I try to do a menu with a hide button. When I press the hide button, i do objectAnimator= ObjectAnimator.ofFloat(myLayout, "translationY"... to move the layout up.
My problem is when I move all the layout up, it didn't grow, it only move up with his fixed size. I don't know how to refresh the size of the layout to match_parent so my 2nd layout will take all the place.
Thanks
Kick off example:
ObjectAnimator anim = ObjectAnimator.ofFloat(myLayout, "translationY"...);
anim.addListener(new AnimatorListener() {
#Override
public void onAnimationEnd(Animator animation) {
((RelativeLayout.LayoutParams) view.getLayoutParams).width = ViewGroup.LayoutParams.MATCH_PARENT;
}
});
I think you can't achive this effect using only translation. Translating object still keep its bounds in layout (you can see it when you turn on Developer options -> Show layout bounds on your device). It's just drawing in a different place.
I don't know what you exactly want to do, so if that tip is not enough, try to give more details. For now I can only propose animating one of your views' height.
So i'm trying to do 2 animations simultaneously, one to move a textview, and one to show a linearlayout (also 2 animations to hide them). I have another animation working as intended to show/hide a seperate layout. When i execute showing the view with 2 animations, it works once, it hides fine, but then doesn't work again. Then when i show the other view, it plays all 3 animations (not intended). I can't figure out why this is happening? When i try to show the 2 animations it does nothing, but then when i try the other show view its like it was added to a queue and it shows all 3.
My code for initiating the two animations:
LinearLayout layoutMsgs = (LinearLayout)findViewById(R.id.layoutMsgs);
Animation anim = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.msgs_show);
anim.setAnimationListener(new AnimListener(layoutMsgs, View.VISIBLE)); // sets visibility on animation end
layoutMsgs.startAnimation(anim);
TextView tvMsgs = (TextView)findViewById(R.id.tvMsgs);
Animation tvAnim = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.tvmsgs_show);
tvMsgs.startAnimation(tvAnim);
My code for hiding the two animations:
LinearLayout layoutMsgs = (LinearLayout)findViewById(R.id.layoutMsgs);
Animation animLayout = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.msgs_hide);
animLayout.setAnimationListener(new AnimListener(layoutMsgs, View.INVISIBLE));
layoutMsgs.startAnimation(animLayout);
TextView tvMsgs = (TextView)findViewById(R.id.tvMsgs);
Animation animMsgs = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.tvmsgs_hide);
tvMsgs.startAnimation(animMsgs);
Then this is the other animation that is working fine, it's only one animation, no textView, just a layout
LinearLayout pokeLayout = (LinearLayout)findViewById(R.id.layoutPokes);
Animation anim = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.poke_show);
anim.setAnimationListener(new AnimListener(pokeLayout, View.VISIBLE));
pokeLayout.startAnimation(anim);
So how can i fix this? Sorry if my explanation is bad i'm finding it difficult to explain all the details, please ask for any missing information.
solved by using solution in this post Android: Using ObjectAnimator to translate a View with fractional values of the View's dimension
wasn't pretty as I had to create seperate translate X and translate Y res files for each view I need to move.. ended up with like 15 anim files. Would still like to know if theres a better solution
In my android app, I have a checkbox layout which will be slide up and down from the center of screen.Though I'm using Object Animator When I check true to Check box, the check box layout moves down and if I uncheck the layout should move up. My Issue is check box moves down when I select it. But I can't select the checkbox when it is down. Instead if I click on the center(i.e previous checkbox position) it slides up to center. So It moves only the View part, not listener part. I'm using following code to animate
Checkbox Layout view
mChkView = findViewById(R.id.chkbx_layout_id);
Animator code
ObjectAnimator.ofFloat(mChkView, "translationY", 0, 60).setDuration(0).start();
I have found several answers in stack over flow as listed :
Answer Link1
Answer Link2
Answer Link3
Answer Link4
But none of the answer helps me.
Try this
ObjectAnimator mover = ObjectAnimator.ofFloat(aniView,
"translationX", -500f, 0f);
mover.setDuration(2000);
-500f and 0f are the float value of the position from and to . Set these two value according to your need.
Hope this helps.