EECS1022-Lab 8 Building a Tic-Tac-Toe Game App using Android Studio Solved

1         Task 1: Complete Weekly Java Tutorial Videos
•   For Lab8, you are assigned to study Weeks 9 – 11 of the Java tutorial series: https://www.youtube.com/playlist?list=PL5dxAmCmjv_64z4oGXy0kHBO7_gPkjNmG [

https://www.youtube.com/playlist?list=PL5dxAmCmjv_4NaazeNVRESY1x1St3QeHc
 
https://www.youtube.com/playlist?list=PL5dxAmCmjv_45YrYlSwHmg34Ctf6Akrx2 To reference tutorial videos from the previous weeks, see:
 
https://www.youtube.com/playlist?list=PL5dxAmCmjv_6wy2m0yq2wObIWPz4tAxW6
[ All Weeks ]
These Java tutorial videos assigned to you are meant for you to:

1.   Obtain extra hands-on programming experience on Java, supplementing your weekly lectures.

2.   Complete the lab assignment with the necessary skills and background.

Though we do not require the submission of the weekly Java tutorial project (like in Lab0), examples and insights discussed in these tutorials will be covered in your (written and programming) tests and exam: should you decide to skip the weekly tutorial videos, it would be your choice.

As you study through the example Java classes in the tutorial videos, you are advised to type them out (but absolutely feel free to add new Java classes to experiment) on Android Studio.

•   You can find the iPad notes of illustrations from the tutorial videos here:

https://www.eecs.yorku.ca/˜jackie/teaching/tutorials/notes/EECS1022%20Tutorial%20on%20Java.pdf

2         Task 2: Setup an Android Studio Project
Starting Task 2 should mean that you have already completed the weekly Java tutorial videos (Section 1).

2.1        Step 1: Install Android Studio
See the detailed PDF instructions “Install Android Studio 3.6.3 File” on the M,N,O eClass site: https:// eclass.yorku.ca/eclass/pluginfile.php/2004743/mod_resource/content/2/Installing_Android_Studio_ v3.6.3.pdf.

2.2        Step 2: Set up an Empty Activity in Android Studio
Unlike previous labs, there is no project archive file for you to import. Instead, you are asked to create an Empty Activity in Android Studio:

1.   Launch Android Studio and click on Create New Project.

2.   Under Select a Project Template, select Empty Activity.

 

3.   Under Configure Your Project:

•    Name: type TicTacToe

•    Package Name: type eecs1022.lab8.tictactoe

•    Save Location: make sure the last part of the path should match the app name TicTacToe

•    Language: choose Java

 

4.   After the new project is successfully built:

4.1   Under app/java/eecs1022.lab8.tictactoe, create a new package called model.

 
 
4.2   Under app/java/eecs1022.lab8.tictactoe (test), rename the JUnit test class ExampleUnitTest to Tests.

 

2.3        Step 3: Download and Replace the Controller Class and JUnit Test Class
1.    From eClass, download the archive file EECS1022W21Lab8.zip, containing:

•   The controller class: MainActivity.java

•   The JUnit test class: Tests.java

2.   As shown in the left figure, do the following replacements:

•   Copy and replace the given MainActivity.java to your project folder:

TicTacToe/app/src/main/java/eecs1022/lab8/tictactoe

•   Copy           and        replace  the         given Tests.java to             your     project  folder: TicTacToe/app/src/test/java/eecs1022/lab8/tictactoe

It is expected that compilation errors exist in both given files when first replaced into your project. See Section 3.2.1.

3         Task 3: Develop a Mobile App in Android Studio
3.1        Step 1: Study the TicTacToe Problem
You are required to develop an object-oriented program solving the problem of a tic-tac-toe game. Tic-tac-toe is a paper-and-pencil game for two players, x and o, who take turns marking the spaces in a 3 × 3 grid. The game may be started either by the x player or by the o player. The player who succeeds in placing three of their marks in a horizontal, vertical, or diagonal line wins the game. For example, Figure 1 shows a tic-tac-toe game where player o wins through a diagonal line. However, it is not necessarily the case that every game has a winner (e.g., see Figure 2): when there is not a single free slot in the grid, and when neither player has managed to mark a winning line, then it is called a tie. That is, a game is considered as over either when there is a winner (e.g., Figure 1), or when there is a tie (e.g., Figure 2).

Note. Your app only needs to determine if there is a tie when all 9 slots on the board have been marked/occupied. That is, your app need not declare a tie when it is already known that no possible subsequent moves can result in a winner.

 

                     Figure 1: Tic-Tac-Toe: The o Player Wins                              Figure 2: Tic-Tac-Toe: A Tie

3.2        Step 2: Using JUnit Tests to Develop Classes in Model Package
3.2.1       Inferring Model Classes from JUnit Tests
•    It is expected that the Tests JUnit class (which you downloaded and copied from eClass) contains compilation errors. This is because that declarations and definitions of the required class(es) and method(s) it references are missing.

 

•    The model package you created is empty. Class(es) and method(s) derived from the given JUnit class must be added to this package. You must not create any classes not indicated by the JUnit tests, otherwise your submitted model classes will not compile with the grading program.

Therefore, your tasks are:

1.   Inferring from the given JUnit tests, add the missing class(es) and method(s) into the model package. Note a line from the Tests class (which specifies that all classes from the model package are referenced):

