How to Move an Image from Left to Right in Android

How I can move an image from left to right and right to left in android?

Now, I understand my problem. Thank you very much to give your suggestion.
Here is my updated code.

    public class GameView extends SurfaceView{
    private Bitmap BG_image;
    private SurfaceHolder holder;
    int x=100;
    private int srcX=100;
    private int srcY=100;
    int distance=50;

    public GameView(Context context) {

        super(context);
        holder = getHolder();
        holder.addCallback(new SurfaceHolder.Callback() {

            @Override
            public void surfaceDestroyed(SurfaceHolder holder) {

            }

            @Override
            public void surfaceCreated(SurfaceHolder holder) {

                Canvas c = holder.lockCanvas(null);
                onDraw(c);
                holder.unlockCanvasAndPost(c);
            }

            @Override
            public void surfaceChanged(SurfaceHolder holder, int format,

                    int width, int height) {
            }
        });
        BG_image = BitmapFactory.decodeResource(getResources(), R.drawable.icon);
        Bitmap.createScaledBitmap(BG_image, BG_image.getWidth(), BG_image.getHeight(), false);
    }
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        // TODO Auto-generated method stub
        x = (int) ev.getX();        
        if(x-srcX>0)
            srcX += distance;
        else if(x-srcX<0)
            srcX -= distance;

        if(srcX<=100)
            srcX = 100;
        else if(srcX>250)
            srcX = 250;     
        Log.w("ev.getX : srcX",x+" : "+srcX);
        SurfaceHolder holder=getHolder();
        Canvas myCanvas=holder.lockCanvas(null);
        onDraw(myCanvas);
        holder.unlockCanvasAndPost(myCanvas);
        return super.onTouchEvent(ev);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        // TODO Auto-generated method stub  
        Paint paint = new Paint();
        canvas.drawColor(Color.BLACK);
        canvas.drawRect(new Rect(0,0,getWidth(),getHeight()),paint);
        canvas.drawBitmap(BG_image, srcX-BG_image.getWidth()/2, srcY, null);
    }
}

How to slide an ImageView from left to right smoothly in Android?

Creating this kind of tween animation is simple. Just follow the steps,

Step 1

Create a directory anim inside the res directory and put this as slide.xml

<?xml version="1.0" encoding="utf-8"?>
<set
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator"
    android:fillAfter="true">

   <translate
        android:fromXDelta="0%p"
        android:toXDelta="75%p"
        android:duration="800" />
</set>

You can obviously customize the animation by changing the two attributes fromXDelta and toXDelta. The %p refers to with respect to the parent which simply means that it will move the image 75% with respect to the parent.

Step 2

// Refer the ImageView like this
imageView = (ImageView) findViewById(R.id.img);

// Load the animation like this
animSlide = AnimationUtils.loadAnimation(getApplicationContext(),
                    R.anim.slide);

// Start the animation like this
imageView.startAnimation(animSlide);

You can also setInterpolator() and setListeners() if you want to. I haven't shown them here to keep it simple. If you need, just let me know.

NOTE

As you have mentioned repeatedly, that you are experiencing a laggy animation. I have tested this animation on 3 real devices and 2 emulators and the animation was buttery smooth on all of them. Tested on low end devices like Moto E to high end devices like Nexus 5 and Galaxy S6.

If you still have a lag running this code, then the test device must be the reason. The code is perfect.

UPDATE

I just checked on my Moto G running on Lollipop too, the animation is running smoothly. This is a very small and light-weight animation, and should never be laggy. If you are still getting a lag, then it must be the device you are testing, or some other piece of code on that Activity making the UI slow or unresponsive.

Try to check which one is applicable to you,

• I have tested on a total of 6 devices now with no lag at all. So, you can be rest assured that your production app will not have any lag, it can be your device which is slow
• If you are doing some heavy operations like accessing the file system, database, or any other heavy operation, it must be slowing down the UI thread and you are loosing frames. Try to use AsyncTask for these heavy operations

Move image left or right on swipe

I did the same thing using swipe card library go through it

https://github.com/Diolor/Swipecards

Move image to right

Use RelativeLayout for that and use below XML code for solve your problem.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_toLeftOf="@+id/imageView1"
        android:orientation="vertical"
        android:paddingLeft="10dp" >

        <TextView
            android:id="@+id/title"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Title"
            android:textColor="#000000"
            android:textSize="16sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/detail"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Detail"
            android:textColor="#000000" />

        <TextView
            android:id="@+id/data"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Data"
            android:textColor="#000000" />
    </LinearLayout>

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/error"
        android:scaleType="centerCrop" />

</RelativeLayout>

How to align 2 images left and right inside LinearLayout in android

Here is your layout

<?xml version="1.0" encoding="utf-8"?>
<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"
android:orientation="vertical">

<fragment
    android:id="@+id/map"
    class="com.google.android.gms.maps.SupportMapFragment"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" />

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/bt_white"
    android:orientation="horizontal"
    android:weightSum="3">

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_alignParentLeft="true"
        android:layout_marginStart="5dp"
        android:src="@android:drawable/ic_menu_camera" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="First Text View"
            android:textColor="@color/black" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Second Text view"
            android:textColor="@color/black" />
    </LinearLayout>

    <ImageView
        android:id="@+id/imageView12"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_alignParentRight="true"
        android:src="@android:drawable/ic_menu_camera" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>

Here is how it looks

---

Related Topics