Sunday, June 30, 2013

First Android Application

In this short tutorial I will show you how to convert the screen of your Nexus 7 into checker board.

I assume you have installed java 1.6 or 1.7, Eclipse classic (Juno) with plugin for Android and these Android packages: Android 4.2.2, 4.0.3 and 2.3.3 with SDK, Documentation, Google APIs, ARM EABI, Samples for SDK and Tools all 3 packages.

First create Android application in Eclipse and call it CheckerBoardApp. Leave everything default except when creating the project set Theme to none. You can also rename the java package from example to... lets say CheckerBoardPkg or you can leave it default.For publishing your app on Google Play you must change the package name to something different than example because it will not be accepted

Once you have the new application generated add new java class in the main src folder and call it CheckerBoard.

Add this code in it and save:

package com.checkerboardpkg.checkerboardapp;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.view.View;

public class CheckerBoard extends View {

    private final int TILE_WIDTH_HEIGHT = 160;
    private Paint currentPaint = null;
   
    public CheckerBoard(Context context) {
        super(context);
        currentPaint = new Paint();
        setFocusable(true);

    }

    @Override
    protected void onDraw(Canvas canvas) {

        canvas.drawColor(Color.BLACK);

        int currentColor = 0;
       
        for (int i = 0; i < 8; i += 1) {
            for (int j = 0; j < 5; j += 1) {
               
                // set up color and Paint object
                if ((i + j) % 2 == 0) {
                    currentColor = Color.WHITE;
                } else {
                    currentColor = Color.BLACK;
                }
                currentPaint.setAntiAlias(true);
                currentPaint.setColor(currentColor);
               
                // draw rectangles to form checker board
                canvas.drawRect(j * this.TILE_WIDTH_HEIGHT, i
                        * this.TILE_WIDTH_HEIGHT, (j + 1)
                        * this.TILE_WIDTH_HEIGHT, (i + 1)
                        * this.TILE_WIDTH_HEIGHT, currentPaint);
            }
        }
    }
}


Basically what we do here is we create 8 rows and 5 columns of rectangles into the Canvas. We check the counters i and j if their sum is even or odd number and we change the color to white and than black appropriatelly. Each rectangle is 160x160 pixels so we get exactly 800x1280 screen which is the exact size of Nexus 7 screen resolution.


Now you must set the content of main acitivity to be the CheckerBoard view. We do that by adding this line

setContentView(new CheckerBoard(this));

as last statement in

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        setContentView(new CheckerBoard(this));
    }

function in MainActivity.java class.

Now the code is ready but to see it in action you must create Android Virtual Machine to run it on.
In Eclipse press Window -> Android Virtual Device Manager and that click New. Name it Nexus7AVD, Device: Nexus 7, target: Android 4.2.2, and set RAM to 512. It is 1024 by default but it may not start up if on Windows with low memory. Set SD card to 100 MB. Click OK.

Then press start and then launch. Wait some time while the AVD is not started. After you see the batery icon on top, your AVD is ready to run so go to Eclipse and right click on the project node in package explorer and click Run as -> Android Application.

Here is what you should see:




Mine app was called TileGame, but you should see CheckerBoardApp instead

No comments:

Post a Comment