How to stop an image which moves by animation? - android

I'm trying to move an image from left to right on layout, but not by dragging. I want it to go automatically when something happened. So, i found an animation like this:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_interpolator" >
<translate
android:duration="1000"
android:fromXDelta="0"
android:toXDelta="200"
android:fillEnabled="true"
android:fillAfter="true" />
</set>
But the problem is i couldn't find how to make it stop there! It's just went back directly. Any suggestion please?
Here is my Java code:
public void onClick(View v) {
runOnRight(this, image);
}
static Animation runOnRight(Activity ctx, View target) {
Animation animation = AnimationUtils.loadAnimation(ctx,
R.anim.slide_left_to_right);
target.startAnimation(animation);
return animation;
}

set FillAfter to true in your animation set xml

When the View.onAnimationEnd() callback is fired, you can set the new View postion with View.layout(int, int, int, int). The View.layout call assign size and position to your view. Refer to the documentation for more information

use the field FillAfter="true" which will stops at the end.
just like following.

Related

How to make setOnClickListener on a dynamic imageview

Working in Android Studio, I need to add in my app a click listener on my imageview which has a certain animation. This is the code I have in MainActivity:
myImage.startAnimation(myAnimation);
myImage.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//DO SOMETHING
}
});
myAnimation comes from an XML in anim folder which does a translational animation:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="#android:anim/accelerate_interpolator"
android:repeatCount="infinite"
android:repeatMode="reverse"
android:fromYDelta="0%p"
android:toYDelta="40%p"
android:duration="1000"/>
</set>
This works fine, although this click listener is set on the space that has the image on the layout (activity_main.xml) and does not follow the animation inserted in the image. If I click on the space which belongs to the image in the layout, the click listener starts even if the image is not there due to the animation.
Is there a way in which the click listener is attach to the imageview in motion?
Thank you
This happens because the xml Translate animation you are using, does not really animate the View's property, it just moves the pixels on the screen and so it just looks like it has changed position, that is why the OnClickListener is still active on the View's original position, because Android thinks the View never really moved.
Simple solution use ObjectAnimator or even better ViewPropertyAnimator. Both will animate the View's property and so the OnClicklistener will also change it's position with it.

Make a layout appear with animation after button click in Android

I'm trying to implement a simple animation effect for login screen.
Here's the scenario,
1: Some text and a login button will be displayed by default.
2: After clicking the login button a new frame layout will appear from bottom to top. This layout will prompt user to enter their username and password.
I can make an animation which will overlay from one parent to another. In this scenario, I'm looking for an animation that will appear without leaving the activity.
First set invisible to your layout.
Set animation to slideUp and slideDown.
final LinearLayout layout = (LinearLayout)findViewById(R.id.yourlayout);
button.setOnClickListener(new OnClickListener(){
#Override
public void onClick(View arg0) {
Animation slideUp = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slide_up);
Animation slideDown = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slide_down);
if(layout.getVisibility()==View.INVISIBLE){
layout.startAnimation(slideUp);
layout.setVisibility(View.VISIBLE);
}
});
slide_up.xml (create in res/anim directory)
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0" android:fromYDelta="500" android:duration="500"/>
</set>
slide_down.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0" android:fromYDelta="0" android:toYDelta="500" android:duration="500"/>
</set>
Note:
You should edit values in slide_down.xml and slide_up.xml until get favorable result.for example:change android:fromYDelta="500" to android:fromYDelta="700"
Check out this tutorial, it explains some basic animations which you can customize for your need.
http://www.androidhive.info/2013/06/android-working-with-xml-animations/

How to avoid blink of View when using animation?

I use translate and rotate animations to position View inside FrameLayout in onCreate event. I want animations to perform instantly so I set duration for both of them to 0. But when application starts there is a short blink of my View in top left corner of screen and then it becomes positioned according to animation parameters. How can I avoid this blink?
I spent whole day with that problem. fillAfter and fillBefore has nothing to do with that. Try this before animation start:
view.setVisibility(View.GONE); // view is our View we trying to animate
Then set animation listener for your animation:
animation.setAnimationListener(new AnimationListener(){
public void onAnimationEnd(Animation animation) {
}
public void onAnimationRepeat(Animation animation) {
}
public void onAnimationStart(Animation animation) {
v.setVisibility(View.VISIBLE);
}
use animation.setFillAfter(true) or animation.setFillBefore(true), depending on your needs. This should resolve the blink
Having a tag inside the parent tag of your animation file will cause this, try it with only one tag and you will see the difference. I am working with this right now
Odaym's answer is the solution for the issue actually. If you have something like that:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="true">
<set
android:duration="1000">
<translate
android:fromXDelta="100%"
android:toXDelta="0"
/>
</set>
</set>
Change it into this:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="true" android:duration="1000">
<translate
android:fromXDelta="100%"
android:toXDelta="0"
/>
</set>
Set the visibility after the animation execution code but not in "onAnimationEnd", also try to set the duration
view.setVisibility(View.VISIBLE); // view is our View we trying to animate

Animate View in a layout (pre-Honeycomb)

I tried to animate View's position in a RelativeLayout. In every frame I change the topMargin of the View's LayoutParams and then call View#setLayoutParams(newParams).
The animation is unfortunately too slow because the setLayoutParams() call triggers remeasuring of the whole View tree.
How can I solve this without using API 11+?
You can use View Animations Just make yourself an xml file with a translate animation in it that defines how you'd like your View to move. Then inflate a reference to your Animation and call
view.startAnimation(anim);
Here is an example of a translate xml file. You'd save a file like this in res/anim/
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/overshoot_interpolator">
<translate android:fromXDelta="100%p" android:toXDelta="0%p" android:duration="700"/>
</set>
Here is what you'd do in java to use it.
Animation slideLeftIn;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
slideLeftIn = AnimationUtils.loadAnimation(this, R.anim.slide_left_in);
//mView can be any View object.
mView.startAnimation(slideLeftIn);
}

Strange effect with ImageView startAnimation in ListView

after some months of coming here now and then it's finally my turn to submit my problem :
I have a ListView with a custom ArrayAdapter that loads images from the internet (one image per row). I made an ImageCache class that calls an onImageLoaded method on my ArrayAdapter :
public void onImageLoaded(Bitmap image, ImageView view){
view.setImageBitmap(image);
Utils.log("start animation : " + view.toString());
view.startAnimation(mAnim);
}
The problem is each time startAnimation (supposedly a fadeIn) is called on ONE ImageView, the animation seems to re-run from the start on ALL ImageView-s currently being animated, causing some weird blinking of several (or all) images when scrolling.
Utils.log say that startAnimation is called normally though (ie only once for each new ImageView appearing in the ListView).
The content of my animation XML is as such :
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator"
android:shareInterpolator="true">
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0" android:duration="400"/>
</set>
Has this ever happened to anyone?
Can you see what i'm doing wrong?
Thanks!
The problem is cause by loading the Animation and storing it instead of creating a new Animation each time.
Solution example:
public void onImageLoaded(Bitmap image, ImageView view){
view.setImageBitmap(image);
Animation fadeInAnimation = AnimationUtils.loadAnimation(getContext(), R.anim.fade_in);
view.startAnimation(fadeInAnimation);
}
Note the addiction of this line of code to the method above:Animation fadeInAnimation = AnimationUtils.loadAnimation(getContext(), R.anim.fade_in);

Categories

Resources