Mid-Term Project for Native Mobile

Programming
Odd Semester AY 2021/2022
Create a simple Tic-Tac-Toe game for 2 players; let’s call it Pentol Silang.

Rules
Failure to follow these rules will result in grading penalties.
1. This is an individual project.
2. You must use Kotlin as the programming language. If you use Java, your project will
not be graded (NTS = 0).
3. All assets should be royalty free. If in doubt, just create your own or use the
provided assets on Classroom (if any).
4. You may modify any of the layouts as you see fit, as long as they still fulfill the
requirements.
5. Name your project PentolSilang_NRP, e.g. PentolSilang_160421987. Failure to use
this naming convention will result in a 5-points penalty.
6. Do NOT use databases. At most, you can only use SharedPreferences to store
data.
7. Any cheating attempt (including plagiarism) is not tolerated and will result in
your immediate failure of this class (NA = 0). Never share your projects with
someone else.

Graded Skills
By working on this project, you are expected to apply your knowledge of:
1. designing a multi-Activity Android application;
2. using these widgets: TextView, EditText, Button, RecyclerView, Card, AlertDialog;
3. designing layouts for the Activities; and
4. applying the correct lifecycle for the Activities
Details start below.

Details
There are 4 Activities in this game:
1. PlayersActivity: for setting the game
2. MainActivity: playing the game itself
3. ResultActivity: a game’s result screen
4. HistoryActivity: history of games played so far.
PlayersActivity
In this Activity, players can enter their details. There are two players required for a Tic-Tac-
Toe game, so provide details for each player. Sample layout:

You may change fonts and add some images (backgrounds, etc.). For colors, you may use
default colors (e.g. Color.RED) or provide your own color.
When the player clicks the Play! button, open MainActivity.

MainActivity
This is where the game takes place. Assume that Player 1 (O) always goes first. Players
then take turns filling in the spaces with their respective mark (O or X). The first player to
be able to form three marks in a straight line (horizontally, vertically, or diagonally) is
the winner.

The layout is split into three areas:

- Two Player areas (for each player).
Show the player’s name at the top left corner of this area. There is a text centered
on her area which shows whose turn it is. When it’s her turn, change this text to
“YOUR TURN!”, otherwise change to “{Opponent’s name} turn”. To identify which
player is player O or X, show the indicator on each player’s area (you can simply
append to the player’s name or show the correct image).
Change each player’s area color with respect to their input on PlayersActivity.
- Playing area.
This area consists of 3 x 3 Buttons. You may change the background color for these
buttons or even use images for Os and Xs. When the game starts, all buttons should
have no texts/images at all.
Sample layout:

Players take turns clicking one of the available buttons. When a player does so, change
the button’s text to O or X (depending on who clicked the button) and disable the button,
then check if there is a winner. If there is, show an AlertDialog showing the winner, then go
to ResultActivity. Example:
Otherwise, the game continues with the next player. If all buttons have been clicked, then
the game is a draw. Show another AlertDialog, then go to ResultActivity. Example:

If any player presses the Back button, show an AlertDialog to confirm the player’s action.
Example:
If Keep Playing (the negative button) is clicked, nothing happens (the game resumes). If Quit
(the positive button) is clicked, then go back to PlayersActivity.

Hints:
To make your layout as tidy as possible, use guidelines with percentages. This way, your
guidelines will adapt to any screen size. For example, here’s the result when my device is
rotated:

A glimpse on blueprint view:

How to flip the TextViews for Player 2? Why not try rotating it?

To create a custom behavior when the Back button is pressed, override onBackPressed()
function on your MainActivity. Do not call super.onBackPressed() unless you want to call
the default implementation of this function (closes this Activity and returns to previous
Activity). You can also use finish() to close an Activity. See the documentation for more
information.

For the 9 buttons on the playing field, instead of coding the on click listeners on each button
(and exposing yourself to a very long, unmanaged code that may lead to bugs), use a
dedicated function, similar to creating listeners for multiple checkboxes.

