Frame Animations only start one time - android

I have created a frame animations by the code below. I want every time I click at the button the animation will start but it only work at first time.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/frame"
/>
<Button
android:layout_centerInParent="true"
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start Animation"
/>
</RelativeLayout>
frame.xml
<animation-list
android:oneshot="true"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<item android:drawable="#drawable/ic_heart_0" android:duration="300" />
<item android:drawable="#drawable/ic_heart_50" android:duration="300" />
<item android:drawable="#drawable/ic_heart_75" android:duration="300" />
<item android:drawable="#drawable/ic_heart_100" android:duration="300" />
<item android:drawable="#drawable/ic_heart_0" android:duration="300" />
</animation-list>
Activity
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
startAnimation();
}
});
}
public void startAnimation(){
ImageView img = (ImageView) findViewById(R.id.image);
((AnimationDrawable) img.getBackground()).start();
}
}
How can I make the animation can start whenever I click at the Button?
Any help or suggestion would be great appreciated.

You try stop() animation after 300 duration in MainActivity. I think it not recognize either you stop or not maybe. It stop after 300 , right ? but i think maybe app recognize it still start.

Here is one solution that I found. I try to stop animation if it is running before I start it again. I think animation not stop even it have gone through all frame
if(((AnimationDrawable) imageView.getBackground()).isRunning()){
((AnimationDrawable) imageView.getBackground()).stop();
}
((AnimationDrawable) imageView.getBackground()).start();

In order to run "one shot animation" again:
private void runAnimation(ImageView imageView) {
AnimationDrawable animation = (AnimationDrawable) imageView.getBackground();
animation.setVisible(true, true);
animation.start();
}

Related

I have a loader animation but , sometimes it doesn't start the animation

I have this ImageView that I use as a loader:
<ImageView
android:id="#+id/loader_container"
android:layout_width="#dimen/loader_size"
android:layout_height="#dimen/loader_size"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="#dimen/loader_bottom_offset"
android:visibility="invisible" />
I have a static method in my Utils class that does this:
public static void setLoaderVisible(ImageView loader){
loader.setVisibility(View.VISIBLE);
loader.setBackgroundResource(R.drawable.loading_animation);
loader.bringToFront();
AnimationDrawable anim = (AnimationDrawable) loader.getBackground();
anim.setOneShot(false);
anim.start();
}
I noticed that in some parts the loader does show the animation, going through the drawables, but sometimes it only shows the first picture. Why doesn't it want to animate all the time?
This is my animation:
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="#drawable/bus1" android:duration="200" />
<item android:drawable="#drawable/bus2" android:duration="200" />
<item android:drawable="#drawable/bus3" android:duration="200" />
<item android:drawable="#drawable/bus4" android:duration="200" />
</animation-list>
EDIT: I did try using a post, like this:
public static void setLoaderVisible(ImageView loader)
{
loader.setImageResource(R.drawable.loading_animation);
loader.setVisibility(View.VISIBLE);
loader.bringToFront();
final AnimationDrawable anim = (AnimationDrawable) loader.getDrawable();
loader.post(new Runnable() {
#Override
public void run() {
anim.start();
}
});
}
And also tried to use a AnimatedImageView class found here: AnimationDrawable not playing
but still the same issue.
I noticed that the animation works in almost all my classes. I have a activity that contains fragment and in there the loader does not animate. Tried putting the loader inside the fragment, and inside the activity, but the results are the same. Any ideeas?
try following method if it works,
public static void setLoaderVisible(ImageView loader)
{
loader.setImageResource(R.drawable.loading_animation);
loader.setVisibility(View.VISIBLE);
loader.bringToFront();
final AnimationDrawable anim = (AnimationDrawable) loader.getDrawable();
loader.post(new Runnable() {
#Override
public void run() {
anim.start();
}
});
}

Gif in android xml not working

Hi I am looking to create gif animation in xml.I separated gif images and used the below code
myxm.xml
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="#drawable/a" android:duration="100" />
<item android:drawable="#drawable/c" android:duration="100" />
<item android:drawable="#drawable/e" android:duration="100" />
</animation-list>
and in my layout i used the code
<ImageView
android:id="#+id/imageButton1"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="16dp"
android:src="#anim/myxm" />
But it doesn't works animation.Is it the right way to create gif animation in xml ? please help me thanks in advance :)
You can try the following,
AnimationDrawable frameAnimation;
ImageView view;
view = (ImageView) findViewById(R.id.imageButton1);
// Setting myxm.xml as the background of the image view
view.setBackgroundResource(R.anim.myxm);
// Typecasting the Animation Drawable
frameAnimation = (AnimationDrawable) view.getBackground();
// Called when Activity becomes visible or invisible to the user
#Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
if (hasFocus) {
// Starting the animation when in Focus
frameAnimation.start();
} else {
// Stoping the animation when not in Focus
frameAnimation.stop();
}
}

