Okay, that's enough about the tools.

Let's do something.

We'll talk more about the tools as we work through this project.

I'll make sure you understand everything you need to know to build this app.

There are two main things we will work with in Android Apps.

The first is the layout of the screen.

For this, we'll use the design view which allows us to

visually manipulate the layout by dragging and dropping.

It's pretty helpful.

We can also manipulate the layout and code,

and we'll see how to do that as well.

The other main thing we'll work on is how our app works behind the scenes.

That's where we write Kotlin code that does things like pick a random fun fact.

I'll explain everything you need to know, but

if you get confused remember to check the teacher's notes for help.

And feel free to ask about anything in the community.

Take a look at these mock ups from one of our designers at Treehouse.

You can find this image in the teachers notes.

This shows what the app should look like when we're finished.

We'll have text at the top that says, did you know.

Then we'll have one of the fun facts displayed in the middle, and

then at the bottom we have a button to show another fun fact.

Notice how we´re also going to change the background color for each fact.

We´ll even give our app an icon to match this one.

This app is relatively simple, but it´s still a lot of work.

We´re going to tackle it piece by piece to make it easy to understand.

Let´s start by making the simplest version possible,

this is something that developers do all the time.

Starting with something simple, let's just make sure the app works as expected.

Then we can refine it and make it look more and

more like what we see here in the mock ups.

We'll start by changing the layout to show the, did you know, text at the top.

Then we'll build on this, piece by piece, to turn it into the full app we see here.

Before we get started, just to make things a little easier to see,

I'm going to put this into full screen mode.

We should already have our layout file open.

Our app is created with just one simple screen, and

the layout of that screen is defined right here.

I mentioned that this code is in a language called XML, which stands for

extensible markup language.

If you're familiar with HTML, you'll notice it has some similarities.

The good news is there's a design view of this layout as well.

Remember that we can switch back and forth between XML, text, and

the design view by clicking on these tabs down here.

Changes we make to the design view update the XML code and vice versa.

It's up to us to choose how to edit the file.

Often it maybe easier to work visually like this, but sometimes we might

want them more precise control we get by editing the XML code directly.

All right, so we already have a TextView on our screen.

Let's change that TextView to say, did you know, just like in the mock ups.

Click directly on the Hello World to select it, and

on the right we can see a bunch of properties for this TextView.

In the middle we can find a property called text, and

it's set to Hello World, just like we see in the preview.

Let's delete that and type, did you know, With a question mark.

Hit Enter and there we go.

Now if we flip to the XML by using the Text tab, there's our new text.

We've seen what happens when we have errors in our code, but this

yellowish highlighting is what happens when we have something called a warning.

Warnings aren't as severe as errors.

We don't have to fix warnings, but we probably should.

Errors we do have to fix before we run the app.

Now this warning is telling us that we should use a string resource

instead of hard coating the string.

We'll cover how to use string resources in a later project, so

we're going to ignore this warning.

But I encourage you to try and fix it on your own if you're curious.

And if you want to ask for help in the community, please do.

Also before we go any further, there's one more change we need to make in our layout.

Instead of using a constraint layout, we want to use a relative layout.

So up there at the top let's delete this constraint layout bit and

replace it with RelativeLayout.

Then let's also delete these four constraint lines, and

make sure not to delete the closing tag.

Awesome, finally let's talk about saving.

Android Studio will save everything for you automatically.

But if you want to explicitly save a project you can go File,

Save All or use Command S for MAC or Control S for Windows.

All right, nice work.

Let's see if you can make that same change in just the XML.