How To Create Tic-Tac-Toe In Android Studio in easy steps

How To Create Tic-Tac-Toe In Android Studio in easy steps 1
Tic-Tac-Toe Game

In this tutorial, we will develop a super cool Tic-Tac-Toe app for android that is impossible to beat. This game would be impossible to beat because we are going to use the Artificial Intelligence.

Creating Tic-Tac-Toe Game in Android Studio

  1. Create a new project by going to File ⇒ New Android Project. and fill required details.
  2. Implement your main Activity class from TicTacToe.OnInitListener
  3. Now add following code your class
How To Create Tic-Tac-Toe In Android Studio in easy steps 2

Tic-Tac-Toe Game




Creating Game UI:

First you need some drawable resources to make the UI as you see below. You can get the drawables from this link.
After downloading the drawables paste them inside the drawable folder of your project.
Now define the following colors in your colors.xml file.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3991aa</color>
    <color name="colorPrimaryDark">#184b5a</color>
    <color name="colorBackground">#26697c</color>
    <color name="colorAccent">#0A3664</color>

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="3">
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:weightSum="3">
      <Button
            android:id="@+id/btn1"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" 
<Butto
             android:id="@+id/btn2"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp”
  <Button
            android:id="@+id/btn3"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1”
   android:textSize="40sp" 
</LinearLayou>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:weightSum="3">
  <Button
            android:id="@+id/btn4"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" />
   <Button
            android:id="@+id/btn5"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" />
 <Button
            android:id="@+id/btn6"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" /
   </LinearLayout>
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:weightSum="3">
<Button
            android:id="@+id/btn7"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" />
<Button
            android:id="@+id/btn8"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" />
<Button
            android:id="@+id/btn9"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textSize="40sp" 
 </LinearLayout>
<Button
        android:id="@+id/reset"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="RESET"
        android:textSize="25sp" />
</LinearLayout>

MainActivity.java:

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
int chance=0;
    Button btn1,btn2,btn3,btn4,btn5,btn6,btn7,btn8,btn9,reset;
protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main)
 btn1=(Button)findViewById(R.id.btn1);
 btn2=(Button)findViewById(R.id.btn2);
 btn3=(Button)findViewById(R.id.btn3);
 btn4=(Button)findViewById(R.id.btn4);
 btn5=(Button)findViewById(R.id.btn5);
 btn6=(Button)findViewById(R.id.btn6);
 btn7=(Button)findViewById(R.id.btn7);
 btn8=(Button)findViewById(R.id.btn8);
 btn9=(Button)findViewById(R.id.btn9);
    reset=(Button)findViewById(R.id.reset);

        btn1.setOnClickListener(this);
        btn2.setOnClickListener(this);
        btn3.setOnClickListener(this);
        btn4.setOnClickListener(this);
        btn5.setOnClickListener(this);
        btn6.setOnClickListener(this);
        btn7.setOnClickListener(this);
        btn8.setOnClickListener(this);
        btn9.setOnClickListener(this);
        reset.setOnClickListener(this);
 }
    public void onClick(View view) {
    switch(view.getId())
 case R.id.btn1.
              if(btn1.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn1.setText("O");
  result()
                    }
                    else{
                        chance=0;
                        btn1.setText("X");
                        result();
}
}
break;
            case R.id.btn2:
                if(btn2.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn2.setText("O");
                        result();
                    }
                    else{
                        chance=0;
                        btn2.setText("X");
                        result();
                    }
                }
                break;
            case R.id.btn3:
                if(btn3.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn3.setText("O");
                        result();
                    }
                    else{
                        chance=0;
                        btn3.setText("X");
                        result();
}
}
                break;
            case R.id.btn4:
                if(btn4.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn4.setText("O");
                        result();
}
                    else{
                        chance=0;
                        btn4.setText("X");
                        result();
}
}
                break;
            case R.id.btn5:
                if(btn5.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn5.setText("O");
                        result();
}
                    else{
                        chance=0;
                        btn5.setText("X");
                        result();
}
}
                break;
            case R.id.btn6:
                if(btn6.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn6.setText("O");
                        result();}
                    else{
                        chance=0;
                        btn6.setText("X");
                        result();
}
}
                break;
            case R.id.btn7:
                if(btn7.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn7.setText("O");
                        result();
}
                    else{
                        chance=0;
                        btn7.setText("X");
                        result();
}
}
                break;
            case R.id.btn8:
                if(btn8.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn8.setText("O");
                        result();
}
                   else{
                        chance=0;
                        btn8.setText("X");
                        result();
}
}
                break;
            case R.id.btn9:
                if(btn9.getText().toString().equals("")){
                    if(chance==0){
                        chance=1;
                        btn9.setText("O");
                        result();
}
                   else{
                        chance=0;
                        btn9.setText("X");
                        result();
}
}
  break;
                case R.id.reset:
                btn1.setText("");
                btn2.setText("");
                btn3.setText("");
                btn4.setText("");
                btn5.setText("");
                btn6.setText("");
                btn7.setText("");
                btn8.setText("");
                btn9.setText("");
}
}
 public void result(){
        if(btn1.getText().toString().equals("X") && btn2.getText().toString().equals("X") && btn3.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
        reset.callOnClick();
}
     else if(btn4.getText().toString().equals("X") && btn5.getText().toString().equals("X") && btn6.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
         else if(btn7.getText().toString().equals("X") && btn8.getText().toString().equals("X") && btn9.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
          else if(btn1.getText().toString().equals("O") && btn2.getText().toString().equals("O") && btn3.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
         else if(btn4.getText().toString().equals("O") && btn5.getText().toString().equals("O") && btn6.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
          else if(btn7.getText().toString().equals("O") && btn8.getText().toString().equals("O") && btn9.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
          else  if(btn1.getText().toString().equals("X") && btn4.getText().toString().equals("X") && btn7.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
          else if(btn2.getText().toString().equals("X") && btn5.getText().toString().equals("X") && btn8.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
            else if(btn3.getText().toString().equals("X") && btn6.getText().toString().equals("X") && btn9.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
           else if(btn1.getText().toString().equals("O") && btn4.getText().toString().equals("O") && btn7.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
        else if(btn2.getText().toString().equals("O") && btn5.getText().toString().equals("O") && btn8.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
           else if(btn3.getText().toString().equals("O") && btn6.getText().toString().equals("O") && btn9.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
        else if(btn1.getText().toString().equals("X") && btn5.getText().toString().equals("X") && btn9.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick()
}
 else if(btn3.getText().toString().equals("X") && btn5.getText().toString().equals("X") && btn7.getText().toString().equals("X")){

            Toast.makeText(this, "Player X wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
         else if(btn1.getText().toString().equals("O") && btn5.getText().toString().equals("O") && btn9.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
   }
          else if(btn3.getText().toString().equals("O") && btn5.getText().toString().equals("O") && btn7.getText().toString().equals("O")){

            Toast.makeText(this, "Player O wins", Toast.LENGTH_SHORT).show();
            reset.callOnClick();
}
}
}

Final Words

If you use the above code and program it on your Android Studio, you would be able to develop and run your own Tic-Tac-Toe Game for android.If you have any queries or suggestions, do let us know in the comments and we would be there to help you out in your queries.

We Recommend

Don't Miss Out!

Get the very best of Android Hire in your inbox. News, How To,  Apps and games & Tutorials.