Text To Speech App using MIT App Inventor

Siva Rama Krishna August 08, 2019 Android on MIT App Inventor No comments :

To design a Text-To-Speech (TTS) app using MIT App Inventor, follow the steps below:

MIT App Inventor website:

Click on this link ai2.appinventor.mit.edu.

Introduction:

Log in with your Gmail account to initiate the development of your Android application. Navigate to the "Projects" menu or menu bar and choose "Start new project." Provide a name for your project and click the "OK" button to proceed.

Sign In with your gmail account and start develop your android application. click on the Projects menu/Menu bar and select the Start new project and name your project and press OK.

Upon completing the previous steps, you will enter the application development section. In this area, you can design the layout of your app using the "Designer" and implement its functionality using "Blocks."

Designer Panel:

Choose "Layout" from the Palette and select "Horizontal Arrangement." Drag and drop this onto your blank screen. This component will serve as the container for all the interface elements in your app.

Select Layout > Horizontal Arrangement in the Palette and drag this on to your blank screen. This will hold all of the interface elements.

Navigate to the Properties section in the right corner of the page. Adjust the Height property to 100 pixels and set the Width property to Fill Parent.

Change the properties as shown in below image.

Go to Properties in the Right corner of page and Change the Height property to 100 pixels… and the Width property to Fill Parent… .

Select the TextBox component from the user interface options. The TextBox is a designated box where users can input text.

Select the TextBox component from user interface. TextBox is a box for the user to enter text.

Select the Button component from the user interface options and drag it to the right side of the TextBox. The Button is designed to detect clicks. Customize the Button text and color according to your preferences.

Select Media > TextToSpeech component from user Media and drag it to App Screen. The TestToSpeech component speaks a given text aloud. It is Non-Visible Component.

MIT App Inventor Block Editor:

The Blocks Editor is where you program the behaviour of your app. There are Built-in blocks that handle things like math, logic, and text with each components you have added.

Click on Button and drag the when Button1 .click block.