import eecs1022.lab8.tictactoe.model.*;
2.   Pass all JUnit tests given to you (i.e., a green bar).

You must not modify these given JUnit tests, as they suggest how the intended class(es) and method(s) should be declared.

How to Deal with a Failed JUnit Test? Like the previous labs, in Android Studio, place breakpoints around assertions of the failed tests, launch the debugger, and then use the “step over”, “step into”, “step out”, Variables, and Watches tools to help fix your code. See Java Tutorials Week 9 for how to use all these.

3.2.2       Status of TicTacToe
A tic-tac-toe game’s initial status reports the name of player due to move. Each subsequent status of the game is resulted from the last attempt to move (i.e., by entering a row number and a column number):

•   When there is an error upon moving with the input row and/or column numbers, the game’s status should be the corresponding error message.

•   Otherwise, when there is no error, the game’s status should indicate either the game is over (due to a winner or a tie being determined) or the name of player due to move (see the given JUnit tests).

When multiple errors occur simultaneously, exactly one message for the error with the higher priority (i.e., lower priority number) is displayed. For example, say the game is already over due to a tie, and the denoted (r,c) slot is already occupied, we only output the error message Error: game is already over with a tie.

Inputs: Row number r and column number c (which should be 1, 2, or 3 to be valid).

Rank
Error Condition
Error Message
 

In the above table, the two errors with the same priority cannot occur simultaneously.

3.2.3       Hints and Requirements
•   See this notes on how to declare and manipulate reference-typed, multi-valued attributes:

https://www.eecs.yorku.ca/˜jackie/teaching/lectures/2021/W/EECS1022/notes/EECS1022_W21_Tracing_ PointCollectorTester.pdf

•   See this notes on how to infer classes and methods from given JUnit tests:

https://www.eecs.yorku.ca/˜jackie/teaching/lectures/2021/W/EECS1022/notes/EECS1022_Inferring_ Classes_and_Methods_from_JUnit_Tests.pdf

Programming IDEs such as Eclipse and Android Studio are able to fix such compilation errors for you. However, you are advised to follow the guidance as specified in the notes to fix these compilation errors manually, because: 1) it helps you better understand how the intended classes and methods work together; and 2) you may be tested in a written test or exam without the assistance of IDEs.

•   Any new class(es) you add must reside in the model package.

–    Once the necessary class(es) and method(s) are declared, you can add as many attributes as necessary to implement the body of each method.

–    Study carefully example instances as specified in Tests.java: they suggest the how the intended class(es) and method(s) should be declared and implemented.

–    Focus on gradually passing one test at a time.

3.3        Step 3: Design a GUI Layout
3.3.1       Given GUI Layout to Implement
You are then asked to implement the following GUI design:

 In the left GUI design:

•   Textviews (for displaying input prompts) are boxed in green.

•   Plain Texts (or textfields for reading user-typed inputs) are boxed in blue.

•   The spinner (for displaying a drop-down menu of options) is boxed in orange.

•   Buttons (for invoking attached controller methods) are boxed in red.

•   The (invisible) textview (for displaying computation results) is boxed in purple.

To implement the above GUI design, open activitymain.xml (under app/src/main/res/layout) in Android Studio.

Then, drag, drop, and organize the above specified GUI components. For each GUI component, be sure to set the appropriate text, as suggested above, and set its id to be used later in the controller (MainActivity.java).

3.3.2       Assumed Usage Pattern of the App
For the simplicity of this lab, you can assume that users (or testers) of your app behave in the following way:

Start/Restart
1.

1.1 Enter the name of player x.

1.2 Enter the name of player o.

1.3 Click on the button “START/RESTART”

This step should cause your program to (re-)create a Game object. The bottom of the mobile screen must display the board and status (e.g., next player to make a move) of the current game.

You can also assume that the very first button clicked by the user is “START/RESTART”, whereas each subsequent click on “MOVE” is relative to the game started by the last-clicked “START/RESTART”.

Move
2.

2.1 Enter a row number

2.2 Enter a column number

You can assume that the user’s inputs can be converted into integers, but they may not denote valid rows/columns (in which case the game status should report such errors).

From an external user’s point of view, valid row/column numbers are 1, 2, or 3. On the other hand, the corresponding valid row/column indices (which only you as a programmer need worry about) are, respectively, 0, 1, and 2.

2.3 Click on the button “MOVE”

This step should cause your program to, if no errors, make the necessary changes to the board (e.g., mark x or o on the corresponding slot) and display an updated status of the game.

See Section 3.2.2 for the possible error messages to be displayed.

3.   Repeat Step 2 until the game is over (i.e., a winner is determined or there is a tie).

4.   Repeat from Step 1 if desired to start a new game.

3.4        Step 4: Develop the Controller Class
From Section 2.3, you already copied and replaced the given controller class MainActivity.

•   Follow through the comments/hints in the given controller file to complete it.

•   Refer to this short demo tutorial video on how your Android mobile app is supposed to work: https:

//www.youtube.com/watch?v=bSi5n6WwXsc&list=PL5dxAmCmjv_7YgI2LgcwjWTHiNZSR-aQX&index=3

Tests shown in this demonstration are examples; you should test your app with many other inputs.

•   Test the app by launching it using an emulator in Android Studio:

 

•   The app name on the top of the emulator screen must read:

TicTacToe App - FirstName LastName (StudentNumber)
where your first name, last name, and student number are displayed in the suggested order.