Build Your Own Email Sender with App Inventor

Tutorial plan

1- Objective of our Email mobile application

2- Description of Designer Interface

3- Description of Blocks part

Objective of our Email mobile application

The main objective of this mobile application is to enable users to compose and send email messages directly from their smartphone using a simple, user-friendly interface built with MIT App Inventor.

Specific Objectives:

Collect User Input: Allow the user to enter the recipient’s email address, subject, and message body using text fields.

Send Email Using Device Apps: Use the ActivityStarter component to launch the device’s default email app and pre-fill the message fields.

Simplify Email Communication: Provide a basic and quick way to send emails without needing to open the mail app manually.

Learn App Inventor Concepts:

Teach students or beginners how to:

- Use text fields, labels, and buttons

- Work with the ActivityStarter component

- Combine text to create a URI string (mailto:)

Description of Designer Interface

The Designer Interface is where you visually arrange the elements (components) that make up your email app's layout. Here's how it is typically structured:

User Input Components: 

Description of Blocks part

The Blocks Editor is where you program the behavior of your app. For the Email mobile application, the blocks define what happens when the user clicks the Send Email button specifically, they set up and launch the default email app using the ActivityStarter component.

Explanation of Each Block 

Block	Role
	The block is the starting point of the app's action. It defines what happens when the user clicks the "Send Email" button.
	This block sets the type of action that the ActivityStarter component will perform. This block tells Android: "Open an external app to view something", based on the data provided (usually a URL, a file, or an email address with mailto:).
	This blockdefines the data or resource to be opened by another app, based on the action set in ActivityStarter.Action.
	This block executes the configured action and launches the target external app.