How To Build an Android Text Reader App - Hive Programmers

Greetings to my favorite Science community online, StemSocial.

It's @skyehi and I'm super excited as always, to be back to continue my series on Android App Development Tutorials for beginners.

For my vision in this community this year, I hope to get the tutorial series to the advanced level where we can finally build more complex Apps and also learn how to publish them on Google Play Store.

It won't be easy but it's going to be lot's of fun with loads of exciting episodes.

In yesterday's successful episode, I shared how to build an Audio to Text Android converter App which the user can convert recorded audio into text through the App.

It has inspired me to share today's blog. For today's episode, we're going to learn how to build a text reader App.

Original Image Source by Andrea Piacquadio from Pexels

Text reader Apps are very useful for situations where you can't look at the device screen to read the text yourself but would want to listen to the device read the text for you in Audio format.

This is a great App for people with visibility issues or trying to read something while driving.

I hope you're excited to go through with this tutorial guys. - Don't worry, it's beginner's guide so we'll keep things simple

Prerequisites

As always, I'll share this part for the sake of all newcomers to my series and to Android App development in general.

To be able to successfully build Android Apps with your PC, you would need three very important softwares installed.

• Android Studio IDE - This is the platform on which we'll build our Android Apps. It's got great tools and templates to help developers build any Android App.

• Java Development Kit, JDK - You need to have JDK properly installed on your PC for your PC to be able to execute Java codes or instructions.

• An Emulator or Android Device - After building the Android App, you would have to run it or test it. You can test the App using your own Android phone or device or by using an emulator software.

If you get all these checked out, you're good to go with building Android Apps guys - However you can comment down below if you're having troubles installing any of the softwares

Creating a New Project

The first step to take in building our Text Reader Android App is to open Android Studio application and click on "Create A New Project".

You'll be given a grid of different App templates to choose from. Please select the "Empty Activity" as the template of this project to keep things simple.

Also guys, set the App name and package name of the App and please ensure that Java is the selected programming language, not Kotlin.

I would always recommend building Apps with Java if you're a beginner. Kotlin is really great but it's still very recent and I believe Java was the foundation.

So by using Java, you'll have a better understanding of how to create the logic of Android Apps.

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

Designing the User Interface, Ui

Alright guys it's now time for my favorite part, the UI design.

What I have done to keep things simple for a beginner's tutorial is to create a very simple RelativeLayout and have included a TextView element to display text and a Button element to trigger text-to-speech.

So when a user clicks on the button, the speech will be read.

You can totally improve the design according to your preference.

One thing I would recommend if you have gained enough experience with this series is to create an edittext and when you type in that edittext, it will display in our TextView and the button can be clicked to read any speech.

However for simplicity sake I have created the TextViewto display the words "Hello, Text Reader!". This is the text that will be read when the user presses the "Read Text" button.

The layout design will of course be done inside our res/layout/activity_main.xml file.

Here's how your UI code should look like

<?xml version="1.0" encoding="utf-8"?>
<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/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello, Text Reader!"
        android:layout_centerInParent="true"
        android:textSize="18sp"/>

    <Button
        android:id="@+id/readButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Read Text"
        android:layout_below="@id/textView"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="16dp"/>
</RelativeLayout>

Requesting Permissions

Now guys, we wouldn't want to forgot the very important step of requesting permissions for our App to have access to some services.

These permissions we're going to request are required for text-to-speech functionality and ensure a very smooth user experience without the App crashing or showing errors.

So open yourAndroidManifest.xml file and write the permission request codes.

Here's how your permission request codes should look like

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
<uses-permission android:name="android.permission.WAKE_LOCK"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>

Add Dependencies

Since our App will be using a text-to-speech service or functionality, we would need to include its dependency in ourbuild.gradle (Module: app) file.

It's an external library that would help us implement the text-to-speech functionality so our App can read any text we give it.

So open the app module gradle file and copy paste the tts dependency

implementation 'com.google.android.tts:tts:3.0.10.221851808'

When you start implementing the dependency, a "Sync" button will appear at the Top of your screen, please click it and Android Studio will download the necessary libraries to integrate the "tts" or text-to-speech functionality in the App project.

Implement Text-to-Speech

We're now ready to work on the logic or backend code of our App.

We have integrated text-to-speech dependency and have included the necessary permissions in our Manifest so we should be ready to use "tts" methods or functions.

The backend or logic code will of course be written inside ourMainActivity.java file so go ahead and open that file guys and let's get to work.

I'm excited to introduce another interesting function in our series.

I'll include a method called readText() for our App to to read the text aloud.

We can call for the TextToSpeech function. If you have errors with this function then maybe you may not have successfully synced the "tts" library. Please let me know in the comments.

Here's how your backend or logic code should look like

public class MainActivity extends AppCompatActivity {

    private TextToSpeech textToSpeech;
    private TextView textView;
    private Button readButton;

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

        // Initialize UI elements
        textView = findViewById(R.id.textView);
        readButton = findViewById(R.id.readButton);

        // Initialize text-to-speech engine
        textToSpeech = new TextToSpeech(getApplicationContext(), status -> {
            if (status != TextToSpeech.ERROR) {
                textToSpeech.setLanguage(Locale.US);
            }
        });

        // Set a click listener for the button
        readButton.setOnClickListener(view -> readText());
    }

    // Method to read the text aloud
    private void readText() {
        String text = textView.getText().toString();
        textToSpeech.speak(text, TextToSpeech.QUEUE_FLUSH, null, null);
    }

    @Override
    protected void onDestroy() {
        // Stop and shutdown the text-to-speech engine when the activity is destroyed
        if (textToSpeech != null) {
            textToSpeech.stop();
            textToSpeech.shutdown();
        }
        super.onDestroy();
    }
}

Run the App

Congratulations guys, you have successfully built your first Text Reader Android App.

It's now time to run the App. You can connect your emulator or physical Android device to the PC and click "Run" in Android Studio.

The app should launch perfectly well with a basic interface. We included a button and a textview that said "Hello, Text Reader!" so we should see just that when the App opens.

You can of course change that text to anything you want to read guys.

Now Press the "Read Text" button, and your app will utilize the device's text-to-speech engine to vocalize the text.

That's it guys. Thanks so much for taking the time to read today's blog. I hope you enjoyed this one. We're making great progress and I think through this series I'm making some good friends here.

Thanks everyone for the support and my friends @stickupcurator or @stickupboys

Have a Great Day and Catch you Next Time on StemSocial. Goodbye 👨‍💻

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