Build an Interactive Story App

User Input

We need to be able to get input from users for our apps. In this stage we'll introduce the EditText view, which is used for entering and editing text input. We will also introduce a new layout for Android called ConstraintLayout. 8 steps

• Introducing the Project 1:51
• Finding Views by IDs 1 objective
• Creating the Project 5:37
• Introducing ImageViews 6:38
• Using Images 6 questions
• Introducing ConstraintLayout 5:33
• Using EditText for Text Input 7:05
• Using ConstraintLayouts and ImageViews 4 objectives
• Extra Credit User Input BonanzaWe learned how to get data from an EditText, which is really important. It also applies to all sorts of widgets used for user input.Create a simple app that has a bunch of different controls from the Widgets section in the Palette. For each control, get the value the user enters and then display it in the log or a Toast. Getting comfortable with the different widgets will cement your learning and expose you to different controls.Some specific ones to try include:
  • EditText with a different format
  • RadioButton
  • CheckBox
  • Switch
  • ToggleButton
  • Spinner

Tuning the User Interface

Android apps need to work on different screen sizes, different versions of Android, and sometimes, in different orientations. We'll talk about each of these and how to use the AppCompat library to keep things consistent across many devices. 6 steps

• Changing Theme Colors 3:14
• Review: Styles and Themes 3 questions
• Reviewing Features from AppCompat 3:35
• Handling Different Screen Sizes 3:45
• Review: Tuning the User Interface 5 questions
• Optional: Setting Portrait-Only in Code 3:47

Intents and Multiple Activities

Intents are objects that we use when we intend to do something in Android, like start a new Activity or use the camera. In this stage we'll learn how to use them to navigate to a new Activity, including passing data as an Intent extra. We'll also take a look at string resources and how to be more mindful of text in our apps. 13 steps

• Getting Text from an EditText 8:21
• Getting Text from an EditText 1 objective
• Adding a Second Activity 1:57
• Introducing Intents 2:23
• Starting a New Activity 2 objectives
• Sending Data to a New Activity 2:53
• Putting Data in an Intent 1 objective
• Getting Data from an Intent 3:06
• Getting Data from an Intent 2 objectives
• Investigating a NullPointerException 3:21
• Introducing String Resources 2:41
• Getting Resources from the Context 4:20
• Using String Resources 3 objectives
• Extra Credit Master Your IntentsExtra credit in an earlier stage involved creating an Activity with a lot of different user input controls (widgets). Take that project (or create a new one if you need to) and practice opening a second Activity when each control is used. Then practice attaching different types of data to the Intent and then retrieve it in the new Activity. Display the data you retrieve in a TextView in the new Activity.Stringization!Now that you know how to use a String resource, refactor every other hard-coded string in the project to use a String resource. Button labels, image content descriptions...you name it!For an extra challenge, see if you can refactor the Fun Facts app to use string resources, too. In particular, check out the documentation on string arrays and see if you can change the facts array to be a string-array resource instead. :)

The Model-View-Presenter Pattern

The Model-View-Presenter software design pattern allows us to architect apps in a way that makes them easier to maintain and understand. We will talk about how this pattern can be used in Android development and why it will help us. 10 steps

• What is Model-View-Presenter (MVP)? 4:45
• Why Do We Use MVP? 3:28
• Review: Model-View-Presenter 8 questions
• Defining the Data Model 2:53
• Implementing the Data Model 6:26
• Creating a Data Model 4 objectives
• Adding Story Resources 2:57
• Creating the Story 3:54
• Adding Custom Constructors 4:05
• Adding a Custom Constructor 2 objectives
• Extra Credit A Model UserA common data model is that of a User. Create a simple User data model with attributes like:
  • username
  • real name
  • age
  • gender
  • location
  Then use this new model in a project. Create an Activity that allows you to add data for each property of the User model. For extra fun, see if you can attach your User object as an extra to an Intent and send it to another Activity. Can you display all the User data in a second Activity?

Finishing the User Interface

With a fully implemented data model, we are finally ready to display our story in the app! 8 steps

• Creating the Story Layout 5:19
• Customizing the Buttons 4:59
• Customizing a Button 2 objectives
• Introducing Styles 2 questions
• Introducing ScrollViews 8:00
• Loading the First Page 5:59
• Formatting Strings 6:35
• Using a Model in the Presenter 3 objectives

The Rest of the Story

Our one page story needs more! In this final stage we will dynamically update the story pages and add some app navigation. 9 steps

• Loading Additional Pages 2:40
• Ending the Story 4:43
• Adding Story Pages 5 questions
• Finishing an Activity 2:40
• Finishing an Activity 1 objective
• Navigation with Back and Up 4:23
• Maintaining a Custom Back Stack 6:02
• Navigation 2 objectives
• Wrapping Up 1:39
• Extra Credit Color ComplimenterWrite an app that asks the user for their favorite color, then take them to a new Activity that uses that color as a background color and says something nice about them. Login/Signup MockupsDesign a fake login or signup screen that asks users for a username and password and has a button that pretends to log them in by taking them to a new Activity. Then just display their data in that new activity.Age CalculatorAsk a user to input their age in years, and then take them to a new Activity that shows their age in days, weeks, months, decades, minutes, etc.