How To Build A Quote Of The Day Android App - Hive Programmers

Greetings to my favorite Science community online, StemSocial.

It's @skyehi and I've got one question for you;

• Have you ever read a quote online and gotten so motivated that it changed your life for the better.

Quotes are really great sources of advice and having an App that serves its users by delivering quotes on a daily basis is a great and convenient way to stay motivated and get a lot of good advice.

This is why I thought it necessary to include a quote of the day App to my series on Android App Development Tutorials for beginners.

I hope you're ready for this episode guys, let's start today's work

Original Image Source by Kidaha from Pixabay

Creating A New Android Studio Project

To build our Android App, we have to start by creating a new Android Studio Project.

For the newcomers to Android App development, you need to ensure that Android studio IDE and Java JDK are both properly installed on your PC.

• If you're having issues with installing the softwares, please let me know in the comments

So guys when all necessary softwares are successfully installed, go ahead and open Android Studio and click on "Create a new Android Project"

Make sure to choose Empty Activity as the template of the App project. After doing that, click on the next button and set both the App name and package name of your App.

Also ensure that Java is the selected programming language for your project and not Kotlin.

When you're through with the project configuration, click on the finish button and wait for Android Studio to prepare your new Android App Project Space.

Designing Our App User Interface

After your new Android project is created, the first thing we're going to work on is the user interface or frontend design.

I've seen a lot of app projects that start out with backend code before the user interface. That's also a great strategy but that's usually for more advanced codes that have so much work to be done in backend.

For our basic and simple daily quotes App, what we need is a TextView to display the quotes and a Button the user can press to see the next quote displayed.

There can be a whole lot of additional features like a timer to change the quote and a notification feature that will display the next quote in the notification bar area of the Android Device.

However, for this basic tutorial, we'll keep it very simple and the design of our App UI will be done inside the activity_main.xml file.

Here's how your design code should look like

(html comment removed:  activity_main.xml )
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/quoteTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Inspiring Quote Goes Here"
        android:layout_centerInParent="true"
        android:textSize="18sp"
        android:textStyle="italic"
        android:textAlignment="center"/>

    <Button
        android:id="@+id/nextButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Next Quote"
        android:layout_below="@id/quoteTextView"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="16dp"/>
</RelativeLayout>

Fetching The Quotes

In order to fetch the quotes data and display it in our Textview we're going to have to create a new Java class to manage fetching quotes.

I created a simple Java class and named it Quotes.java.

You've got two options for fetching quotes though. You can either use a simple array or an API for this but for simplicity, let's use an array.

This is where we'll include all the different quotes the user will see and read.

I included two quotes, one from Steve Jobs the founder of Apple Company and another quote from Theodore Roosevelt the 26th president of the United States of America.

You can add as many quotes as you wish guys. The more quotes you add, the more valuable the quote App would be.

In future developments, we would even include a category of different quotes for different nuggets of wisdom.

Here's how the Quotes Java class should look like

// Quotes.java
public class Quotes {
    public static String[] quotes = {
        "The only way to do great work is to love what you do. - Steve Jobs",
        "Believe you can and you're halfway there. - Theodore Roosevelt",
        // Add more quotes as needed
    };
}

Logic Of Our App

It's now time for the logic of our App. We're going to set up the logic to display a random quote when the app starts and when the user clicks the "Next Quote" button.

Since the arrangement has been set to random, any of the quotes you included will show in a random manner.

Of course the logic code of our App will be written inside the MainActivity.java file.

Here's how your code should look like

// MainActivity.java
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import androidx.appcompat.app.AppCompatActivity;

import java.util.Random;

public class MainActivity extends AppCompatActivity {

    private TextView quoteTextView;
    private Button nextButton;

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

        quoteTextView = findViewById(R.id.quoteTextView);
        nextButton = findViewById(R.id.nextButton);

        nextButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                displayRandomQuote();
            }
        });

        // Display a random quote when the app starts
        displayRandomQuote();
    }

    private void displayRandomQuote() {
        Random random = new Random();
        int index = random.nextInt(Quotes.quotes.length);
        String randomQuote = Quotes.quotes[index];
        quoteTextView.setText(randomQuote);
    }
}

Running The Quotes App

Congratulations guys, we're finally through with our very simple Quotes App. You can click on the run button in Android studio to launch the App.

As always, you have the option to either run your app on an emulator or physical Android device to see how it looks and behaves.

When the App finally launches, ensure that the quotes change when you click the "Next Quote" button. It definitely should work with the logic code we wrote.

Also remember guys, this is still basic tutorials and so many features could be added to improve the App.

Thanks so much for taking the time to read today's blog. I really hope you enjoyed it.

As you keep practicing with each episode everyday, you'll soon become a professional Android App Developer.

Have a Great Day and Catch you next time on StemSocial. Goodbye 👨‍💻

You Can Follow Me @skyehi For More Like This And Others