We've now finished up our list screen which is a great little example of our flat list component.
Now before we move on to our next screen that we're going to put together I want to do a little bit
of busy work or a little bit of administrative work on our application.
So at present we have three different screens worth of content that a user can see.
But right now there's no way for a user to navigate between these different screens if you open up your
app dot J.S. file.
You'll recall that inside of here there's an object with a initial root Name property and that property
right there decides what screen is going to be visible when our application first starts up.
Right now it's set to list if we change it to home.
It's going to now show this home screen.
So if I now save this the default screen that we see is the home screen instead so in this next series
of videos I would love if we figured out a better way to show all the different screens that we're putting
together so that we do not have to always be changing this prop right here or this property anytime
one shows some different content.
So to do so I want to turn that home screen into kind of a different experience when our application
first boots up.
We should always show the home screen by default but at the same time on the home screen.
I want to add in two different buttons.
One button a user should be able to tap to go to the component screen and the user should be able to
tap this other button to go to the list screen.
So pulling this off is really going to be two different steps.
The first thing we're going to have to do is figure out how to place two buttons on our home screen.
We're going to have to figure out how to detect whenever a user taps on either this button or this button.
The second thing we're going to have to do is figure out how to actually navigate a user from the home
screen over to components or list so that's what we're going to work on in this video in the next couple
so.
The first thing we need to do.
Like I said we need to show some buttons on the screen showing a button.
It's going to be a little bit more complicated than you might think.
Let me tell you why in the world of React Native if you take a look at the documentation you'll see
that there's actually two different ways of showing a button to a user.
There's one primitive element remember a primitive element is something that we import from the React
Native library and it's called button this primitive element as you might guess is going to show a very
simple button component.
This has very little customization features tied to it.
And essentially it's just going to show something that a user can tap.
And it has the ability to tell you and I as developers whenever a user taps on this button.
The other element that we have access to to make a button is something called touchable opacity.
This is a very customizable primitive component and allows us to essentially tag detect a press event
or like a user tapping on something on just about any kind of element inside our application.
So it could be like a piece of text or an image or just about anything else.
So we've got a button component for very simple interactions in a touchable opacity four sign the kind
of like more complex interactions just so you know why there's these two separate things it used to
be in earlier versions of React Native.
There was only this touchable opacity thing but a lot of people were coming into the React Native World
and saying hey how do I show a button.
Because the name touchable opacity doesn't really make it seem like it's a button at all right.
So eventually the React Native team kind of caved in and said OK we'll create a very simple button so
you can show a button but there's not gonna be a lot of customization options tied to it.
So that's why the there's these two different ways of showing a button to a user.
OK.
So then mind let's take a pause right here.
When we come back the next video we're going to work on our home screen.
We're going to try to show a button using that button primitive and the touchable opacity primitive
as well so quite possible see you in just a minute.