Hide the ImageView after the Frame by Frame Animation stops in android

I just applied Frame by Frame animation in the image view , i just use 2 images in frame by frame
main.java
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView iv = (ImageView) findViewById( R.id.imageView1);
iv.setBackgroundResource(R.anim.animation);
AnimationDrawable ac= (AnimationDrawable) iv.getBackground();
ac.start();
//ac.stop();
if(ac.isRunning()==false){
iv.setVisibility(View.INVISIBLE);
}
}
animation.xml
<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/image1" android:duration="1000"/>
<item android:drawable="#drawable/image2" android:duration="1000"/>
</animation-list>
activity_main.xml(layout)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true" />
</RelativeLayout>
Im also confused where to stop this Animation
and i need to hide the image view after the 2 image animated and restart the animation later on
i'm Working on Advertisement images. so i need to show the images for short duration and later it will restart again.
If anybody know this solution . please help me.
ImageView iv = (ImageView) findViewById( R.id.imageView1);
iv.setBackgroundResource(R.anim.animation);
AnimationDrawable ac= (AnimationDrawable) iv.getBackground();
ac.start();
You can simply put an empty picture as last item in the animation:
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true"
>
<item android:drawable="#drawable/image1" android:duration="1000"/>
<item android:drawable="#drawable/image2" android:duration="1000"/>
<item android:drawable="#drawable/dummy" android:duration="1000"/>
</animation-list>
and oneshot=true.
To restart , you could call an onClick method and call start again like this:
Button btn1 = (Button) findViewById(R.id.btn1);
btn1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
ImageView iv = (ImageView) findViewById( R.id.imageView1);
iv.setBackgroundResource(R.anim.animation);
AnimationDrawable ac= (AnimationDrawable) iv.getBackground();
ac.start();
}

Animation List simply deosn't start

I'm working on a project which should have a progressdialog. But since i didn't find an easy way to style a progressdialog, i was thinking, that the easiest way is to create a custom dialog class with it's own style, and a frame by frame animation on it, and show it instead. Here is my code:
The xml layout for the dialog:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/dialog_background"
android:gravity="center"
android:orientation="horizontal"
android:padding="10dp" >
<ImageView
android:id="#+id/loaddialog_animation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/loadanimation"
android:layout_marginRight="10dp" />
<TextView
android:id="#+id/loaddialog_text"
style="#style/SmallText"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Here is my dialog class:
public class LoadDialog extends Dialog
{
private TextView message;
ImageView image;
AnimationDrawable animation;
public LoadDialog(Context context)
{
super(context, R.style.Dialog);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.load_dialog);
message = (TextView) findViewById(R.id.loaddialog_text);
image = (ImageView) findViewById(R.id.loaddialog_animation);
image.setBackgroundResource(R.drawable.loadanimation);
animation = (AnimationDrawable) image.getBackground();
}
public void setText(String msg)
{
message.setText(msg);
}
#Override
public void show()
{
super.show();
animation.start();
}
#Override
public void dismiss()
{
animation.stop();
super.dismiss();
}
}
and the animation resource:
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true" >
<item android:drawable="#drawable/loadbar_01" android:duration="50" />
<item android:drawable="#drawable/loadbar_02" android:duration="50" />
<item android:drawable="#drawable/loadbar_03" android:duration="50"/>
</animation-list>
The problem is that the animation doesn't starts, when i try to show it. I know, there are a lots of topics about this problem, but here are the things, that i have tried:
Put the dialogs show() in different parts of my activity: onResume() and onCreate().
onWindowFocusChanged() is not an option, since i want to show a dialog. dialog shown ->focus change, dialog dismissed->focus change ->infinite amount of dialogs shown.
I have tried animation.setCallback(image), animation.setVisible(true, true), animation.invalidateSelf() none of them works.
I have tried image.post() and put a runnable in there as a parameter, and in the run method starting the animation, no luck.
At this point i'm starting to run out of options. The I'm only trying to show 3 images changing until the dialog is dismissed. Please if you know, what am i doing wrong, or any alternative, let me know!
Thanks in advance!
Change android:oneshot="true" to android:oneshot="false" so that it repeats. It should be currently only doing one cycle and since your show time is 50, that is really fast. I would also change that to maybe 200 or so..
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false" >
<item android:drawable="#drawable/loadbar_01" android:duration="200" />
<item android:drawable="#drawable/loadbar_02" android:duration="200" />
<item android:drawable="#drawable/loadbar_03" android:duration="200"/>
</animation-list>
Also, you are setting the image in your xml layout, but animated the background, so you need to either change the xml layout to this:
<ImageView android:id="#+id/loaddialog_animation" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/loadanimation"
android:layout_marginRight="10dp" />
or change you code to get the src file rather than the background, like this:
image = (ImageView) findViewById(R.id.loaddialog_animation);
image.set(R.drawable.loadanimation);
animation = (AnimationDrawable) image.getDrawable();
Faced the same issue today. Placing the animation.start() in the onShow() method of OnShowListener did the trick for me.
public class CustomProgressDialog extends Dialog
{
ImageView progressImage;
AnimationDrawable frameAnimation;
public CustomProgressDialog(Context context)
{
super(context);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.custom_progress);
getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
progressImage = (ImageView) findViewById(R.id.custom_progress_image);
progressImage.setBackgroundResource(R.anim.progress_anim);
frameAnimation = (AnimationDrawable) progressImage.getBackground();
OnShowListener osl = new OnShowListener()
{
#Override
public void onShow(DialogInterface dialog)
{
frameAnimation.start();
}
};
setOnShowListener(osl);
OnDismissListener odl = new OnDismissListener()
{
#Override
public void onDismiss(DialogInterface dialog)
{
frameAnimation.stop();
}
};
setOnDismissListener(odl);
}
}

