I have an Activity with two ImageViews set to full screen 320 x 480.
I need to play an animation but couldn't get more than 50 to play using AnimateDrawable and an xml array before running out of VM.
I'm trying to switch PNGs with a Loop so I can do other stuff at points along the way.
For example vibrate at frames 120, 180 & 250 etc. and play another animation at frame 400.
This code below works but the ImageView takes between 180 - 280ms to update on the emulator. So I need to set thread.sleep greater than 280-300 otherwise I start missing frames. I need a quicker way to update the imageview. Is there a quicker widget available?
The image for some frames do not need to change or are blank so while the animation lasts for 746 frames I only actually need 245 of them. So I have deleted the non changing or blank frames from the drawables folder and the code skips over them when not found. This has reduced the size down to 9mb total for all the images.
This is my first Android app so sorry if I am not doing it the right way. I will take any advice on how to improve. :-)
Can anyone think of a better way to do this? HELP!! (This same logic works fine on the iPhone)
activity_main.xml
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<ImageView
android:id="#+id/background"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:scaleType="fitXY"
android:src="#drawable/imgbackground"
android:visibility="visible" />
<ImageView
android:id="#+id/animLayer"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:visibility="visible" />
</RelativeLayout>
MainActivity.java
package com.test.pngloop
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.widget.ImageView;
public class MainActivity extends Activity {
private static final String TAG = null;
public int iFrameCount = 0;
public ImageView myIV;
public String myString;
long startTime;
long endTime;
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//define the IV here so it's done only once
myIV = (ImageView) findViewById(R.id.animLayer);
}
#Override
protected void onStart()
{
super.onStart();
Thread thr1 = new Thread(r1);
thr1.start();
}
Runnable r1 = new Runnable()
{
public void run()
{
while (iFrameCount< 747)
{
runOnUiThread(new Runnable()
{
public void run()
{
iFrameCount++;
String image="image" + iFrameCount;
int resID = getResources().getIdentifier(image, "drawable", getPackageName());
if (resID != 0) //if there is no image/change for this frame skip it
{
myString="iFrameCount: " + iFrameCount;
Log.d(TAG, myString);
//speed the same between setImageResource & setBackgroundResource
//myIV.setImageResource(resID);
//myIV.postInvalidate();
startTime = System.currentTimeMillis();
myIV.setBackgroundResource(resID);
endTime = System.currentTimeMillis();
System.out.println("setBackground took: " + (endTime - startTime) + " milliseconds");
}
else
{ //we can skip frames 1-119, 209-251, 272-322, 416-472 & 554-745 (as no change from previous frame)
myString="File skipped: " + iFrameCount;
Log.d(TAG, myString);
}
}
});
try
{
Thread.sleep(300);
}
catch (InterruptedException iex) {}
}
Log.d(TAG, "Finished playing all frames");
}
};
}
I have now been able to get the frame rate up to close to 20 frames a second by reducing the size of each image (used in the animation) down to the smallest vertical strip to fit the object.
I came up with this idea after reading about using Spritesheets for game animation where they move a single image around and view the needed frame through a small window. Sprites were not practicle for my purpose, too many frames Sprite sheet would be 135mb.
The images are now only 480 x 150 (between 31-54KB each) instead of a full screen. ImageView height is set to fill_parent and ImageView width set to wrap_content so it still scales automatically to different screen sizes.
I found that now the files are much smaller it loads quicker and now is close to an acceptable animation frame rate. Hope this is of help to anyone else who is trying the same thing.
Related
In code - after first part of animation pivot of view is changing and...view position too!(it is strange behavior)
Here's code(stipulation - one ValueAnimator):
ValueAnimator animator = ValueAnimator.ofFloat(0,180);
float firstAnimLineX = ((47.5f * Resources.getSystem().getDisplayMetrics().density));
float firstAnimLineY = ((2.5f * Resources.getSystem().getDisplayMetrics().density));
float secondAnimLineX = ((47.5f * Resources.getSystem().getDisplayMetrics().density));
float secondAnimLineY = ((47.5f * Resources.getSystem().getDisplayMetrics().density));
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator animation) {
view.setPivotX((Float) animator.getAnimatedValue()>180/2?firstAnimLineX : secondAnimLineX);
view.setPivotY((Float) animator.getAnimatedValue()>180/2?firstAnimLineY : secondAnimLineY);
view.setRotation((Float) animator.getAnimatedValue());
}
});
XML file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="50dp"
android:layout_height="50dp"
android:id="#+id/frameLayout">
<ImageView
android:layout_width="50dp"
android:layout_height="5dp"
android:layout_gravity="center_horizontal"
android:id="#+id/line"
/>
</FrameLayout>
</RelativeLayout>
And here is what i want to do(left part; right part - it's what realy happens)(yellow point - pivot):
I watched source code of setPivotX but it doesn't says me anything.
Maybe i should call someone of invalidate-methods of view?
I recreated this code and ran it on my Android phone. It gives the exact animation you are looking for.
I created an Image to match your 'match-stick' image.
I made it 400 px wide by 40 high for an example.
I gave it the id: 'bar'
ImageView bar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bar = findViewById(R.id.bar);
bar.getLayoutParams().width = 400; // I set the dimensions here.
bar.getLayoutParams().height = 40; // I set the dimensions here.
bar.setX(0); bar.setY(0); // Then I positioned it in upper left corner.
bar.setPivotX(380); // I set the pivot a little inside the image so that it looks kinda like it is pivoting on a nail.
bar.setPivotY(20);
bar.animate().rotation(-90).setDuration(2000); // Here it animates from your first image above, to your second image in 2 seconds.
// Here I used a postDelay to allow the first animation to finish its' 2 seconds 'before' calling the second animation. No need for an animate() - listener now.
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
bar.setY(360); // This re-positions the original image to the
// location where the animation ended.
bar.setRotation(90); // Because the original image was horizontal, this turns it vertical.
// Now we finish the animation to your 3rd image above.
bar.animate().rotation(0).setDuration(2000);
}
},2100);
}
I have layout FrameLayout as a root layout.
<FrameLayout 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"
>
<ImageView
android:id="#+id/background_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/init_image"
android:scaleType="centerCrop">
</ImageView>
......
......
</FrameLayout>
I need to change periodically some amount of images in a infinity loop (some condition) so like slideshow.
I have tried to use Handler but when I change I get OutOfMemory error.
I also tried ImageSwitcher but It seems not to work correctly.
Please give an example or advice how to implement it correctly following all design patterns of Android, thx.
Hye there , i was recently searching for this issue and came across a good solution as it doesn't apply automatic density based scaling of the images and use them as they are.
1- Put all your images in res/drawable-nodpi folder, you have to create this folder as it doesn't exist.
2 - Make them automatically change from one to other in an infinite loop.
int images[] = { R.drawable.background_1,
R.drawable.background_2,
R.drawable.background_3,
R.drawable.background_4,
R.drawable.background_5,
R.drawable.background_6,
R.drawable.background_7 }; // i've these images in **res/drawable-nodpi**
Here is the onCreate method
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.imageView_Animated);
handler.postDelayed(changeImage, 5000); // after every 5secs it will change image.
}
Now here comes the part which handles all changing of images , outside onCreate do this.
Runnable changeImage = new Runnable() {
#Override
public void run() {
if (count >6) {
handler.removeCallbacks(changeImage);
} else {
if (count >= 6)
count = 0;
AlphaAnimation animation1 = new AlphaAnimation(0.5f, 1.0f); //here is a bit of animation for ya ;)
animation1.setDuration(5000);
animation1.setStartOffset(1300); //time for that color effect
animation1.setFillAfter(true);
imageView.startAnimation(animation1);
imageView.setBackgroundResource(images[count++]);
handler.postDelayed(changeImage, 5000);
}
}
};
All done, hope i helped you.
Could anybody tell me how can I get to display an image with the sound ... I want to display an image for a few seconds just as the sound is played ... I am new to this and cant figure out. I can individually get the image or the sound but not both combined.
enter code here
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.media.AudioManager;
import android.media.SoundPool;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnLongClickListener;
import android.view.View.OnTouchListener;
public class GunBlood extends Activity implements OnClickListener,
OnLongClickListener {
Disp d;
SoundPool sp, sp2;
float y = 0, x = 0;
int ex = 0, sg = 0, f = 0;
Bitmap blood;
Canvas canvas;
View v;
#Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
d = new Disp(this);
v= new View(this);
setContentView(d);
d.setOnClickListener(this);
d.setOnLongClickListener(this);
blood = BitmapFactory.decodeResource(getResources(), R.drawable.blood);
sp = new SoundPool(5, AudioManager.STREAM_MUSIC, 0);
ex = sp.load(this, R.raw.gun, 1);
sp2 = new SoundPool(5, AudioManager.STREAM_MUSIC, 0);
sg = sp2.load(this, R.raw.sgun, 1);
}
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
if (ex != 0) {
if (f == 0)
sp.play(ex, 1, 1, 0, 0, 1);
f = 0;
}
x = v.getX();
y = v.getY();
}
#Override
public boolean onLongClick(View v) {
// TODO Auto-generated method stub
if (sg != 0)
sp2.play(ex, 1, 1, 0, 0, 1);
f = 1;
return false;
}
public class Disp extends View {
public Disp(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
if (x != 0 && y != 0) {
canvas.drawBitmap(blood, (blood.getWidth() / 2),
(blood.getHeight() / 2), null);
}
invalidate();
}
}
}
I asked a similar question here about how to make an ImageView invisible and then visible, which may be able to apply.
You could use this to execute a block of code after a certain amount of time:
blood.setVisibility(View.VISIBLE); //make the image invisible
blood.postDelayed(new Runnable() {
#Override
public void run() {
blood.setVisibility(View.INVISIBLE); //make the image visible
}
}, 3000); //the 3000 is the amount of milliseconds until the code executes, so 3 seconds.
sp.play(ex, 1, 1, 0, 0, 1);
sp.postDelayed(new Runnable() {
#Override
public void run() {
if (sg != 0)
sp.stop()//I have no idea if this is the right code, I'm not very familiar with SoundPool
f = 1;
}
}, 3000);
I am not sure if the two postDelayed methods will run at the same time, or one will delay the other, although I think they will run at the same time.
You could also use an animation for the image, and the postDelayed for the sound. The animation aspect is VERY well described by Xyresic in his answer of my question, the link is below.
The question I asked is at Pause Between Making ImageView Invisible and Visible Android
If I have something wrong here or this can be improved, let me know. I am also still a beginner and am still learning. I would gladly take the corrections.
Hope this helps!
EDIT
use:
android:Clickable="true"
android:onClick="methodYouWantCalled"
In your XML file for your button or whatever object, it will go to that method in the class file which has that XML file as its layout. Just be sure that the method is
public static void methodYouWantCalled(View view){
//code here
}
It needs to have View view in the parameters and it needs to be public.
Hope this works for you!
EDIT
So, your next two problems are that the image always shows up at the top of the screen, and there is a significant delay while the picture loads.
If the image is always displaying in the top-left corner, then you can either move the image in your layout, or switch layouts. I am assuming you are using the Android SDK in eclipse. What you can do, is go to your XML file, and press 'Graphical Layout'. There, you can drag the image to where you want it. I believe that editing the placement of objects is easier in XML, and is less likely to have any bugs. If dragging the image around the screen to where you want it does not work, or it messes up your placement of other things, here are some things you can try.
Edit the placement in the actual XML code.
If you go into the XML code for your ImageView, you should see a line that says:
android:layout_marginLeft="something"
if you replace the 'something' with a value such as 200dp (density pixels, the same for each device) you can move it to wherever you want. You can do this with marginLeft, marginRight, marginBottom and marginTop. If you play around with the density pixels, you should be able to get it in the right place. Here's an example.
XML
<!--Up here is all the basic stuff like the id. I am just making up these values -->
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_marginLeft="200dp"
android:layout_marginBottom="600dp"
android:Clickable="true"
android:onClick="methodToBeCalled"
The first 4 lines size and place your object. Using the height and margins and so on, you should be able to place it where you want.
Change Layouts
If you have a lot of things on the screen, you can change to a relative layout and have them be placed corresponding to one another. So say you had a TextView with the id of myTextView at the top left. You can then, using the relative layout, position your picture to the right of that using:
android:layout_toRightOf="myTextView"
This will only work, however, if you have many items on your screen.
2) I am not sure about your image taking a while to load, but I can give it a shot.
There are a few possible reasons.
It is a large file, and needs time to process (unlikely for a single picture)
The app is doing multiple things at once, and is using up all the phone's RAM (unlikely, since this sounds like a relatively simple app)
Something is preventing it from running right away (e.g., a Thread.sleep(); command.)
There are solutions to all of them, with a varying degree of difficulty.
For the first possible problem, you could control load times by pre-loading your resources during the splash activity, or in a loading screen before the activity. There is a nice tutorial on it here.
For the second possible problem, you would need to minimize what is being processed, to give more RAM to the main task. I have almost no experience with this, so I can't really help you there. HOWEVER, this is EXTREMELY unlikely, seeing as how phones have so much processing power.
For the final possible problem, you just need to make sure that you don't have anything like that in the app. I shy away from them because I really don't like working with threads. You could try to use a postDelayed instead.
Hope it works! Comment if you come by any more problems.
EDIT
I have found some other Stack Overflow posts about this, namely Android - setting X,Y of image programmatically and android sdk set imageview x y coordinates. The only problem is that I am not sure if the AbsouluteLayout is still just depreciated, or gone. Either way it should be replaced when it is fully removed, and you can use the replacement. I believe it is still just depreciated, so we should be able to use it. I like your idea of getting the x and y and using those, and we can still do that. Check out those posts, along with Android setX() and setY() behaving weird, and you should be ready to go. If you use the margin method (in the java code), you should be able to create a simple algorithm to calculate the margin size based on your given coordinates.
Hope that works too!
I've run into what I can only categorize as a memory leak for ScrollView elements when using the Gallery component.
A short background. I've got an existing app that is a photo slideshow app.
It uses the Gallery component, but each element in the adapter is displayed in full-screen.
(full source is available at this link)
The adapter View element consist of an ImageView, and two TextViews for title and description.
As the photos are of a quite high-resolution, the app uses quite a lot of memory but the Gallery has in general manage to recycle them well.
However, when I am now implementing a ScrollView for the description TextView, I almost immediately run into memory problems. This the only change I made
<ScrollView
android:id="#+id/description_scroller"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:fillViewport="true">
<TextView
android:id="#+id/slideshow_description"
android:textSize="#dimen/description_font_size"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:layout_below="#id/slideshow_title"
android:singleLine="false"
android:maxLines="4"/>
</ScrollView>
I did a heap dump and could clearly see that it was the Scrollview which was the root of the memory problems.
Here are two screenshots from the heap dump analysis. Note that the ScrollView retains a reference to mParent which includes the large photo I use
PS same problem occurs if I use the TextView's scrolling (android:scrollbars = "vertical" and .setMovementMethod(new ScrollingMovementMethod());
PSS Tried switching off persistent drawing cache, but no different dreaandroid:persistentDrawingCache="none"
Have you tried removing the scroll view whenever it's container view scrolls off the screen? I'm not sure if that works for you but its worth a shot? Alternatively, try calling setScrollContainer(false) on the scroll view when it leaves the screen. That seems to remove the view from the mScrollContainers set.
Also, this question, answered by Dianne Hackborn (android engineer), explicitly states not to use scrollable views inside of a Gallery. Maybe this issue is why?
Just add this -> android:isScrollContainer="false"
<ScrollView
android:id="#+id/description_scroller"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:fillViewport="true"
android:isScrollContainer="false">
There is some source why this is appear:
http://grepcode.com/file/repository.grepcode.com/java/ext/com.google.android/android/4.0.1_r1/android/view/View.java
the problem is:
setScrollContainer(boolean isScrollContainer)
by default:
boolean setScrollContainer = false;
but in some cases like this
if (!setScrollContainer && (viewFlagValues&SCROLLBARS_VERTICAL) != 0) {
setScrollContainer(true);
}
it can be true, and when it happends
/**
* Change whether this view is one of the set of scrollable containers in
* its window. This will be used to determine whether the window can
* resize or must pan when a soft input area is open -- scrollable
* containers allow the window to use resize mode since the container
* will appropriately shrink.
*/
public void setScrollContainer(boolean isScrollContainer) {
if (isScrollContainer) {
if (mAttachInfo != null && (mPrivateFlags&SCROLL_CONTAINER_ADDED) == 0) {
mAttachInfo.mScrollContainers.add(this);
mPrivateFlags |= SCROLL_CONTAINER_ADDED;
}
mPrivateFlags |= SCROLL_CONTAINER;
} else {
if ((mPrivateFlags&SCROLL_CONTAINER_ADDED) != 0) {
mAttachInfo.mScrollContainers.remove(this);
}
mPrivateFlags &= ~(SCROLL_CONTAINER|SCROLL_CONTAINER_ADDED);
}
}
mAttachInfo.mScrollContainers.add(this) - all view put into ArrayList this lead to leak of memory sometimes
Yes i noticed the problem, sorry for my previous comment, i've tried to empty the Drawables
by setting previous Drawable.setCallBack(null); but didnt work, btw i have nearly the same project, i use ViewFlipper instead of Gallery, so i can control every thing, and i just use 2 Views in it, and switch between them, and no memory leak, and why not you resize the Image before displaying it, so it will reduce memory usage (search SO for resizing Image before reading it)
Try moving "android:layout_below="#id/slideshow_title" in TextView to ScrollView.
Ended up with implementing a workaround that uses a TextSwitcher that is automatically changed to the remaining substring every x seconds.
Here is the relevant xml definition from the layout
<TextSwitcher
android:id="#+id/slideshow_description"
android:textSize="#dimen/description_font_size"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/slideshow_description_anim1"
android:textSize="#dimen/description_font_size"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="2"
android:textColor="#color/white"
android:singleLine="false"/>
<TextView
android:id="#+id/slideshow_description_anim2"
android:textSize="#dimen/description_font_size"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="2"
android:textColor="#color/white"
android:singleLine="false"/>
</TextSwitcher>
Here I add the transition animation to the TextSwitcher (in the adapter's getView method)
final TextSwitcher slideshowDescription = (TextSwitcher)slideshowView.findViewById(R.id.slideshow_description);
Animation outAnim = AnimationUtils.loadAnimation(context,
R.anim.slide_out_down);
Animation inAnim = AnimationUtils.loadAnimation(context,
R.anim.slide_in_up);
slideshowDescription.setInAnimation(inAnim);
slideshowDescription.setOutAnimation(outAnim);
Here is how I swap to the part of the description
private void updateScrollingDescription(SlideshowPhoto currentSlideshowPhoto, TextSwitcher switcherDescription){
String description = currentSlideshowPhoto.getDescription();
TextView descriptionView = ((TextView)switcherDescription.getCurrentView());
//note currentDescription may contain more text that is shown (but is always a substring
String currentDescription = descriptionView.getText().toString();
if(currentDescription == null || description==null){
return;
}
int indexEndCurrentDescription= descriptionView.getLayout().getLineEnd(1);
//if we are not displaying all characters, let swap to the not displayed substring
if(indexEndCurrentDescription>0 && indexEndCurrentDescription<currentDescription.length()){
String newDescription = currentDescription.substring(indexEndCurrentDescription);
switcherDescription.setText(newDescription);
}else if(indexEndCurrentDescription>=currentDescription.length() && indexEndCurrentDescription<description.length()){
//if we are displaying the last of the text, but the text has multiple sections. Display the first one again
switcherDescription.setText(description);
}else {
//do nothing (ie. leave the text)
}
}
And finally, here is where I setup the Timer which causes it to update every 3.5 seconds
public void setUpScrollingOfDescription(){
final CustomGallery gallery = (CustomGallery) findViewById(R.id.gallery);
//use the same timer. Cancel if running
if(timerDescriptionScrolling!=null){
timerDescriptionScrolling.cancel();
}
timerDescriptionScrolling = new Timer("TextScrolling");
final Activity activity = this;
long msBetweenSwaps=3500;
//schedule this to
timerDescriptionScrolling.scheduleAtFixedRate(
new TimerTask() {
int i=0;
public void run() {
activity.runOnUiThread(new Runnable() {
public void run() {
SlideshowPhoto currentSlideshowPhoto = (SlideshowPhoto)imageAdapter.getItem(gallery.getSelectedItemPosition());
View currentRootView = gallery.getSelectedView();
TextSwitcher switcherDescription = (TextSwitcher)currentRootView.findViewById(R.id.slideshow_description);
updateScrollingDescription(currentSlideshowPhoto,switcherDescription);
//this is the max times we will swap (to make sure we don't create an infinite timer by mistake
if(i>30){
timerDescriptionScrolling.cancel();
}
i++;
}
});
}
}, msBetweenSwaps, msBetweenSwaps);
}
Finally I can put this problem to a rest :)
hi i want to give animation using only one image in drawable folder means in imageview tag of xml file i increase width and height of same image now i want to animate it in one place
i had the code which uses series of images seved in drawale folder and animate it but i have only 1 image ..pls give any suitable example which uses only 1 image and animate that image using imageview height and width increasing..thanks in adv
below is my code..
final ImageView splashImageView = (ImageView) findViewById(R.id.SplashImageView);
splashImageView.setBackgroundResource(R.drawable.flag);
final AnimationDrawable frameAnimation = (AnimationDrawable)splashImageView.getBackground();
splashImageView.post(new Runnable(){
#Override
public void run() {
frameAnimation.start();
}
});
final SplashScreen sPlashScreen = this;
// The thread to wait for splash screen events
mSplashThread = new Thread(){
#Override
public void run(){
try {
synchronized(this){
// Wait given period of time or exit on touch
wait(5000);
}
}
catch(InterruptedException ex){
}
}
};
mSplashThread.start();
}
Try this:
ScaleAnimation scaler = new ScaleAnimation((float) 0.7, (float) 1.0, (float) 0.7, (float) 1.0);
scaler.setDuration(40);
imageView1.startAnimation(scaler);
"become big and small in one place" usually is called scaling.
I didn't really read it (just googled "android scaling images"), but this forum post might help you out. It seems to have a code tutorial:
http://www.anddev.org/resize_and_rotate_image_-_example-t621.html