Android Autoscroll imageview

Question

In my activity I have just an ImageView. In it, the src is a picture that is a lot bigger than the screen. I want the picture to scroll slooooowly from left to right until it reaches the right margin of the photo, then start scrolling back towards left until left margin reached. Then start all over again. I need it to happen in a separate thread so the phone would not freeze while this happens. This Is What I need

How can I achieve this? Is there a widget that does this by default?

UPDATED CODE // layout:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/mylinear" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <ImageView android:id="@+id/img" android:layout_width="wrap_content" android:layout_height="wrap_content" android:scaleType="center" android:src="@drawable/rainforest" /> </RelativeLayout>

// and Activity

public class MainActivity extends Activity { Animation _translateAnimation; RelativeLayout _relativeLoading = null; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); _translateAnimation = new TranslateAnimation(TranslateAnimation.ABSOLUTE, 0f, TranslateAnimation.ABSOLUTE, -100f, TranslateAnimation.ABSOLUTE, 0f, TranslateAnimation.ABSOLUTE, 0f); _translateAnimation.setDuration(5000); _translateAnimation.setRepeatCount(-1); _translateAnimation.setRepeatMode(Animation.REVERSE); // REVERSE _translateAnimation.setInterpolator(new LinearInterpolator()); _relativeLoading = (RelativeLayout) findViewById(R.id.mylinear); _relativeLoading.startAnimation(_translateAnimation); }

But it goes off the picture. I mean, the scroll goes from left to right, "pushing" the picture to the left and showing the white background bellow the ImageView.

Also, should this be inside a thread or something? I need to be able to exit this "scrolling" activity somehow, without using the Back button. I want a button on top of the ImageView (the button should stay still) and onClick it should start another Intent
It seems like the picture inside the ImageView is cropped to fit inside the screen. How can I overcome this?

You should use TranslateAnimation with some Repeat attribute — An-droid
– An-droid, Commented Aug 21, 2013 at 8:20

user1137313 · Accepted Answer · 2013-08-21 12:24:20Z

So, the solution to my problem is here (for all of the new android developers, like me, who might need this for their apps):

public class MainActivity extends Activity { Animation _translateAnimation; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); _translateAnimation = new TranslateAnimation(TranslateAnimation.ABSOLUTE, 0f, TranslateAnimation.ABSOLUTE, -300f, TranslateAnimation.ABSOLUTE, 0f, TranslateAnimation.ABSOLUTE, 0f); _translateAnimation.setDuration(8000); _translateAnimation.setRepeatCount(-1); _translateAnimation.setRepeatMode(Animation.REVERSE); // REVERSE _translateAnimation.setInterpolator(new LinearInterpolator()); ImageView img = (ImageView) findViewById(R.id.img); img.startAnimation(_translateAnimation); } }

and the layout:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/global_relative" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:orientation="vertical" > <ScrollView android:layout_width="fill_parent" android:layout_height="wrap_content" > <ImageView android:id="@+id/img" android:layout_width="600dp" android:layout_height="wrap_content" android:adjustViewBounds="true" android:background="@drawable/rainforest" android:scaleType="center" android:src="@drawable/rainforest613x490" > </ImageView> </ScrollView> </RelativeLayout>

just make sure your image is big/high enough to fit the screen, and is (+300dp) wider than the screen width (or adjust the code above).

Happy coding ;)

Hey I am facing the same issue can you help me in this... i am struggling with this for past 3 hrs.... Thank you
Scroll view is not necessary, what made the trick was setting custom width to ImageView (600dp) and then setting scale type center and then adding translate animation to ImageView.

An-droid · Accepted Answer · 2013-08-21 08:45:10Z

Exemple :

private Animation _translateAnimation; private ImageView _image; _image = (ImageView)findViewById(R.id.yourimage); _translateAnimation = new TranslateAnimation(TranslateAnimation.ABSOLUTE, 0f, TranslateAnimation.ABSOLUTE, 100f, TranslateAnimation.ABSOLUTE, 0f, TranslateAnimation.ABSOLUTE, 0f); _translateAnimation.setDuration(10000); _translateAnimation.setRepeatCount(-1); _translateAnimation.setRepeatMode(Animation.REVERSE); _translateAnimation.setInterpolator(new LinearInterpolator()); _image.setAnimation(_translateAnimation);

This will make _linearLoading translate slowly right and left and right and left...

More duration = more slowly

TranslateAnimation.ABSOLUTE = Work with the position of the image TranslateAnimation.RELATIVE_TO_PARENT = Work with the parent layout ...

The method TranslateAnimation(start x, end x, start y, end y)

play with that

Please check my question for updated code using TranslateAnimation that does not work...
_linearLoading should be what you want to translate, here it's your image. So you must get it with findviewbyid()..
I think my mistake is that I animate the imageview... and it seems that the imageview crops the actual image to the visible size, because no matter where I do my translation, the white background appears instead of showing more of the source picture. What should I do in order to see the rest of the picture instead of background?
I use this code to translate a linearLayout with a background image in a loading screen and it works perfectly. Play with the "scaleType" if the image
If I do it with linearLayout instead of ImageView, the app crashes. Can you put here the whole animation code that you use and that works for you? It does not work for me. It crashes.

user2455235 · Accepted Answer · 2013-08-21 08:24:22Z

What you could do is add the ImageView inside a ScrollView. Like this

<ScrollView android:id="@+id/img_scroll" android:layout_width="fill_parent" android:layout_height="fill_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/IMAGENAME" /> </ScrollView>

As you want to scroll the Image automatically, you could create a AsyncTask and inside doInBackground() method, create a new Runnable or runOnUiThread() and send commands to the ScrollView using it's ID to scroll as you need it to.

Can you give me some hint code on how to send commands to the scrollview?

Collectives™ on Stack Overflow

Android Autoscroll imageview

3 Answers 3

3 Comments

13 Comments

1 Comment

Linked

Hot Network Questions