Moving an image through a linearlayout

I'm developing an Android 2.2 application.
I want to move an image from left side of the screen to the right side of the screen.
How can I do that? I've read that I have to add this image to a ListView or to a GridView to setup this animation.
UPDATE
I've created the following files:
anim/translate_right
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_decelerate_interpolator">
<translate
android:fromXDelta="-100%p"
android:toXDelta="0"
android:duration="5000" />
</set>
anim/ship_layout_controller
<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
android:delay="10%"
android:animationOrder="reverse"
android:animation="#anim/translate_right" />
layout/startpage
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<TextView
android:id="#+id/appNameTextView"
android:text="#string/app_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="40px"/>
<Button
android:id="#+id/PlayButton"
android:text="#string/play"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="40px"/>
<AbsoluteLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:id="#+id/greekShip"
android:persistentDrawingCache="animation|scrolling"
android:layoutAnimation="#anim/ship_layout_controller"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/greekship"
android:maxWidth="176px"
android:maxHeight="87px"
android:layout_x="-300px"/>
</AbsoluteLayout>
</LinearLayout>
StartActivity.java
public class StartActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.startpage);
}
#Override
protected void onResume() {
super.onResume();
ImageView ship = (ImageView)findViewById(R.id.greekShip);
ship.startAnimation(AnimationUtils.loadAnimation(this, R.anim.translate_right));
}
}
But it doesn't work.
Please take a look at the Animation class, specifically the Tween Animation, more specifically the Translate element. Create an animation file in your project then apply this animation to your image. For example, this animation would move an object from the center of the screen to the right side.
<?xml version="1.0" encoding="utf-8"?>
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:toXDelta="100%p"
android:fromXDelta="0%"
android:duration="300"
android:fillEnabled="true"
android:fillAfter="true">
</translate>
EDIT: To apply this animation to a Button, a TextView, an ImageView, etc.
ImageView imageView = (ImageView) findViewById(R.id.myImageView);
Animation exitAnimation = AnimationUtils.loadAnimation(this, R.anim.exit_animation);
imageView.startAnimation(exitAnimation);
you have to use Translate Animation. For example, this animation would move an image from Left side of the screen to the right side of the screen.
The AnimationActivity is
listener = new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation) {
System.out.println("End Animation!");
//load_animations();
}
};
}
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
if (v==button)
{
moveLefttoRight = new TranslateAnimation(0, 200, 0, 0);
moveLefttoRight.setDuration(1000);
moveLefttoRight.setFillAfter(true);
my_image.startAnimation(moveLefttoRight);
}
}
}
xml code is
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<ImageView
android:id="#+id/diceid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/dice"/>
</LinearLayout>
and anim file is
<?xml version="1.0" encoding="utf-8"?>
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2000"
android:repeatMode="reverse"
android:repeatCount="infinite"
android:startOffset="0"
/>
may be this is the answer what you are searching.
I would check your source again. Maybe it's out of context. But the easiest way to do this is to use a Translate animation that originates from the Image's starting place and translates it to the other side of the screen. After that is done I usually register an animation callback so that I can update the true position of the image after the animation is over. hope that helps.
Or is it the Gallery that you are looking for?

Categories

Resources