React Navigation & Component Lab

Practice with Navigation.

2.    Invitation Details/Edit Detail Screen (total 75 points)

The screen below shows the design for the invitation screen. This is the screen that the user will see when they click on any part of the invitation card (not including the Accept or Decline sections). The screen is intended to provide the user with an overview of the events as well as a map including directions on how to get to the event.

Screen Shot 2019-10-30 at 5.06.02 PM.png

2.1    Click on the invitation card. (20 points)

2.1.1    As a user I can navigate to the invitation screen by clicking on the invitation card on the home screen. (20 points)

Practice with Expo Components.

Remember that expo provides a list of components that makes integrating feature like this really easy.  Check the documentation: (Important you don’t have to get blue overlay. That is just apart of the style of the design) 

2.2    Display Map with the location of the event marked. (25 points)

To make it easier for a user to decide if they will accept a dinner invitation, we would like to show them a map of location relative to their current location. Feel free to create your own data for this section.    Assume The longitude and Latitude are available as part of the Invitation object. You can choose longitudes and latitudes that are close to you.

2.2.1    As a user I can see a marker on the screen displaying the location of the current event. (25 points)

2.3    Display your current location on the map. (30 points)

In addition to displaying the location of the event. It would also be useful if the user can see the current location.


Submit the lab, by publishing to expo from your local machine instructions in the slide set. Deploying  & Testing[PDF]

%d bloggers like this: