Multiple animations within a relative view - android

I am trying to animate a pointer around the screen in an android application.
I am using an imageview as the pointer inside a relative layout as follows:
final RelativeLayout container = (RelativeLayout) findViewById(R.id.container);
pointer = (ImageView) findViewById(R.id.pointer);
pointer.animate().setDuration(2000);
I then want to move the pointer up 10 pixels every time I click a button:
// ONCLICK LISTENER FOR LEFT BUTTON
btnUp.setOnClickListener(new View.OnClickListener() {
public void onClick(View arg0) {
//get positon of pointer
leftPoint = pointer.getLeft();
topPoint = pointer.getTop();
int xValue = container.getWidth() - pointer.getWidth();
int yValue = container.getHeight() - pointer.getHeight();
pointer.animate().x(leftPoint).y(topPoint-10);
}
});
This works the first time I click the button but will not move it any subsequent times. I have tried making the int points static but this did not help.
Any help greatly appreciated.

This might sound counter-intuitive, but animating a view doesn't change its location. Your code is demonstrating it. When you do this line:
topPoint = pointer.getTop();
You get the same value every time.
You need to change pointer's position at the end of the animation.
This answer shows how someone else has done it.
Other Considerations
You could use object animator, if you are only targeting SDK 11 and above. Here is a little intro to it.
If you want to interrupt your animation, you can check its status, and find out its current y offset. You can add that to the position of the view before starting the animation. Here is an example.

Related

Compare Drawables on ImageViews

I'm trying to create a One-armed Bandit app.
I have created an animation xml file to go through multiple images. When a button is clicked, the animation stops.
My question is how to compare the picture that one animation stopped on with that of another? So far I've tried something like this:
if(wheel1.getBackground().getConstantState().equals(wheel2.getBackground().getConstantState())) matches++;
Any help is appreciated.
you must be starting the animation with .animationStart()
just use .onAnimationStop() and it will trigger the event automatically.
A View should not maintain application logic, the controller (your hosting Activity or Fragment) should.
That said, to achieve what you want use View.setTag() to apply a logical description of each View to it.
Then when stopping animation, loop through all Views you have and get their position on screen, get the Views mostly visible in each column of your bandit machine and compare their tags (View.getTag())
for example, if the items animate vertically use below method to determine where the bandit stopped.
//the area where to compare views
int BOUND_TOP, BOUNT_DOWN;
//your content view
ViewGroup rootLayout;
//method to get information about what is visible
public List<Object> getVisibleViewTags() {
List<Object> list = new LinkedList<>();
int count = rootLayout.getChildCount();
for (int pos = 0; pos < count; pos++) {
View child = rootLayout.getChildAt(pos);
float translationY = child.getTranslationY();
if (translationY > BOUND_TOP && translationY < BOUND_DOWN) {
list.add(child.getTag());
}
}
return list;
}
Now you just need to attach information about a view as tag to it.
example:
view.setTag("view_apples");
or
view.setTag("view_bananas");

Android View with a translate animation - positioning is not working as expected

I have a View that has an OnClickListener. When clicked, the view translates up to a certain position on the page. This is no problem, the view goes where it should. When the view is clicked again, I would like to position it somewhere else, but this is not the case. After a little bit of trouble shooting, I found that my View's getTop() method returns the same value - even after the translation animation has moved the view to a different part of the screen. For the second animation, it is not using the current position (as I would expect), it instead uses the initial position.
Few things that I am doing: I am using the ObjectAnimation class rather than the TranslationAnimation class, since I wanted to keep the OnClickListener functioning. With the TranslationAnimation class, I found that the view was correctly moved, but the OnClickListener was only working in the area that the View started from. Using the ObjectAnimation class, I was able to easily get the translation to work AND the OnClickListener functions correctly - it is triggered where the view currently is on the screen.
Here's what I have so far:
final LinearLayout child = layouts.get(i); //ArrayList containing some dynamic layouts
final int offset = target - child.getTop();
ObjectAnimator anim = ObjectAnimator.ofFloat(child,"translationY",offset);
anim.setDuration(250);
anim.start();
This is what happens when the view is clicked the first time. It translates up along the Y axis, where the offset determines how far the View needs to move from its current position.
Now, here's what happens on the second click. The goal here was to align the view with the parent's base.
target = parent.getBottom();
offset = target - child.getTop();
anim = ObjectAnimator.ofFloat(child, "translationY",offset);
anim.setDuration(250);
anim.start();
prev = child;
This is where things fall apart - child.getTop() returns the Y coordinate of the view's ORIGINAL position. Not the current position. So after the animation, the view is placed well below the bottom of the parent. I read a different question which stated that I should use child.getY() instead, which is supposed to give me the translationY position plus the top position, but this didn't lead to any better results. I can't seem to get this to work just right. I'd simply like to move the view from its current position to the bottom of the screen, but this appears to be a hard thing to accomplish. Any help would be appreciated.
EDIT
I have added an animation listener:
ObjectAnimator anim = ObjectAnimator.ofFloat(child,"translationY",offset);
anim.setDuration(250);
anim.addListener(new ObjectAnimator.AnimatorListener(){
#Override
public void onAnimationStart(Animator animation) {
System.out.println("start: " + child.getTop() + " " + child.getY());
}
#Override
public void onAnimationEnd(Animator animation) {
System.out.println("end: " + child.getTop() + " " + child.getY() + " " + child.getTranslationY());
child.setTop((int)child.getY());
System.out.println(child.getTop());
}
#Override
public void onAnimationCancel(Animator animation) {}
#Override
public void onAnimationRepeat(Animator animation) {}
});
anim.start();
Here I am setting the listener to try to change where the Top of the view is located. Behaviour is again not working as expected. The view is actually sent up above the screen when I do this. Output of the System.out looks like this:
start: 2008 2008.0
end: 2008 478.0 -1530.0
478
So calling child.getTop() after the animation is complete and setting a new position returns a positive integer, but the view is not actually completely on screen. It is above the screen, partly visible. The height of the view itself is about 700px. I am still so confused as to why this is such a hard thing to accomplish.
EDIT 2
I have also tried setting layoutparams inside the onAnimationEnd method:
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)child.getLayoutParams();
params.removeRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
params.addRule(RelativeLayout.ALIGN_PARENT_TOP, RelativeLayout.TRUE);
params.topMargin = (int)child.getY();
child.setLayoutParams(params);
Result: child.getTop() still returns the original position of 2008.
You can get the very bottom of the screen coordinates like this :
float bottomOfScreen = getResources().getDisplayMetrics().heightPixels;
but you probably want it minus the height of your LinearLayout or else your LinearLayout will be cut off by the bottom :
float bottomOfScreen = getResources().getDisplayMetrics().heightPixels
- child.getHeight();
// if you want a little more space to the bottom
// try something like - child.getHeight()*2;
Then use ViewPropertyAnimator to animate your LL like this :
child.animate()
.translationY(bottomOfScreen)
.setInterpolator(new AccelerateDecelerateInterpolator())
.setDuration(250);
The Interpolator is just to make the animation more realistic.
In the case that child.getHeight() returns 0 , your Linear Layout has not been finished setting up by the system, in that case you might want to do something like :
child.post(new Runnable() {
#Override
public void run() {
float bottomOfScreen = getResources().getDisplayMetrics().heightPixels
- child.getHeight()*2;
child.animate()
.translationY(bottomOfScreen)
.setInterpolator(new AccelerateDecelerateInterpolator())
.setDuration(250);
}
});
Remember that a duration of 250 milliseconds is very fast, and does usually not look cool translating stuff on the screen, so you might want to set it a little higher, but thats just a matter of taste.

