How to Make your First App in Java

Are you a budding developer who knows the basics of Java and wants to make their first app using Android Studio? With PlayStore currently hosting 2.89 million Android apps and growing every minute, it is a great decision to learn and eventually master Android apps development.

Get Started With Android Studio

To make an android app you need an Integrated Development Environment (IDE) and Android Studio is the official IDE for creating Android Apps.

Install Android Studio

To install and get started with Android Studio, check out my post on How to Use Android Studio. 

• 
  Android Studio
  How to Use Android Studio?
  Arooha Arif

Understand Android Studio

Now that Android Studio is ready to use, you can start by creating your first project. Give your project a name and give it a unique package name too. Then, choose the minimum SDK you want to support with your app.

As it says beneath the Minimum SDK bar, with each API level the features that you can use in your app increase. However, your app will run on fewer devices. The Create New Project dialog includes an estimator for the percentage of devices your app will run on.

You will then be asked to select the layout of your app. Let's choose Empty Activity so that we have a lot of room to experiment and learn.

Once you give your activity a name—let’s name it MainActivty for this tutorial—Android Studio will take a moment to create your first project. Now, you have in front of you the main code editor where you will be able to write the code for your app. 

The big section on your right is the Editor Window where you write the code of your app. On your left and below that are the tool windows. These let you easily navigate and work on a specific task of your project, for example browsing files or viewing debugging information.

The two bars that you see on top are the Toolbar, which allows you to perform a common tasks in Android Studio, like building, running and debugging apps, and the Navigation Bar, which lets you navigate through the project and the currently opened class file.

Take a few minutes to study the screen. It will make more sense once you start making an Android app with Java.

Now that you understand the basics of Android Studio, it is time to finally make your first Java Android app.

Java Android App Development

Now, if you look at the left side of your screen, you will see two folders. One of which holds your app’s code and is named after the title of your project. In this case, it would be MyFirstJavaApp. The other folder is of Gradle Scripts which is a free tool Android Studio uses to turn your app’s code into .apk files.

First, you click to open the MyFirstJavaApp folder and access the code of your app. Then, you click on the app folder. This has three folders which hold different elements of your project: manifests, java, and res.

To start, select res, which contains a file called activity_main.xml. Clicking on this file will allow you to access the layout of your main Activity. On screen, it will look like this:

The empty Activity that we chose has a ConstraintLayout which is the root of the hierarchy as you can see on the screen. It has just one element TextView that says Hello World. The constraint layout is a container for the components of your Activity and helps keep them spatially organized. 

You have two basic ways to make changes to your Activity layout:

1. Edit the layout .xml file with the GUI (graphical user interface). You can drag and drop any elements of your choice to create your app. This is the default option and is accessed with the Design tab at the bottom of the window.
2. You can also edit the layout .xml file directly by clicking on the Text tab. Here, rather than dragging and dropping the elements, you write the layout code for your app from scratch.

The first method is great for you if you do not have much experience with writing code and your focus is learning to make a Java app using Android Studio. However, if you love to write code and want to get better at writing apps, the second method would be your way to go.

Making First Changes to your App

Now you have myriad of options open. So, let’s experiment with changing the TextView a little. Open the code editor to see the code of TextView element which is going to look like this:

android:text="Hello World!"

Let’s change it to:

android:text="Envato Tuts+"

You can also change the text’s color and the font style but I am not choosing to do that here. However, I have put the text in bold. Let’s run it on the AVD or the device to see how it looks.

Here is the code for these changes:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="https://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">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Envato tuts+"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Now, from the Design tab, let’s drag and drop a button to your app and change its text to Subscribe.

Here's the code this generates:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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">

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Envato tuts+"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.501"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.332" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="48dp"
        android:text="Subscribe"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.501"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView2" />

</android.support.constraint.ConstraintLayout>

You can add various buttons and text view to your app and allocate them a space using the constraints which you can access in the Design view.

Making your App Interactive

Till this point, our app has a button but it does not do anything when clicked by the user. To make it interactive, we have to assign an action to it which will take place when a user taps on it. This is where we'll finally start writing some Java code.

Let’s say you want to tell users that they have successfully subscribed to the Envato Tuts+ newsletter. So, when the users click on Subscribe, you want them to see, Welcome to the Envato Tuts+ Newsletter.

Here’s how you will write the code:

public class MainActivity extends AppCompatActivity {
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button = findViewById(R.id.button);
        
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "Welcome to Envato tuts+ Newsletter", Toast.LENGTH_SHORT).show();
            }
        });
        
    }
}

And this is how it will look in the AVD:

Remember that each button that you add to your app has a specific id to help you refer to it from Java code.

Conclusion

In this tutorial, we looked at how you can make a simple app with Java. Android Studio really is remarkable as it has simplified Java app development. However, to master making Android apps, you need patience and practice.