Tuesday, December 9, 2014

Developing MyQuiz Android Apps Part 1


---
Developing MyQuiz Apps Part 1
Using ADT 18 On Win 7

0) Prepare Image For Project Icon

Save the following image as icon.png
http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/glossy-waxed-wood-icons-alphanumeric/071377-glossy-waxed-wood-icon-alphanumeric-question-mark.png

1) Create A New Project

Go to Menu. Select File/New/Android Application Project.

1.1) Enter Application Name

Application Name: My Quiz
Project Name: MyQuiz
Package Name: com.example.myquiz

1.2) Configure Project.

Accept default and click Next.

1.3) Configure Launcher Icon

Browse for the icon image that you have saved in Step 0.

1.4) Create Activity

Accept default and click Next.

1.5) Blank Activity Setup

Activity Name: QuizSplashActivity
Layout Name: splash
Click Finish.

1.6) Observe Package Explorer

2) Duplicate QuizSplashActivity.java as QuizActivity.java

2.1) Select the file QuizSplashActivity.java.
2.2) Go to Menu. Select Edit/Copy.
2.3) Go to Menu. Select Edit/Paste.
2.4) Type Quiz Activity.
Besides using command menu to perform Copy/Paste task, you can also use command keys ie CTRL+C/CTRL+V to achieve the same effect.
2.5) Observe Package Explorer.
(QuizActivity.java should appear in the src folder under com.example.myquiz sub-folder)

3) Edit QuizActivity.Java

Replace the content of the file with the following codes.
package com.example.myquiz;
import android.app.Activity;
public class QuizActivity extends Activity {
    public static final String GAME_PREFERENCES = "GamePrefs";
}
File name: MyQuiz/src/com.example.myquiz/QuizActivity.java

4) Edit QuizSplashActivity.Java

Replace the content of the file with the following codes.
package com.example.myquiz;
import android.os.Bundle;
public class QuizSplashActivity extends QuizActivity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.splash);
    }
}
File name: MyQuiz/src/com.example.myquiz/QuizSplashActivity.java
Note that we extend QuizSplashActivity from QuizActivity Class.
Therefore we do not need to import android.app.activity anymore.
QUizSplashActivity automatically contains GAME_PREFERENCES as its data.
QuizSplashActivity.java doesn’t require menu layout. Therefore, delete the quiz_splash.xml.

5) Create five duplicates QuizSplashActivity.java

Copy and Paste QuizSplashActivity.java as…
QuizMenuActivity
QuizHelpActivity
QuizScoresActivity
QuizSettingsActivity
QuizGameActivity

6) Prepare background image

6.1) Create a folder drawable under res folder.
6.2) Save the following image as bckgrnd.jpg under drawable folder.
480x854 Wallpaper dark, background, line, surface

7) Edit splash.xml and strings.xml

Replace the content of the following files
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bckgrnd">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/splash" />
</RelativeLayout>
File name: MyQuiz/res/layout/splash.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string
        name="app_name">MyQuiz</string>
    <string
        name="splash">SPLASH</string>
    <string
        name="help">HELP</string>
    <string
        name="menu">MENU</string>
    <string
        name="settings">SETTINGS</string>
    <string
        name="game">GAME</string>
    <string
        name="scores">SCORES</string>
</resources>
File name: MyQuiz/res/values/strings.xml
Notice that we have additional string values such as "help""menu""settings","game" are "scores".
At the moment these string values are not being used by any layout file.
We will use them in the subsequent steps.
As a result, if you view the file splash.xml using Graphical Layout mode, you will get the following output.

8) Create five layout duplicates of splash.xml

8.1) Copy and Paste splash.xml as follows.

menu.xml
help.xml
scores.xml
settings.xml
game.xml

8.2) Edit each of the layout files so that their TextView refers to the corresponding string values.

8.3) As a result, you should get the following output when you view the files in Graphical Layout mode.

8.4) Edit each of the Quiz-xxx-Activity.java files so that their content refers to the corresponding xml files.

9) Run your app in the emulator.

At the moment you can only see the QuizSplashActivity layout view only.

REFERENCE

DOWNLOAD

---

No comments:

Post a Comment