How to stop imagebutton at current position when clicked during animation?

I have an ImageButton which moves down from the top of the screen. The image animates while moving down to the screen. I want to make it stop WHEREVER and WHENEVER it is clicked on. Basically if the image is clicked in the middle of the animation, I want to it to stop at that current position. My progress can be seen in the code block below, the code makes the image animate and move from top to bottom, when the image is clicked, the image moves straight to the desired position (500), instead of stopping at the current position. Please be really descriptive as I am a beginner in programming. Thank you.
final ImageButton image = (ImageButton)findViewById(R.id.image);
final ObjectAnimator objectAnimator= ObjectAnimator.ofFloat(image, View.TRANSLATION_Y, 0, 500); //where the image should move to
objectAnimator.setStartDelay(2000); //how long to wait before starting
objectAnimator.setDuration(2000); //how long animation lasts
objectAnimator.start();
image.setOnClickListener(
new ImageButton.OnClickListener() {
public void onClick(View v) {
image.setTranslationY(image.getY()); //gets current position of Y?
objectAnimator.end(); //ends the animation
}
}
);
From the documentation of ValueAnimator#cancel it seems that
objectAnimator.cancel();
should solve your problem.

Android: call requestLayout() after update v.layout parameter causes layout reverts back to it's original position

I have framelayout which contains two relative layouts, one is on top of the other. When user clicks a button, the one on the top move 80% off the screen to the right. Then one on the bottom becomes clickable. This is what it looks like.
FrameLayout
RelativeLayout (bottom) RelativeLayout (top)
FilterWidgets Open/close button, ListView
It's really easy to achieve on 3.0+ with the new animation api which is Property base Animation. For the pre 3.0, because animation is view based. So I end up manually modify the layout property on onAnimationEnd. The call requestLayout to make it permanent, but only to find out the layout reverts back to original position. Anybody know how to move layout permanently?
see my other post if you want to see the whole picture:
https://stackoverflow.com/questions/14541265/changecursor-cause-layout-container-of-the-listview-to-reposition
theTranslationX.addListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator nullPointer) {
v.clearAnimation();
int theL = isMenuOn() ? 0 : v.getLeft() + getFilterWidth();
int theR = isMenuOn() ? v.getWidth() : v.getLeft() + getFilterWidth() + v.getWidth();
int theHeight = v.getHeight();
int theT = 0;
v.layout(theL, theT, theR, theHeight);
v.requestLayout();
}
});
This is 9 months late but try using:
yourView.layout(left,top,right,bottom); //all parameters are type int
However I don't think this is permanent, the position of the view will still be reset when you call requestLayout(), but give it a try.

Get itemPosition in the layout (x and y parametres)

I have a RelativeLayout in which i have one ImageButton.
I need the position parametres of this item and I don,t know how to get them.
I have try with:
ImageButton user = (ImageButton) findViewById(R.id.User);
int x =user.getTop();
int y =user.getLeft();
But the result is allways 0;
Thank you.
I think you are invoking this method when the layout is being drawn, instead you should use:
ViewTreeObserver observer = user.getViewTreeObserver();
observer.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
//in here, place the code that requires you to know the dimensions.
//Place your code here
}
}
getTop() and getLeft() returns you the location of the view relative to its parent. For instance, when getLeft() returns 20, that means the view is located 20 pixels to the right of the left edge of its direct parent. See here under the point position. Try something like:
user.getParent().getLeft();
hope that helps!
Because your ImageButton was not calculated its position ready on that time.
see How to get an Android widget's size after layout is calculated?
Do not try to get position in onCreate(), that always returns 0.

Categories

Resources