Pseudo 3D Graphics for Android Game. Drawing Game Field Cell.

Now we can start drawing the cells. Cells are drawn in the main application’s  Activity by DrawCells function activated from onDraw.

private void DrawCells(Canvas canvas, Paint foreground)
{
int currentNumber = 0;
Cell currentCell = null;
int leftInRealBitmap = 0;
int leftOnScreen = 0;
int topOnScreen = 0;

// get game field sizes
int fieldLength = this.gameLogic.GetFieldLength();
int fieldHight = this.gameLogic.GetFieldHight();

// draw cells from right to the left, and top down
for (int i = 0; i < fieldHight; i++)
{
for (int j = fieldLength - 1; j >= 0; j--)
{
// get a cell with corresponding coordinates
currentCell = this.gameLogic.GetCell(j, i);
if (currentCell != null)
{
// determine sprite shift in a bitmap containing a set of sprites
currentNumber = currentCell.GetBitmapNumber();
leftInRealBitmap = currentNumber * realTileWidth;

// determined coordinates of the upper left corner of a cell on the page
leftOnScreen = (int) (j * width - horCorrection * j + horLineCorrection * i);
topOnScreen = (int) (i * height - verCorrection * i - verLineCorrection * j);

// draw the cell on the screen
canvas.drawBitmap(BlockAdventure.normalBitmaps, new Rect(leftInRealBitmap, 0, leftInRealBitmap + width,height), new RectF(leftOnScreen, topOnScreen, leftOnScreen + width, topOnScreen + height), foreground);
}}}}

At the output of the image in isometric projection it is always necessary to take into account the order of sprites output on the screen, not only for the 3D effect creation as objects on the foreground should overlap background objects, but due to peculiarities of isometric sprites themselves, which are intended for an output in a corresponding order. In this example you can see that it is necessary to start the output from the right upper corner of the scene gradually shifting to the bottom left corner:

for (int i = 0; i < fieldHight; i++)
{
for (int j = fieldLength - 1; j >= 0; j--)
{...}
}

Also sprites can be drawn from the left to the right and top down, depending on the angle used to create projection. To be more precise it depends on a sign of angle, i.e. camera can be turned on a negative angle also. Besides, it is necessary to take into consideration the order of sprites output depending on their placement regarding each other. For example, in the majority of cases, the block is situated on the foreground, as it is moved on the game field and is always drawn the last over game field cells, but in the moment of falling behind the boundaries of the field the block can be on the background, for example if it falls over the upper field boundary. These moments should be considered and an order of block and cells output should be changed.

One more peculiarity of drawing isometric sprites is connected with the fact that “rhombic” sprites are used in isometric projection, but we can only use rectangular ones. In order to solve this problem it is necessary to implement a shift of each game field cell (in particular of the upper left sprite corner) both vertically and horizontally. The shift should be implemented in two directions, in positive and negative. In the example you can see thatleftOnScreen coordinate depends on 2 constant parameters:

  • horCorrection - used for evening-out of a distance between the cells;
  • horLineCorrection - used to create effect of perspective.

The same way, verCorrection and verLineCorrection parameters are used. In the example above width and height are width and height of cell sprite correspondingly. In order to define values of horCorrection, horLineCorrection, verCorrection и verLineCorrection it is necessary to take a look at the following picture:

Corrections

Corrections

Corrections

Corrections

On the image, we can see how values horCorrection, horLineCorrection, verCorrection и verLineCorrection should be calculated.

As you see from the program code given above, on practice horCorrection, horLineCorrection, verCorrection and verLineCorrection implement a correction show on the next picture:

Preparing Game Field

Preparing Game Field

See the next part Drawing Isometric Block” very soon! Sign up for RSS feed or follow us on twitter to be posted about updates!

bookmark bookmark bookmark bookmark bookmark bookmark bookmark bookmark bookmark bookmark bookmark bookmark

Leave a Reply

 
(required)

 
(will not be published)(required)

 
(optional)