Activity: Saving User Preferences in TinyDB
Objective
Create an app where a user can enter their favorite color, save it, and see it displayed each time
the app starts.
Instructions
1. Set up the screen:
Open MIT App Inventor and start a new project.
Rename the screen to Screen1 and set the title to “Favorite Color Saver.”
Add the following components:
TextBox: Rename it ColorInput. Set its hint text to "Enter your favorite
color."
Button: Rename it SaveButton and set its text to "Save Color".
Label: Rename it DisplayColorLabel. Leave the text empty as this will
display the saved color.
2. Add a TinyDB Component:
From the Storage drawer, drag TinyDB onto the screen. It will appear as a non-
visible component.
3. Set up Blocks:
Open the Blocks editor.
Add the following logic:
When SaveButton.Click:
Store the text entered in ColorInput in TinyDB. Use
TinyDB1.StoreValue with “FavoriteColor” as the tag and
ColorInput.Text as the value.
Set the text of DisplayColorLabel to the saved color.
When Screen1.Initialize:
Retrieve the color value from TinyDB using TinyDB1.GetValue.
Use “FavoriteColor” as the tag and “No color saved” as the default
value.
Set the text of DisplayColorLabel to the retrieved color.
4. Test the App:
Run the app on the emulator or a connected device.
Enter a color in the text box and click "Save Color."
Close and reopen the app. The saved color should appear in the label.
Expected Outcome:
When the user enters their favorite color and clicks “Save Color,” the color is saved. Each time
they open the app, their saved color is displayed in DisplayColorLabel.
