Introduction and method of Android canvas for game development

  • 2020-05-17 06:21:48
  • OfStack

Canvas, in English, the word means canvas. In Android, we use Canvas as a canvas on which we can draw anything we want with the help of a set of brushes (Paint class). It is also the core class for displaying bitmaps (Bitmap class). Depending on the user's preferences, Canvas can also set some properties about the canvas, such as the color and size of the canvas. Canvas provides the following methods:
Canvas(): create an empty canvas. You can use the setBitmap() method to set the specific canvas to draw.
Canvas(Bitmap bitmap): create a canvas with the bitmap object, and all the content will be drawn on bitmap, so bitmap cannot be null.
Canvas(GL gl): used when painting the effect of 3D, associated with OpenGL.
drawColor: sets the background color of Canvas.
setBitmap: sets the concrete canvas.
clipRect: set the display area, that is, set the clipping area.
isOpaque: detects whether transparency is supported.
rotate: rotate the canvas
translate: move the canvas

scale: scale the canvas
setViewport: sets the display window on the canvas.
skew: set the offset.

restore: used to restore save to its previous state

save: used to save the current state of Canvas

Note: save method and restore method 1 usually appear in pairs. save method can be more than restore method, but restore method cannot be more than save method

Several common methods are listed above. In game development, we may need to rotate, scale, and perform some other operations on a Sprite. We can do this by rotating the canvas, but when we rotate the canvas, we will rotate all the objects on the canvas, and we only need to rotate one of them. In this case, we need to use save method to lock the objects to be operated on, and restore method to unlock the objects after the operation.


Get the canvas canvas object


Canvas canvas = getHolder().lockCanvas(); 

Some properties and methods of the canvas and some applications
 
if (canvas != null) { 
    //---- Set the canvas to draw without jagged edges  
    canvas.setDrawFilter(pfd); 
    //---- Use the fill canvas, refresh  
    canvas.drawColor(Color.BLACK); 
    //---- Draw text  
    canvas.drawText("drawText", 10, 10, paint); 
    //---- Draw pixels  
    canvas.drawPoint(10, 20, paint); 
    //---- Draws multiple pixels  
    canvas.drawPoints(new float[] { 10, 30, 30, 30 }, paint); 
    //---- Draw a straight line  
    canvas.drawLine(10, 40, 50, 40, paint); 
    //---- Draw multiple lines  
    canvas.drawLines(new float[] { 10, 50, 50, 50, 70, 50, 110, 50 }, paint); 
    //---- Draw a rectangle  
    canvas.drawRect(10, 60, 40, 100, paint); 
    //---- Draw a rectangle 2 
    Rect rect = new Rect(10, 110, 60, 130); 
    canvas.drawRect(rect, paint); 
    canvas.drawRect(rect, paint); 
    //---- Draws a rounded rectangle  
    RectF rectF = new RectF(10, 140, 60, 170); 
    canvas.drawRoundRect(rectF, 20, 20, paint); 
    //---- Draw a circular  
    canvas.drawCircle(20, 200, 20, paint); 
    //---- Draw the arc  
    canvas.drawArc(new RectF(150, 20, 200, 70), 0, 230, true, paint); 
    //---- Draw the ellipse  
    canvas.drawOval(new RectF(150, 80, 180, 100), paint); 
    //---- Draws the specified path graph  
    Path path = new Path(); 
    // Set path starting point  
    path.moveTo(160, 150); 
    // route 1 
    path.lineTo(200, 150); 
    // route 2 
    path.lineTo(180, 200); 
    // End of the path  
    path.close(); 
    canvas.drawPath(path, paint); 
    //---- Draws the specified path graph  
    Path pathCircle = new Path(); 
    // add 1 A circular path  
    pathCircle.addCircle(130, 260, 20, Path.Direction.CCW); 
    //---- Draws a circular path text  
    canvas.drawTextOnPath("PathText", pathCircle, 10, 20, paint); 
} 
 

Note: the above code is referenced from "starting from scratch for Android game programming".

Get the custom image width and height of bitmap (parameter 1: context object, parameter 2: resource ID, parameter 3: custom width, parameter 4: custom height)


public static Bitmap loadBallView(Context context,int resId,int width,int height) { 

    Resources resources = context.getResources(); 

    Drawable image = resources.getDrawable(resId); 

    Bitmap bitmap = Bitmap.createBitmap(width,height, Bitmap.Config.ARGB_8888); 

         Canvas canvas = new Canvas(bitmap); 
         image.setBounds(0, 0, width,height); 
         image.draw(canvas); 

         return bitmap; 
    } 

Draw bitmap using canvas
 
Bitmap bitmap = loadBallView(context,R.drawable.image,100,100); 

Paint paint = new Paint(); 

canvas.drawBitmap(bitmap, startX, startY, paint); // parameter 1 : bitmap resources , parameter 2 Initial: X Coordinates, parameters 3 Initial: Y Coordinates, parameters 4 Brush: paint object  


Related articles: