How To Make An Android App

Have you always wanted to make an Android app but got lost in the complexity of the Android Studio or the technical jargon used in the development process? Don't worry, you have come to the right place. We are going to help you get started with your first Android app.

The app that we are going to make will be a simple multi-screen app utilizing the concept of activities, where clicking on a button will take you to the next screen and vice versa. This simple app will serve as a good introduction to Android Studio and to the concepts of activities.

What is Android Studio?

Android Studio is the official Integrated Development Environment (IDE) for Android application development. It is a robust tool for developing high-quality Android applications. It includes all of the necessary tools for developing Android apps and also for code development, testing, and deployment. Android Studio provides all of the tools needed for developers to create an Android app.

It is a popular IDE for producing high-quality Android applications, suitable for both beginners and advanced developers.

How to make an Android App?

The Android app that we are going to make is going to be a simple, multi-screen app that will introduce you to the concept of activities. You won't need much coding to make this app, and if you follow the instructions, the app could be made very easily in an hour. So let's see the steps:

Step 1: Create a New Project

1. Open Android Studio.
2. Click on "Start a new Android Studio project".
3. In the "Select a template" window, choose "Empty Views Activity".
4. Give your app a name - "Demo".
5. Click "Next".
6. Configure the project details (package name, etc.) and click "Finish".

Step 2: Design First Screen Layout

In the activity_main.xml file let us design the layout for the first screen.

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    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/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="First Screen"
        android:textColor="@color/black"
        android:textStyle="bold"
        android:textSize="32sp" />

    <Button
        android:id="@+id/btnSecondActivity"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="32dp"
        android:text="Second Activity" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World"
        android:textSize="24sp" />

</LinearLayout>

This XML code defines two TextView and a Button for the first screen layout in an Android app with the following specifications:

• XML code for an Android layout is provided.
• Includes a large TextView displaying "First Screen" with specific text attributes.r.
• Features a button labeled "Second Activity" with defined layout constraints.
• Contains another TextView displaying "Hello World," positioned below the first TextView and above the button.
• Layout constraints ensure proper alignment of elements relative to the parent and each other.

Step 3: Design Second Screen Layout

Create a new activity with the name SecondActivity. The below image shows how to create a new activity.

Then navigate to the XML layout file by navigating to app > res > layout > activity_second.xml and design the layout for the second screen. Add a TextView above the button, similar to the first screen layout.

activity_second.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".SecondActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Second Screen"
        android:textColor="@color/black"
        android:textSize="32sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/btnFirstActivity"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="32dp"
        android:text="First Activity"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />
</LinearLayout>

This XML code defines a Button and a TextView for the second screen layout in an Android app. The code specifies:

• TextView displays "Second Screen" with black text and a 40sp size.
• TextView and Button are centered within their parent layout.
• Both views adjust their dimensions to fit their content.
• The button labeled "First Activity" has a bottom margin of 16 dp.
• Views are constrained to the parent layout for proper alignment on the screen.

Step 4: Implement First Activity

In MainActivity.kt, we implement the functionality for the first screen. In the first screen we are going to create the functionality that is when the user clicks the button he is taken to the second screen. Let us see the code for it in the file named MainActivity.kt.

MainActivity.kt:

package org.geeksforgeeks.demo

import android.content.Intent
import android.os.Bundle
import android.widget.Button
import androidx.activity.enableEdgeToEdge
import androidx.appcompat.app.AppCompatActivity
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContentView(R.layout.activity_main)
        ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main)) { v, insets ->
            val systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars())
            v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
            insets
        }

        val btnSecondActivity=findViewById<Button>(R.id.btnSecondActivity)
        btnSecondActivity.setOnClickListener{
            val intent= Intent(this,SecondActivity::class.java)
            startActivity(intent)
        }
    }
}

In MainActivity.kt, we implement the functionality for the first screen. We get a reference to the button firstScreenButton using its ID with findViewById(). Then, we use a setOnClickListener to this button. When the button is clicked, the code inside the setOnClickListener block gets executed. Here, we create an intent to navigate to the second activity (SecondActivity) and start it using startActivity().

Step 5: Implement Second Activity

Now we are going create the file named SecondActivity.kt where we implement the functionality for the second screen. Similar to the first activity, when the user clicks the button he is taken to the first screen. Let us see the code for it in the file named SecondActivity.kt.

SecondActivity.kt:

package org.geeksforgeeks.demo

import android.os.Bundle
import android.widget.Button
import androidx.activity.enableEdgeToEdge
import androidx.appcompat.app.AppCompatActivity
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat

class SecondActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContentView(R.layout.activity_second)
        ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main)) { v, insets ->
            val systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars())
            v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
            insets
        }

        val btnFirstActivity=findViewById<Button>(R.id.btnFirstActivity);
        btnFirstActivity.setOnClickListener{
            finish()
        }
    }
}

In the above file, SecondActivity.kt, we are coding the behavior for the second screen of our app. Initially, we set the screen's layout using setContentView() to display the UI elements defined in activity_second.xml. Then, we access the secondScreenButton using findViewById() and attach an OnClickListener. When this button is clicked, we call finish() function. This function destroys the current activity navigates back to the screen on the top of the stack. This setup enables users to switch between screens by tapping the designated button on the second screen.

Check Out: Introduction to Activities in Android

When you successfully implement the above code, it will allow the app to have two screens, each with its own functionality and the ability to navigate between them. When the user clicks the button on the first screen, it takes them to the second screen, and clicking the button on the second screen takes them back to the first screen.

Output:

Also Read

• Android App Development Fundamentals for Beginners
• How to Create a Workout Android App with Kotlin?
• A Complete Guide to Learn Android Studio For App Development

Conclusion

We introduced you to how you can easily create a multi-screen app in Android Studio, teaching you the basics of activities. We have broken down the process into easy steps so that developers can quickly learn about basic ideas like activities, designing layouts, and moving around in Android Studio. By following these steps, even those with limited coding experience can build a functional app within an hour. The screens have basic text and a button to interconnect with the other screen, using which users can easily transition between different parts of the app. This simple Android app will serve as an accessible introduction to Android app development, solidifying the basics for beginners to create more complex applications.