I have made a set of 3 images that will represent the move of a animal. Each image represents a frame and consists only in the animal with transparent background.
I have made a AnimationDrawable in code and created the animation:
AnimationDrawable staticAnimation = new AnimationDrawable();
staticAnimation.addFrame(ctx.getResources().getDrawable("frame1"),150);
staticAnimation.addFrame(ctx.getResources().getDrawable("frame2"),150);
staticAnimation.addFrame(ctx.getResources().getDrawable("frame3"),150);
I set the animation as a background for a Imageview and start it
imgAnimal.setBackgroundDrawable(staticAnimation );
staticAnimation.start()
Because the frames have different width (the drawing needs to recreate steps move) looks like the Imageview resizes the images in the animation. Better to say, if frame1 is bigger then frame2, frame 1 is displayed ok but frame 2 is stretched to be as big as frame1 was. Looks really awful.
Any suggestions on how to stop this behavior ? Thank you.
The solution was quite simple, because images in frames have same height but different width, I simply made a transparent border rectangle and put it over each frame. In this case each frame will have the same width and the animatin will run as supposed to.
Related
I have an ImageView which I scale it using ObjectAnimator. Its original size is 220px, and I scale it to 33px, but the problem is that when the animation finishes, the image looks like it is 33px, but if I get its size, it returns me 220px, and if I try to scale it to 33px after the animation is finished it just disappears.
If I change its size to 220px after the animation is finished it doesn't change, like if the ImageView would still be 220px but the image inside and the view's background would be 33px and because of that, when I scale it to 33px, the image and background are even smaller and can't be seen.
What can I do to set the views size to real 33px after animation finishes? :p
Thanks.
I am trying to hide a part of an image so that the user does not see it. Initially I copied the Bitmap pixels on another Bitmap, without copying only the pixels that I needed and making the second bitmap the correct size at creation. That worked, but I have many large images and that results in OOMs unfortunately. So instead of doing that I thought on using a ClipDrawable to draw the image, and making the pixels that I don't need invisible.
The code is as follows
ClipDrawable clipDrawable = new ClipDrawable(new BitmapDrawable(resources, bitmap), gravity, orientation);
clipDrawable.setLevel(level);
// Cannot use as the imageview source. Must use background or else we don't get anything on the screen.
picture.setBackground(clipDrawable);
// This is super important. Do not modify this! Without it you will not get the fullscreen image working and the ImageView will be deleted
// from the parent layout.
picture.setImageResource(android.R.color.transparent);
The idea is that I calculate the level based on the image size so that I hide the pixels that I don't need. And it's working. Except I don't understand why I need to use
picture.setBackground(clipDrawable);
picture.setImageResource(android.R.color.transparent);
instead of the more normal:
picture.setImageDrawable(clipDrawable);
If I do the second more normal example then I don't get anything in the ImageView, but if I set it as a background and put a transparent image over it, then it works. Since I want to further manipulate the ImageView using a zooming class that needs the picture set as the src and not as background, I cannot have both, either I get the ClipDrawable showing or I get to have zoom on the image.
Any help would be appreciated!
picture.setImageDrawable(new
ClipDrawable(new BitmapDrawable(resources, bitmap), gravity, orientation
));
ClipDrawable clipDrawable = (ClipDrawable) picture.getDrawable();
clipDrawable.setLevel(level);
Find some trouble with android animation.
I have layout with RelativeLayout as root and have four ImageView's allocated in center of layout, and on top of them i have some picture.
Next i have some button and then in activity i make run next code
RotateAnimation anim2=new RotateAnimation(0, 360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
anim2.setFillEnabled(true);
anim2.setFillAfter(true);
anim2.setDuration(100);
ImageView animatedView1 = (ImageView) findViewById(R.id.imageView1);
animatedView1.startAnimation(anim2);
animation work with lags :(
Like i try run Doom 3 on S3 Trio video card :)))
But if i hide else 3 imageviews and show only one image wich i need to be rotated - i have no problems - it rotates smooth and how i need.
Also i found what it's no different size of images (files) 6 Kb,60Kb it's no difference :(
How i can do rigth animation with no LAGS
Everything looks perfect when I use the ImageView to show a png image like this:
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/png_picture"
android:src="#drawable/paos_connection"/>
The image is scaled perfectly, fills the screen horizontally and has the correct aspect ratio.
Now, I want to replace the image with an animation. I decided on using Frame Animation as shown here: http://developer.android.com/guide/topics/graphics/view-animation.html. I am using the same size png files (slightly modified copies of the original one).
My problem is that the animation is playing and it is filling up the screen horizontally as before, but it is now stretched vertically. I can force it to have the correct height by hard-coding a height:
<ImageView
android:layout_width="fill_parent"
android:layout_height="210px"
android:id="#+id/animation" />
...but obviously this is not a good solution because the image should have the correct aspect ratio on all screen sizes.
This may help. I've found without a lot of footwork, you're stuck using a fixed element unless the image is drawn in order with the rest of the layout on initialization.
http://developer.android.com/reference/android/widget/ImageView.ScaleType.html
A quick hack to try would be to set a transparent image in its place with the same dimensions as the animated image. Programatically create an ImageView using the width & height of the rendered transparent image. Following that, animate the the instantiated image.
Instead of setting the animation drawable in the background of the imageview, set it in the foreground using src and let the animation play there. All images in the frame animation will be resized with aspect ratio intact provided you set a suitable scale type for the imageview.
Althought the question is 11 years old, for those who search:
ImageView img_anim;
img_anim = view.findViewById(R.id.img_anim);
img_anim.setImageResource(R.drawable.anim_youranimation);
AnimationDrawable frameAnimation = (AnimationDrawable) img_anim.getDrawable();
frameAnimation.start();
instead of
ImageView img_anim;
img_anim = view.findViewById(R.id.img_anim);
img_anim.setBackgroundResource(R.drawable.anim_youranimation);
AnimationDrawable frameAnimation = (AnimationDrawable) img_anim.getBackground();
frameAnimation.start();
I have a RelativeLayout filling the screen and a couple of ImageView positioned on it using LayoutParams margins. These ImageView are animated in different ways, and in one case I want an image to "fly in" to the screen from the right.
Unfortunately, if I set leftMargin for that ImageView greater than the width of the screen, it does not appear (or appears cropped if it partially visible at the start of animation).
I tried setting width and height of RelativeLayout to be bigger than screen size - it works, but only partially: if the image is positioned completely off-screen, it does not work, and if the image is partially visible, it is not cropped, but that works only for right and bottom sides.
So, my question is this: how to position several ImageViews on and off the screen so that I can animate them using Animation?
In the end, I used a trick: I combined AnimationDrawable and view animation. I did the following (assuming that the animation has to run T milliseconds):
Position that ImageView on-screen.
Set as its background an AnimationDrawable with following frames:
empty Drawable: 1ms,
normal Drawable: Tms.
Change view's animation to this:
jump to off-screen position (translation with duration=1ms),
do normal animation.
This is probably a good place to start looking for those who would use Fixpoint's solution.
Android — How to position View off-screen?