How to set ImageView to show different position in

Question

I have the following png:

Each Icon is 100X100 px. All in all 800X100 px.

I have the following ImageView xml:

                <ImageView
                android:id="@+id/CycleStageImage"
                android:layout_width="100dp"
                android:layout_height="100dp">

I would like to set CycleStageImage to be show different Icon (100,100) on Timer Interval of 1 Second back and forth.

I am having a problem generating a code that moves on Axis of this PNG. I have tried the followings from multiple links over SOF, but with no luck:

         //first try - not working
        //Resources res = mainActivity.ApplicationContext.Resources;
        //Bitmap bitmap = BitmapFactory.DecodeResource(res, Resource.Id.CycleImage);
        //BitmapDrawable bitmapDrawable = new BitmapDrawable(Resources.System, bitmap);
        //ClipDrawable clipDrawable = new ClipDrawable(bitmapDrawable, GravityFlags.Center, ClipDrawable.Horizontal);
        //clipDrawable.SetBounds(100, 100, 100, 100);
        //clipDrawable.SetLevel(100);
        //imageView.SetImageResource(Android.Resource.Color.Transparent);
        //imageView.SetImageDrawable(clipDrawable);


        //second try - shows only part of the left top corner
        //double TUNNING = 0.5; //0.5 cut in half
        //Bitmap srcBmp = BitmapFactory.DecodeResource(Resources.System, cycleStage);
        //Bitmap modBmp = Bitmap.CreateBitmap(
        //    srcBmp,
        //    0,
        //    srcBmp.Height, // TUNNING
        //    srcBmp.Height,
        //    srcBmp.Height
        //    );

        //third try - same as the second try.        
        //int START_X = 0;
        //int START_Y = 100;
        //int WIDTH_PX = 100;
        //int HEIGHT_PX = 100;
        //// Crop bitmap 
        //Bitmap newBitmap = Bitmap.CreateBitmap(SOURCE_BITMAP, START_X, START_Y, WIDTH_PX, HEIGHT_PX, null, false);

        //// Assign new bitmap to ImageView 
        //imageView.SetImageBitmap(newBitmap);

I have followed the Android tutorial: https://developer.android.com/guide/topics/resources/drawable-resource.html#Clip

but with no luck.. It would be much appreciated the help with timer as well with the png.

Thanks!

Answer 1

Finally I got it to work, following these steps: (Although I admit its a bit lame...)

1. I divided the above PNG into 8 (100x100) PNGs each using online tool -> PNG Splitter
2. I created a GIF using online tool - GIF Maker -> http://gifmaker.me/
3. I have placed the saved gif under "Assets" folder and changed its properties-> build action to "AndroidAsset"

4. I have created WebView and placed it inside my XML screen. it looks like this:

               <WebView
               xmlns:android="http://schemas.android.com/apk/res/android"
                android:id="@+id/MyWebView"
                android:layout_width="100dp"
                android:layout_height="100dp"/>
   

5. In my Activity I generated the code as follows:

   WebView myWebView = (WebView)findViewById(Resource.Id.MyWebView);
   myWebView.loadUrl("file:///android_asset/Gif.gif");
   

It works like a charm!

I hope it will be of assistant to anyone who desires to accomplish running GIF's inside android application.

Good Luck.