Advanced Android - Draw a Spritesheet

Quiz

The below example shows Android Program to Draw a Spritesheet on a Canvas

Example

This example demostrate about how to integrate Android Draw a Spritesheet on a Canvas.

Step 1 − Create a new project in Android Studio, go to File ⇒ New Project and fill all required details to create a new project.

Step 2 − Add the following code to res/layout/activity_main.xml.

<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" >
   <Button 
      android:id = "@+id/startbutton"
      android:layout_width = "fill_parent"
      android:layout_height = "wrap_content"
      android:text = "Start"
      android:textAlignment = "center" >
   </Button>
   <TableLayout
      android:layout_width = "wrap_content"
      android:layout_height = "wrap_content"
      android:gravity = "center"
      android:padding = "10dp" >
      <TableRow>
         <TextView 
            android:id = "@+id/timer"
            android:layout_width = "wrap_content"
            android:layout_height = "wrap_content"
            android:paddingRight = "10dp"
            android:text = "Time: "
            android:textSize = "20dp" />
      </TableRow>
   </TableLayout>
   <TextView
      android:id = "@+id/timeElapsed"
      android:layout_width = "wrap_content"
      android:layout_height = "wrap_content"
      android:paddingLeft = "10dp"
      android:paddingRight = "10dp"
      android:text = "Time elapsed: "
      android:textSize = "20dp" />

</LinearLayout>

Step 3 − Add the following code to src/MainActivity.java

Here abc indicates the logo of Tutorialspoint.com

package myapplication.example.com.myapplication;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.os.Bundle;

import android.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
import android.view.View.OnTouchListener;

public class MainActivity extends Activity implements OnTouchListener{
   Ourview v;
   Bitmap bm , bitmap1;
   float x,y; 
   
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      // TODO Auto-generated method stub
      super.onCreate(savedInstanceState);
      v = new Ourview(this);
      v.setOnTouchListener(this);
      bm = BitmapFactory.decodeResource(getResources(), R.drawable.abc);
      bitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.abc);
      x = 0;y = 0;
      setContentView(v);
   }
   
   @Override
   protected void onPause() {
      // TODO Auto-generated method stub
      super.onPause();
      v.pause();
   } 
   
   @Override
   protected void onResume() {
      // TODO Auto-generated method stub
      super.onResume();
      v.resume();
   } 
   
   // surface view is going to be a thread now
   class Ourview extends SurfaceView implements Runnable {
      Thread th = null;
      SurfaceHolder holder;
      boolean var = false;
      sprite sprite_object;
      boolean sprite_loaded = false;
      public Ourview(Context context) {
         super(context);
         // TODO Auto-generated constructor stub
         holder = getHolder();
      } 
      
      @Override
      public void run() {
         // TODO Auto-generated method stub
         while (var = true) {
            // do stuff
            if (!holder.getSurface().isValid()) {
               continue;
            } 
            if(!sprite_loaded){
               sprite_object = new sprite(this,bitmap1);
               sprite_loaded = true;
            } 
            
            Canvas c = holder.lockCanvas();// while drawing on a canvas we
            // lock it and after drawing on
            // it we unlock it
            OnDraw(c);
            holder.unlockCanvasAndPost(c);
         } 
      } 
      
      @SuppressLint("WrongCall")
      void OnDraw(Canvas c){
         c.drawARGB(255, 250, 150, 20);//rgb values
         c.drawBitmap(bm, x -(bm.getWidth()/2), y -(bm.getHeight()/2), null );
         sprite_object.onDraw(c);
      } 
      
      public void pause() {
         var = false;
         while (true) {
            try {
               th.join();// would pause the currently executing thread till
               // the user finishes its job
            } catch (InterruptedException e) {
               // TODO Auto-generated catch block
               e.printStackTrace();
            } 
            break;
         } 
         th = null;
      } 
      public void resume() {
         var = true;
         th = new Thread(this);
         th.start();
      } 
   }
   
   @Override 
   public boolean onTouch(View v, MotionEvent me) {
      // TODO Auto-generated method stub
      //x = me.getX();//ontouch listener
      //y = me.getY();
      try {
         Thread.sleep(80);
      } catch (InterruptedException e) {
         // TODO Auto-generated catch block
         e.printStackTrace();
      } 
      switch (me.getAction()) {
         case MotionEvent.ACTION_DOWN:
            x = me.getX();
            y = me.getY();
            break;
         case MotionEvent.ACTION_UP: 
            x = me.getX();
            y = me.getY();
            break;
         case MotionEvent.ACTION_MOVE:
            x = me.getX();
            y = me.getY();
            break;
         default:
            break;
      } 
      return true;
   }
}

Step 4 − Add the following code to src/Sprite.java

package myapplication.example.com.myapplication;

import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Rect;

import myapplication.example.com.myapplication.MainActivity.Ourview;

public class sprite {
   int x,y,xspeed,yspeed,height,width;
   Bitmap b;
   Ourview our_view;
   
   public sprite(Ourview ourview, Bitmap bitmap1) {
      // TODO Auto-generated constructor stub
      b = bitmap1;
      our_view = ourview;
      height = b.getHeight();
      width = b.getWidth();
      x = y = 0;
      xspeed = 5;
      yspeed = 0;
   } 
   
   public void onDraw(Canvas c) {
      // TODO Auto-generated method stub
      update();
      Rect src = new Rect(0, 0, width, height);
      Rect dst = new Rect(x,y,x+width,y+height);
      c.drawBitmap(b,src, dst, null);
   } 
   
   private void update() { 
      // TODO Auto-generated method stub
      x+ = xspeed;
      y+ = yspeed;
   }
}

Step 5 − No need to change manifest.xml

Let's try to run your application. I assume you have connected your actual Android Mobile device with your computer. To run the app from android studio, open one of your project's activity files and click Run Eclipse Run Icon icon from the toolbar. Select your mobile device as an option and then check your mobile device which will display your default screen −

Print Page