HKUSTx: COMP107x Introduction to Mobile Application Development using Android

Week1-01.ipynb

Week1-02.ipynb

Week1-03.ipynb

Week1-04.ipynb

Week1-05.ipynb

Week2-01.ipynb

Week2-02.ipynb

Week2-03.ipynb

Week2-04.ipynb

Week2-05.ipynb

Week3-01.ipynb

Week3-02.ipynb

Week3-03.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Exercise: Basic Graphics\n",
    "---\n",
    "## Objectives\n",
    "\n",
    "In this exercise you will learn more about 2D graphics support in Android using a View, and the use of the onDraw() method and canvas. At the end of this exercise you will be able to:\n",
    "\n",
    "* Define custom views in Android by subclassing the View class and use them in your UI\n",
    "* Make use of the 2D graphics support in Android to draw on the view canvas\n",
    "\n",
    "## Introduction\n",
    "\n",
    "This project demonstrates the use of a view canvas to create 2D graphics in Android for a simple application. We will then leverage this idea to develop a simple shooting game in the subsequent exercises.\n",
    "\n",
    "### Textual Instructions\n",
    "---\n",
    "### Step 1: Examining the Project Files\n",
    "\n",
    "1. Download the [BasicGraphics.zip](http://w02.hkvu.hk/edX/COMP107x/w3/BasicGraphics.zip) file, unzip it and import the project into Android Studio.\n",
    "2. Open the **MainActivity.java** file and follow the video instructions.\n",
    "3. Open the **activity_main.xml** file. Note on the use of the custom view in the UI layout as shown in the video instructions.\n",
    "\n",
    "---\n",
    "### Step 2: Updating the DrawView\n",
    "\n",
    "1. Open the **DrawView.java** file. In this class, you need to complete the implementation of the constructor and the onDraw() method.\n",
    "2. Replace the *//TODO CREATE PAINT OBJECTS* with the following code.\n",
    "           \n",
    "        redpaint = new Paint();\n",
    "        redpaint.setColor(Color.RED);\n",
    "        bluepaint = new Paint();\n",
    "        bluepaint.setColor(Color.BLUE);\n",
    "        \n",
    "3. Replace the *//TODO CREATE AN ANDROID GUY BITMAP* with the following code.\n",
    "        android_guy = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(context.getResources(),R.mipmap.ic_launcher),50,50, false);\n",
    "4. Replace the *//TODO DRAW ITEMS ON CANVAS* with the following code:\n",
    "        \n",
    "        canvas.drawLine(width / 2, height-100, width / 2, height, bluepaint);\n",
    "        canvas.drawRect(width / 2 - 30, height - 10, width / 2 + 30, height, bluepaint);\n",
    "        canvas.drawCircle(width / 2, height - 40, 10, redpaint);\n",
    "        canvas.drawRect(width / 2 - 10, height - 40, width / 2 + 10, height, bluepaint);\n",
    "        canvas.drawBitmap(android_guy, width/2, 0, null);\n",
    "        \n",
    "5. Run the project and see the result on the emulator or device."
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 2",
   "language": "python",
   "name": "python2"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 2
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython2",
   "version": "2.7.6"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 0
}

Week3-04.ipynb

Week3-05.ipynb

Week4-01.ipynb

Week4-02..ipynb

Week4-03.ipynb

Week4-04.ipynb

Week5-01.ipynb

Week5-02.ipynb

Week5-03.ipynb

Week5-04.ipynb