Tic-Tac-Toe Android App | Android Studio | Full Project With Source Code | Download .apk File on Phone

In this Post, I have Managed to Show you how i Made a Tic-Tac-Toe Android App Using Android Studio.

It is a little bit comlex, so if you are not a Android Developer then You Should Download the .apk File of this App to Use this in your Android Device

Want to Install It without Android Studio In your Phone, Download from the link :-

Download Tic-Tac-Toe.apk File for Android

For Those, who want to Build OwnSelf :-

I have Used Some Images in this Project, download them and Paste in Your Project Drawable Folder and Drawable x24 Folder

Download Related Images

[MainActivity.java] Source Code :-

package com.macstockofficial.project2;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    private Button button;

    public void exit_game(View view) {
        Intent homeIntent = new Intent(Intent.ACTION_MAIN);
        homeIntent.addCategory( Intent.CATEGORY_HOME );
        homeIntent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
        startActivity(homeIntent);
    }

    public void startbtn(View view) {
        Toast.makeText(this, "Starting Tic-Tac-Toe By Kunal Sir, Wait a Sec...", Toast.LENGTH_SHORT).show();
        openActivity2();
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    public void openActivity2() {
        Intent intent = new Intent(this, SecondActivity.class);
        startActivity(intent);
    }
}
    

[SecondActivity.java] Source Code :-

package com.macstockofficial.project2;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

public class SecondActivity extends AppCompatActivity {
// Player Representation
    // 0 = X
    // 1 = O
    // 2 = Null

    public void backftn(View view) {
        Toast.makeText(this, "Moving to HomePage Sir...", Toast.LENGTH_SHORT).show();
        openActivity8();
    }

    public void openActivity8() {
        Intent intent = new Intent(this, MainActivity.class);
        startActivity(intent);
    }

    public void restart(View view) {
        reset(view);
    }

    boolean gameActive = true;
    int activeplayer = 0;
    int[] gamestate = {2, 2, 2, 2, 2, 2, 2, 2, 2};
    int[][] winPositions = {{0,1,2}, {3,4,5}, {6,7,8},
            {0,3,6}, {1,4,7}, {2,5,8},
            {0,4,8}, {2,4,6}};

    public void tapthebtn(View view) {
        ImageView img = (ImageView) view;
        int tappedImage = Integer.parseInt(img.getTag().toString());
        if (gameActive!=true) {
            reset(view);
        }
        if (gamestate[tappedImage] == 2 && gameActive==true) {
            gamestate[tappedImage] = activeplayer;
            img.setTranslationY(-1000f);
            if (activeplayer == 0) {
                img.setImageResource(R.drawable.x);
                activeplayer = 1;
                TextView status = findViewById(R.id.status);
                status.setText("Its O's Turn | Tap to Play!");
            } else {
                img.setImageResource(R.drawable.o);
                activeplayer = 0;
                TextView status = findViewById(R.id.status);
                status.setText("Its X's Turn | Tap to Play!");
            }
            img.animate().translationYBy(1000f).setDuration(200);
        }
        // Check if Player Has Won
        for(int[] winPosition: winPositions) {
            if (gamestate[winPosition[0]] == gamestate[winPosition[1]] &&
                    gamestate[winPosition[1]] == gamestate[winPosition[2]] &&
                    gamestate[winPosition[0]]!=2) {
                String winnerStr;
                gameActive = false;
                if (gamestate[winPosition[0]] == 0) {
                    winnerStr = "X Has Won the Game";
                }
                else{
                    winnerStr = "O Has Won the Game";
                }
                TextView status = findViewById(R.id.status);
                status.setText(winnerStr);
            }
        }
    }

    public void reset(View view) {
        gameActive = true;
        activeplayer = 0;
        for(int i=0; i<gamestate.length; i++) {
            gamestate[i] = 2;
        }
        ((ImageView)findViewById(R.id.imageView0)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView1)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView2)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView3)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView4)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView5)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView6)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView7)).setImageResource(0);
        ((ImageView)findViewById(R.id.imageView8)).setImageResource(0);

        TextView status = findViewById(R.id.status);
        status.setText("Its X's Turn | Tap to Play!");
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);
    }
}
    

Layout Source Codes

