Click here to download code and sample project

Currently, developing mobile applications is one of the most popular environments to program. So, I decided to go ahead and take a step back into the world of Java to create an Android app. I went ahead and decided to give Google’s IDE, Android Studio, a try during this process. The IDE, which is based on IntelliJ IDEA, is still in early access preview though, but already looks quite promising.

To get started I went ahead and downloaded the Android Studio. As a preface, Android Studio requires at least JDK 6 installed before beginning. The entire installation process may take a while if the JDK needs to be installed first. Also, I would highly recommend downloading Genymotion as an Android Emulator replacement since the one on Android Studio is extremely slow. As for learning how to develop an Android application, the tutorial on Android’s site works quite well located here.

So, during this project I decided to port my coworkers TicTacToe concept into Android. The game is similar to regular TicTacToe, except the game is expanded into a 3×3 grid of TicTacToe games. Each individual game that is won is considered a marker for the overall game. There is also a bit of strategy that was added to force the player to consider where their next move should. Needless to say, it is quite an interesting take on TicTacToe and I encourage you to try it.

Since I am coming from a C#/WPF world I am going to bring over some of the concepts of MVVM into this architecture. If you are not familiar withMVVM it is simply a way to decouple business logic from the UI. This way the UI can change however it needs to while keeping the main logic the same.

To get started, open up Android studio and create a new project. When created you can see there is already a pretty verbose folder structure created for a default project.

 

Let us start off with adding basic information for our application by looking into the AndroidManifest.xml. In here I will simply add a title for our app by setting the  android:label property. Then to include an app icon, I must include an image into each of the res/drawable-xxxx folders with the image resized appropriately. Here is a rough break down of the dimensions:

• • drawable-ldpi (120 dpi, Low density screen) – 36px x 36px
  • drawable-mdpi (160 dpi, Medium density screen) – 48px x 48px
  • drawable-hdpi (240 dpi, High density screen) – 72px x 72px
  • drawable-xhdpi (320 dpi, Extra-high density screen) – 96px x 96px
  • drawable-xxhdpi (480 dpi, Extra-Extra-high density screen) – 144px x 144px

From <http://stackoverflow.com/questions/5350624/set-icon-for-android-application>

After that we will go back to our manifest file and set the android:icon to our new app icon. Once we compile the app successfully and attempt to run though, the studio brings up the Device Manager to choose an emulator. If you decided to install Genymotion (which I still highly recommend), run it and add a new device to emulate. Once added, select the new device and click play. You will see the device represented in a new window and back in Android Studio when you look in the Device Manager you should see your new emulator.

 

So selecting our new emulator we’re able to start running our application. Great, now let us start developing our custom View. I created a MiniBoardView class that extends View which will handle the drawing of the board, markings, and whether the board is in a playable, win, or draw state. You can download the project and view the class file to see all the logic that goes into place, but here are a few main points:

• We will need to create a custom Paint object that handles the drawing to the screen
• Any new action that can apply to the board needs a call to invalidate to update the UI
• To view the control in the designer, certain logic will need to get ignored on rendering. This can be done by doing a check on isInEditMode
• For all our rendering purposes, make sure to override the onDraw method

Once our view is ready for usage, I went ahead and started implementing the business logic. After setting up the base Model-ViewModel classes I went ahead and tried out my first hit test logic.

 

Now that the basis for our application is done, the rest is simply filling out the logic for our game.  Here is our final result:

 

This should go without saying, but Android Studio is not even at version 1.0. Because of that the IDE is quite unstable. This led to many different frustrations throughout the learning process. Sometimes I would have to restart Android Studio simply because it refused to successfully build anymore. Another peculiar issue I ran into was opening up my project one day, running my app, and suddenly view this:

 

 

What happened to the sizes of my boxes? Did the logic change? No. Did I mistype something? No. Maybe restarting will help? No. I tried many different solutions and even recoded much of the design to no avail. Out of frustration I stepped away for a while and came back to find everything was back to normal. Never saw this problem again. Also, I use to update the product periodically as well until one update caused my whole project to fail. Several hours of snooping online pointed me to updating certain gradle files to get my project working again. Needless to say, I ceased doing that for the rest of my development.

Overall, I enjoyed the development process going back into Java and using Android Studio. I did not take full advantage of what the Android stack has available but I look forward to attempting another project using this IDE.