HI EVERYONE
Today we make a basic tic tac toe game. It's easy for us 💪
If you follow these steps, it is easy for you. Firstly, open Android Studio. Next, create a project. Then, edit the main layout. After that, write codes. Finally, run the emulator. Let's do it.
You create three gradients and a gradient list. Next, create a font directory. Then, add a font.
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape> <gradient android:startColor="#00FFEB" android:endColor="#073ABB" android:angle="135" /> </shape> </item> </selector>
 |
| for example You create a gradient list. |
<?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/background_1" android:duration="5000"></item> <item android:drawable="@drawable/background_2" android:duration="5000"></item> <item android:drawable="@drawable/background_3" android:duration="5000"></item> </animation-list>
 |
| These look in android studio. |
Now you can edit the main layout, Then write codes.
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/mainLayout" android:background="@drawable/gradient_list" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <TextView android:id="@+id/playerOneTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="25dp" android:layout_marginTop="25dp" android:text="PLAYER ONE" android:textColor="#fff" android:textSize="24sp" app:fontFamily="@font/wrongdelivery" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> <TextView android:id="@+id/playerOneScoreTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:text="0" android:textColor="#fff" android:textSize="24sp" app:fontFamily="@font/wrongdelivery" app:layout_constraintEnd_toEndOf="@+id/playerOneTextView" app:layout_constraintStart_toStartOf="@+id/playerOneTextView" app:layout_constraintTop_toBottomOf="@+id/playerOneTextView" /> <TextView android:id="@+id/playerTwoTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="25dp" android:layout_marginEnd="25dp" android:text="PLAYER TWO" android:textColor="#fff" android:textSize="24sp" app:fontFamily="@font/wrongdelivery" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" /> <TextView android:id="@+id/playerTwoScoreTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:text="0" android:textColor="#fff" android:textSize="24sp" app:fontFamily="@font/wrongdelivery" app:layout_constraintEnd_toEndOf="@+id/playerTwoTextView" app:layout_constraintStart_toStartOf="@+id/playerTwoTextView" app:layout_constraintTop_toBottomOf="@+id/playerTwoTextView" /> <TextView android:id="@+id/playerStatusTextView" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginTop="15dp" android:gravity="center" android:text="" android:textColor="#fff" android:textSize="24sp" app:fontFamily="@font/wrongdelivery" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/playerOneScoreTextView" /> <androidx.constraintlayout.widget.ConstraintLayout android:id="@+id/buttonsLayout" android:layout_width="match_parent" android:layout_height="0dp" android:layout_marginTop="25dp" android:layout_marginBottom="25dp" app:layout_constraintBottom_toTopOf="@+id/resetButton" app:layout_constraintTop_toBottomOf="@+id/playerStatusTextView"> <Button app:fontFamily="@font/wrongdelivery" android:id="@+id/tictactoeButton0" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".05" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".05" app:layout_constraintWidth_percent=".30" /> <Button app:fontFamily="@font/wrongdelivery" android:id="@+id/tictactoeButton1" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".5" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".05" app:layout_constraintWidth_percent=".30" /> <Button app:fontFamily="@font/wrongdelivery" android:id="@+id/tictactoeButton2" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".95" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".05" app:layout_constraintWidth_percent=".30" /> <Button app:fontFamily="@font/wrongdelivery" android:id="@+id/tictactoeButton3" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".05" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".4" app:layout_constraintWidth_percent=".30" /> <Button android:id="@+id/tictactoeButton4" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:fontFamily="@font/wrongdelivery" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".5" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".4" app:layout_constraintWidth_percent=".30" /> <Button android:id="@+id/tictactoeButton5" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:fontFamily="@font/wrongdelivery" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".95" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".4" app:layout_constraintWidth_percent=".30" /> <Button android:id="@+id/tictactoeButton6" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:fontFamily="@font/wrongdelivery" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".05" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".75" app:layout_constraintWidth_percent=".30" /> <Button android:id="@+id/tictactoeButton7" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:fontFamily="@font/wrongdelivery" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".5" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".75" app:layout_constraintWidth_percent=".30" /> <Button android:id="@+id/tictactoeButton8" android:layout_width="0dp" android:layout_height="0dp" android:text="" android:textSize="64sp" app:fontFamily="@font/wrongdelivery" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHeight_percent=".25" app:layout_constraintHorizontal_bias=".95" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias=".75" app:layout_constraintWidth_percent=".30" /> </androidx.constraintlayout.widget.ConstraintLayout> <Button android:id="@+id/resetButton" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="75dp" android:layout_marginEnd="75dp" android:layout_marginBottom="25dp" android:text="Reset Game" app:fontFamily="@font/wrongdelivery" app:backgroundTint="#252020" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
 |
