Upgrade to Pro — share decks privately, control downloads, hide ads and more …

MAD Week 2 Lab 1

60c54dec6329cd29ecf6ce8fa2584e6c?s=47 Marina Tanasyuk
February 15, 2020

MAD Week 2 Lab 1


Marina Tanasyuk

February 15, 2020


  1. Mobile App Design Week 2: Android Lab 1

  2. Why Mobile Engineer? Why Android? Some fun facts: • 2.5

    billion people in the world estimated to have a smartphone in 2019. • mobile devices (excluding tablets) generated 51.51% of global website traffic. • mobile OS market share worldwide (based on December 2019 data) is 74.13% Android vs 24.79% iOS. Meaning: • a lot of employment AND learning opportunities.
  3. Common components of popular Android apps • Show data (text,

    images, videos) • Create content and take users through different flows (aka features) • Save (aka persist) data • Polish user interface
  4. Technical Labs - Overview • Build real working apps! •

    Learn fundamental Android concepts • Work in groups to learn, explore and experiment
  5. Technical Labs - Building out a Flashcard App Lab 1:

    Build Layouts and Handle User Interaction Lab 2: Create content and take users through different flows Lab 3: Save data Lab 4: Polish App with animations and styling
  6. Lab 1 - Build Layouts and Handle User Interaction •

    How to build UI (User Interface) • How to handle simple user interactions • How to manage code and collaborate
  7. Lab 1 - Flashcard App - Basics Concepts covered: Android’s

    Activities Layouts Listeners GitHub
  8. Lab 1 - Flashcard App - Advanced Concepts covered: More

    advanced logic handling Styling views More complicated layout styles Integrating Icons
  9. Quick intro to concepts covered - Activity • All apps

    have at least one screen that the user can interact with • In Android, a screen is called an Activity • Activities are where we write Java code to surface different content, handle user interactions and more!
  10. Quick intro to concepts covered - Layouts • In Android,

    what’s displayed on the screen is usually designed in XML files • Layouts are usually composed of multiple views like Buttons, TextViews, ImageViews, and more • XML is a type of markup language that allows us to add, position and customize views
  11. Bridging Activity and Layout Handles user interaction Sets up views

    (aka programmatically) MainActivity.java activity_main.xml Sets up views Each activity has a corresponding layout file that’s set with setContentView(R.layout.activity_main)
  12. Listeners • All apps need to handle different types of

    user interactions • Listeners are Android’s way of ‘listening’ for different types of user actions and reacting to it • The most common type of user action is a single tap, and in Android it’s handled with an OnClickListener
  13. GitHub Code can get messy quickly, especially if there are

    multiple people working on the same code. GitHub is a great way to : • save your progress • have your code living on the Internet • collaborate with others without any adverse effects to current code
  14. Navigating Android Studio

  15. Working on Labs - For all lab weeks there will

    be 4 tabs • Overview: quick summary of what we’re trying to accomplish this week along with submission instructions
  16. Working on Labs - For all lab weeks there will

    be 4 tabs • Lab: Walkthrough of all the Required and Optional tasks
  17. Working on Labs - For all lab weeks there will

    be 4 tabs • Skills: Summary of concepts we will learn in the lab, and glossary of new terms / concepts introduced
  18. Working on Labs - For all lab weeks there will

    be 4 tabs • Resources: Material for further reading on topics you found interesting
  19. Working on Labs • The are a set of Required

    tasks, and a set Optional tasks • Required tasks must be finished and submitted before the end of the class • Optional tasks are more advanced and allow you to explore Android development in more depth • Try implementing the tasks yourself before consulting the more detailed walkthrough guide
  20. Working on Labs • There will be breakout rooms where

    you can work together with your classmates • Turn on your camera! • Introduce yourself! • Support each other throughout the session - helping debug issues helps everybody gain a deeper understanding of the concepts
  21. How to ask questions? 3. Slack 4. https://discussions.codepath.com/ (for when

    outside the class) 1. Ask people in your group 2. Ask for help from TAs and Instructors:
  22. Let’s get started! Go to courses.codepath.com, click on Lab tab

    for Week 2. Follow the guides to work through the tasks, and ask people in your group for help when you’re stuck. By the end of the lab, make sure you have created your ReadMe and submitted your project! Your submission should include a GIF that shows your app: 1) displaying a question and 2) displaying the answer when the question is tapped
  23. Thoughts / Questions / Concerns?