[MUSIC]

Now that we're comfortable using the design editor to make changes to our

layouts, it's time to write some code.

Let's start by taking a look at some of the code that was

automatically generated for our project.

Using the Android perspective makes our code easy to find,

it's right here in the java folder.

But if you happened to be in the project perspective.

Remember that our Java code can be found at app > source > main > and then Java.

It's right above our resources folder.

Let's switch back to the Android perspective and

take a look inside the java folder.

Now we can see the package name we chose when we created our project.

This is where all of our code will go by default.

Inside this package, we'll find one file, FunFactsActivity.

And if we double click it, it opens up over here in the code editor.

Now we can close the rest of these files.

Let's right click on FunFactsActivity up here and choose Close Others.

And I'll also close the project pane.

In Android, an activity represents a screen that users can interact with.

We'll learn much more about activities later but for

now, let's focus on this onCreate method.

The onCreate method is called when our activity is first created.

And since our app only has one activity,

this onCreate method will be called when our app is first started.

You might have noticed that this method also has one parameter,

a bundled variable called savedInstanceState.

We won't be using this variable in our app, so let's ignore it for now.

Inside onCreate, the most important line is the call to setContentView.

This method tells the activity which layout file we want to use for the screen.

This R.layout.activity_fun_facts parameter, is an ID

which points to the activity_fun_facts XML file and the layout directory.

This is where the layout we've been working on gets attached to our activity.

Okay, time to make the magic happen.

The first thing we need to do is declare two properties or member variables.

One for our FunFact text view and one for our button.

A property is the name for a variable that is inside the class but

outside all of the methods.

Using properties for

our views means that we'll be able to access them from any method in our class.

This is especially useful because there's often more than one method that needs

access to our views.

Let's start by adding a line at the top of the class.

Then let's add a comment to help explain what we're doing.

Remember it's two forward slashes for a single line comment.

Let's type slash, slash space and then type Declare our View variables.

Then on a new line let's declare our fun fact text view as private var

factTextView, Then since,

we're using colon, we also need to set it equal to something.

But we won't have access to our text view and until the onCreate method.

So for now, let's just set it equal to no.

Let's have a colon and then for the data type, let's use TextView but

add a question mark to the end to let colon know it might be null.

Then let's set it equal to null and there we go.

Also, if TextView is in red, that just means it hasn't been imported yet.

Hit Alt+Enter to import it.

One more thing, note that we won't be using the m prefix for our properties.

Sometimes, when you see Android code, they might declare their variables like this.

And according to the Android source style guide, all fields or

properties should start with a lower case m.

However, most code isn't written that way.

So unless you plan on contributing to Android source code,

feel free to drop the m prefix as we'll be doing here.

If you'd like to read more about these style guidelines,

check out the link in the teacher's notes below.

Now we need to declare our button.

Let's add a new line in our TextView and type private var showFactButton.

Then, let's add a colon and for the type, start typing Button.

Notice that Android Studio is trying to guess what we're typing.

Once the top choice is button, hit Enter or

Tab to let Android Studio autocomplete that for us.

It even adds the import statement.

Then, to finish it up, let's add a question mark and equals null.

All right, but why do these names change to gray like this?

If we hover over one of our properties,

we get a quick tip saying that our Property is never used.

The gray coloring will go away once we use these variables.

Another thing I want to point out are the import statements,

we can view them by hitting the little plus button up here.

By default, our class only has a couple of imports,

but every time we use a new class like TextView or button.

Android Studio will try to automatically add the corresponding import statement,

if you use a class that isn't important yet.

Let say I delete the button import.

Then you'll have something it'll look like this.

To fix it, just place your cursor in the missing class and

hit Alt+Enter to import it.

Let's take a short break and

then we'll see how to assign our views to these new variables.