ResultActivity
Show the game’s result here. The layout is similar to MainActivity, but there is a Play Again
and History button where the playing area was. The orientation of these two buttons is
towards player 1 (not flipped). Show the result on the respective player's area: if s/he wins,
show “You Win!”; if s/he loses, show “You Lose!”; if neither wins, show “It’s a draw…” on
both player fields.

Sample layout:
If they choose to play again, go back to MainActivity and reset the playing field. Then the
game resumes as usual.
If they click the History button, go to HistoryActivity.

HistoryActivity
In this Activity, show a RecyclerView consisting of cards. On each card, provide information
on the game: date and time when the game ends, both players name, and the winner. Player
colors should be reflected here as well. Here is an example of a game’s card:

If the game ends with a draw, then the WIN text should not be visible at all (no one wins
anyway).

Sample layout:
Note that there is no winner indicator when the game is a draw.

You do not need to store the history permanently to the device. When the user closes the
application, all game sessions will be deleted. The next time the user opens this app, the
history starts fresh for that session. If you want, you may save the game sessions to
SharedPreferences so all previous game sessions will be displayed on HistoryActivity, as
well as current game sessions (will be counted as creativity).

Application Lifecycle
The lifecycle is described in the following diagram. The indicates the Back button on
an Android device.
PlayersActivity should be the last Activity in the back stack. When players use the Back
button, the application should close immediately. Go to MainActivity by pressing the Play
button.

From MainActivity, players can go back to PlayersActivity by pressing the Back button.
When the game ends, the application will go to ResultActivity.

From ResultActivity, players can go back to PlayersActivity by pressing the Back button, go
to MainActivity by pressing the Play Again button, or go to HistoryActivity by pressing the
History button.

From HistoryActivity, pressing the Back button will cause the application to go back to
ResultActivity.

Hint:
Use finish() to close an Activity and destroy it from the back stack. You can even start a
new Activity then finish the current Activity.

Scoring
Follow this table to determine how many points you can get by finishing the required tasks.

Activity Task Points

PlayersActivity Spinners should contain preset colors 5

Send correct data to MainActivity 5

MainActivity Receive data from PlayersActivity 5

Display the correct name and color for each player 10

 Correct implementation of Tic-Tac-Toe buttons 10

Detect winner 10

Send correct data to ResultActivity 5

ResultActivity Receive data from MainActivity 5

Show the winner 5

Play Again button works as intended 5

History button works as intended 5

HistoryActivity Create the correct layout for cards 5

Correct implementation of custom adapter 10

Application Correct implementation of lifecycle 5

For the remaining 10 points, use your creativity as long as it’s not graded for the final exam.
This may include:
- Database
- Implicit intent
Examples of creativity:
- (10 points) There is a time limit for each player, e.g. 30 seconds. Players must put
their mark on the playing field before time ends. Otherwise, their turn is skipped.
Display the remaining time on the respective player’s area (you may use progress
bar or simply a TextView).
- (5 points) At PlayersActivity, once a player selects a color, her card changes color
according to the selected color. For now, ignore the readability of any texts.
- (5 points) Can you show the game history in reverse chronological order (i.e. the last
game played is shown at the topmost card)?
- (5 points) Using classes to store game data, e.g. player and game session. Extra 5
points will be rewarded if you can use these classes as extras for your Intents.

Submission
ZIP your whole Android Project (leave the ZIP name as it is), then submit the ZIP file to
Classroom before the deadline. Late submissions will not be entertained, so please plan
accordingly (anticipate all possible hindrances, e.g. slow Internet connection, PC/laptop
crashes, power failures, etc.). Late submission will be penalized by 1 point per minute,
up to 30 points. You will be denied to demonstrate your project if you are 6 hours late from
the submission deadline.

Project Demo
More details will be announced for the project demo. Expect it to be held on the first Friday
of your mid-exam week.