| It looks pretty. |
package com.prometrx.tictactoe; import androidx.appcompat.app.AppCompatActivity; import androidx.constraintlayout.widget.ConstraintLayout; import androidx.core.content.res.ResourcesCompat; import android.graphics.Color; import android.graphics.drawable.AnimationDrawable; import android.os.Bundle; import android.util.Log; import android.view.View; import android.widget.Button; import android.widget.TextView; import android.widget.Toast; public class MainActivity extends AppCompatActivity implements View.OnClickListener{ // implements for buttons onclick methods. private TextView playerOneScoreTextView, playerTwoScoreTextView, playerStatus; private Button [] buttons = new Button[9]; private Button resetGameButton; private int playerOneScoreCount, playerTwoScoreCount, rountCount; private boolean activePlayer; //p1 => 0 //p2 => 1 //empty => 2 private int[] gameState = {2, 2, 2, 2, 2, 2, 2, 2, 2}; private int[][] winningPosition = { {0, 1, 2}, {3, 4, 5}, {6, 7, 8}, //rows {0, 3, 6}, {1, 4, 7}, {2, 5, 8}, //columns {0, 4, 8}, {2, 4, 6} //cross }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); ConstraintLayout constraintLayout = findViewById(R.id.mainLayout); // AnimationDrawable animationDrawable = (AnimationDrawable) constraintLayout.getBackground(); // animationDrawable.setEnterFadeDuration(2500); // These lines are for live background. animationDrawable.setExitFadeDuration(2500); // animationDrawable.start(); // } private void init() { playerOneScoreTextView = findViewById(R.id.playerOneScoreTextView); playerTwoScoreTextView = findViewById(R.id.playerTwoScoreTextView); playerStatus = findViewById(R.id.playerStatusTextView); resetGameButton = findViewById(R.id.resetButton); for (int i = 0; i<buttons.length; i++) { int resourceId = getResources().getIdentifier("tictactoeButton"+i, "id", getPackageName()); //This line get button id. buttons[i] = findViewById(resourceId); // initialize buttons[i].setOnClickListener(this); } rountCount = 0; playerOneScoreCount = 0; playerTwoScoreCount = 0; activePlayer = true; } @Override public void onClick(View view) { Button button = ((Button) view);//Casting if(!button.getText().toString().equals("")) { return; } String buttonId= button.getResources().getResourceEntryName(button.getId()); int gameStatePointer = Integer.parseInt(buttonId.substring(buttonId.length()-1, buttonId.length())); if(activePlayer) { button.setText("X"); button.setTextColor(Color.parseColor("#D81B60")); gameState[gameStatePointer] = 0; } else{ button.setText("O"); button.setTextColor(Color.parseColor("#43A047")); gameState[gameStatePointer] = 1; } rountCount++; if(winning()) { if(activePlayer) { playerOneScoreCount++; updateScoreCount(); Toast.makeText(MainActivity.this, "Player One Won", Toast.LENGTH_LONG).show(); playAgain(); } else{ playerTwoScoreCount++; updateScoreCount(); Toast.makeText(MainActivity.this, "Player Two Won", Toast.LENGTH_LONG).show(); playAgain(); } } else if(rountCount == 9) { Toast.makeText(MainActivity.this, "No Winner", Toast.LENGTH_LONG).show(); playAgain(); } else{ activePlayer = !activePlayer; } if(playerOneScoreCount > playerTwoScoreCount) { playerStatus.setText("PLAYER ONE IS WINNING"); } else if(playerOneScoreCount < playerTwoScoreCount) { playerStatus.setText("PLAYER TWO IS WINNING"); }else{ playerStatus.setText("EQUALTY"); } resetGameButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { playAgain(); playerOneScoreCount = 0; playerTwoScoreCount = 0; playerStatus.setText(""); updateScoreCount(); } }); } private boolean winning() { for(int [] winArray : winningPosition) { if (gameState[winArray[0]] == gameState[winArray[1]] && gameState[winArray[1]] == gameState[winArray[2]] && gameState[winArray[0]] != 2) return true; } return false; } private void updateScoreCount() { playerOneScoreTextView.setText(playerOneScoreCount + ""); playerTwoScoreTextView.setText(playerTwoScoreCount + ""); } private void playAgain() { rountCount = 0; activePlayer = true; for(int i = 0; i<gameState.length; i++) { gameState[i] = 2; buttons[i].setText(""); } } }
As you can see, it's easy for us. Let's watch gameplay. :)
GOODBYE EVERYONE
If you want to use project files, click this.
Resources:
https://www.dafont.com/wrong-delivery.font
https://www.youtube.com/watch?v=CCQTD7ptYqY
0 Comments