[activity_main.xml] Source Code :-

    <?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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="115dp"
        android:layout_height="113dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:contentDescription="@string/TODO"
        app:layout_constraintBottom_toTopOf="@+id/textView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.797"
        app:srcCompat="@android:drawable/ic_menu_edit" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/sub_title"
        android:textColor="#CC1D1D"
        android:textSize="24sp"
        app:fontFamily="casual"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.496"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.466"
        tools:fontFamily="casual" />

    <Button
        android:id="@+id/button"
        style="@style/Widget.AppCompat.Button.Colored"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="startbtn"
        android:text="@string/start_btn"
        android:textAppearance="@style/TextAppearance.AppCompat.Body2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView"
        app:layout_constraintVertical_bias="0.114" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/creator_name"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="14sp"
        app:fontFamily="serif"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button"
        app:layout_constraintVertical_bias="0.462"
        tools:fontFamily="serif" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/description"
        android:textSize="18sp"
        app:fontFamily="cursive"
        app:layout_constraintBottom_toTopOf="@+id/textView2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.481"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView"
        app:layout_constraintVertical_bias="0.622"
        tools:fontFamily="cursive" />

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="sans-serif-condensed"
        android:text="@string/Information"
        app:layout_constraintBottom_toTopOf="@+id/imageView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.726"
        tools:fontFamily="sans-serif-condensed" />

    <Button
        android:id="@+id/button4"
        style="@style/Widget.AppCompat.Button.Colored"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="exit_game"
        android:text="@string/close_btn"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView2"
        app:layout_constraintVertical_bias="0.382" />

</androidx.constraintlayout.widget.ConstraintLayout>
    

[activity_second.xml] Source Code :-

    <?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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".SecondActivity">

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/content_description"
        android:text="@string/TextView"
        android:textColor="#D53E3E"
        android:textSize="24sp"
        app:fontFamily="cursive"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.38"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.071"
        tools:fontFamily="cursive" />

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="519dp"
        android:layout_height="311dp"
        android:contentDescription="@string/content_description"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.678"
        app:srcCompat="@drawable/grid" />

    <LinearLayout
        android:id="@+id/linearLayout"
        android:layout_width="0dp"
        android:layout_height="260dp"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="@+id/imageView"
        app:layout_constraintEnd_toEndOf="@+id/imageView"
        app:layout_constraintStart_toStartOf="@+id/imageView"
        app:layout_constraintTop_toTopOf="@+id/imageView">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/imageView0"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="52pt"
                android:layout_marginTop="15sp"
                android:layout_marginRight="1pt"
                android:layout_marginBottom="15sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="5sp"
                android:tag="0" />

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginTop="5sp"
                android:layout_marginBottom="5sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="18sp"
                android:tag="1"
                tools:paddingBottom="5sp" />

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="5pt"
                android:layout_marginTop="15sp"
                android:layout_marginRight="50pt"
                android:layout_marginBottom="15sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:paddingRight="15sp"
                android:tag="2" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/imageView3"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="52pt"
                android:layout_marginTop="15sp"
                android:layout_marginBottom="15sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="5sp"
                android:tag="3" />

            <ImageView
                android:id="@+id/imageView4"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginTop="5sp"
                android:layout_marginBottom="5sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="18sp"
                android:paddingBottom="5sp"
                android:tag="4" />

            <ImageView
                android:id="@+id/imageView5"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="1pt"
                android:layout_marginTop="15sp"
                android:layout_marginRight="52pt"
                android:layout_marginBottom="10sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="5sp"
                android:tag="5" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/imageView6"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="50pt"
                android:layout_marginTop="15sp"
                android:layout_marginRight="1pt"
                android:layout_marginBottom="15sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="5sp"
                android:tag="6" />

            <ImageView
                android:id="@+id/imageView7"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginTop="5sp"
                android:layout_marginBottom="5sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="18sp"
                android:paddingBottom="5sp"
                android:tag="7" />

            <ImageView
                android:id="@+id/imageView8"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="1pt"
                android:layout_marginTop="15sp"
                android:layout_marginRight="52pt"
                android:layout_marginBottom="15sp"
                android:layout_weight="1"
                android:onClick="tapthebtn"
                android:padding="5sp"
                android:tag="8" />
        </LinearLayout>

    </LinearLayout>

    <TextView
        android:id="@+id/status"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="sans-serif-black"
        android:text="Its X's Turn | Tap to Play!"
        android:textColor="#FF5722"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView"
        app:layout_constraintVertical_bias="0.517"
        tools:fontFamily="sans-serif-black" />

    <Button
        android:id="@+id/button2"
        style="@style/Widget.AppCompat.Button.Colored"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="restart"
        android:text="@string/restart"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/button3"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.171" />

    <Button
        android:id="@+id/button3"
        style="@style/Widget.AppCompat.Button.Colored"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="backftn"
        android:text="@string/back_btn"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.193"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.171" />

</androidx.constraintlayout.widget.ConstraintLayout>
    

Hope You Will Like the Project