So, this is where things start getting interesting rather than just messing around with the layout and background, and colors. Over the next two videos, we're going to write some code and build some interactivity in our app. Now, the easiest way to bring in some basic interactive elements is to bring in a button in the layout. So, from the widget palette over here, select a button. Right here you see buttons and there is a button. I'm going to drag it into the layout right here towards the center and the top. And then I'm going to center it right there and we have a button. Now, on the right here, you can feel free to put in some margins. 

So, I'll add a couple of margins and if you like, feel free to experiment with different colors and styles from the bottom from the attributes right here, but we'll focus on the code for now. So, I'm not going to style the button right now. And buttons have this attribute that's called onClick. So, under common attributes or all attributes, you'll find this onClick option. And this is where we can get some function or method to be called when the button is tapped by the user. So, right here, whatever I type is going to be called when the button is tapped. 

So, I'm going to name a function and I'll call it clickFunction and this is the function that is going to be called when this button is tapped. So, once I hit 'Enter' over here, you see I get an error. What is the error? Let me click on this right here. It says, the method handler or the function we're trying to call here, which is clickFunction was not found. So, we're going to have to create this. And we're going to do that in the MainActivity Kotlin file, which is what we'll be using to write our code. Let 's take a look at it. 

When I close this out and I'll bring back my projects tab right here, click on 'Projects' under Java in this folder, you see the first folder we're going to expand it a little bit right here, com.example.example app. I'm going to expand that and there is the MainActivity Kotlin file. If you open it here we go. And this is our first experience with Kotlin. We saw this MainActivity file a few videos ago while exploring the Android Studio, but we didn't really explore it at that time. So, let's take a quick look at what this is doing. First off, the file on top here is referencing the package ID that we have for this app right here com.example.exampleapp. If you remember we had seen this when we were creating our project and this being the example app, we have the name over there. For example, the app we used for the text view homework my demo version was called Quiz App. So, the package ID for that would have been different.

Now, you may have done the quiz in the same app, but I did it in a different app. So, I'm going to pull that up to show you that this package ID is different. Here we go. I'm in my Quiz App and if I go to that MainActivity file, you see this one says com.example.quizapp, which is the name of that. Now, back to our example app. Following that we have this import portion. I'm going to click on this and you can see we have a couple of import statements and we're importing some frameworks here which allow us to use some features of the Android OS bundle as we start to use new features, we're going to have to import the code for them and we're going to do it here. But right now it's very basic. We have these two. 

The second one we have the Android OS bundle right here and the first one being the appCompatActivity. And this appCompatActivity, this allows us usage of some of the newer platform features on older Android devices and you can see that as I hover over it. You see it has that in the description there. Next, we move on to this line where it says, class MainActivity. It's basically creating a class called MainActivity. And the important thing to remember here are the name of the class which is MainActivity and the keyword class.

In general in programming when you come across this term think of it as a blueprint for something you want to create other objects out of. So, let's say a new emulator screen or a new browser window or a new app or a new screen layout, whatever it may be, just like an actual building would be built based on a blueprint you'd have computerized objects built off of blueprints as well and they start with the keyword class. And they usually consist of things like constructors, variables, functions, methods, which contained code and information that helps build objects from the blueprint. Now, think of the example of the temperature converter app in the blueprint you would likely have a couple of functions which perform the actual conversion calix. 

So, that's an example. Now this class, MainActivity it will control the MainActivity that we have created here the layout, the MainActivity and that's the connection right there. So, this is going to control what's going on here. So, after the class name, we have this colon and then you see it has the name that we had imported AppCompatActivity. And this is Kotlin specific syntax, if you're coming from a Java background, think of this as extends. And if you're coming from any other programming language, think of inheritance. But what this does is it makes all the functionality that's available in the AppCompatActivity like variables and methods and lets us use them here without needing to write any of the code from scratch. And then we have this line override fun onCreate and we'll come back to what override is, but fun in Kotlin means function. 

So, this is a function and the name of the function is onCreate over here and this function runs when the activity is created and appears on the screen. So, this is the function that runs when that happens. Now, this override keyword, what does this mean? Well, this onCreate function already exists in the AppCompatActivity think of library or package. It already exists there and we simply intend to use that existing code and add things to it over here if necessary. And again, don't get too caught up with the details of this at this time it will get clearer the more we see and use this. These concepts that we're discussing extends inheritance this that override blah blah blah. 

These are pretty advanced programming concepts, but they're used in a very neat way over here to make all this advanced functionality like building an app come together in a package like this. So, then after the name of the function we have this parameter that we're going to be passing in its called savedInstanceState that we can use within the method. Again, we'll find out details about these things later. But briefly this is the save state of the app. So, think of someone using their device and let's say they're

logged in already. So, that is something the savedState would include. So, when they tap on their app and it starts with the MainActivity, they're already logged in and ready to go.

Then we have two more lines. We have super.onCreate and remember we mentioned that this onCreate function already exists in AppCompatActivity. So, super here refers to the function that exists there in AppCompatActivity. It's referencing that with the parameter that we are passing over here to the function which was the savedInstanceState. So, to summarize this line will run the code for onCreate that we have an AppCompatActivity with the savedState of the app. And if we add some more code below this, that code will run after that. And then we move on to the next line we have setContentView. This sets the view to be loaded as the main content view that we have over here. 

It links this which is the MainActivity view and makes it our main content view. So, these two are basically linked. So, that's quite some high level programming concepts here that we've covered and we're going to leave it at that in this video as I said earlier don't worry too much about the details at this time, it'll start making more sense as we use these and find out what they do. And for now, all we have to remember is that this code here in this Kotlin file is setting up our MainActivity or the layout that we've been working with. So, in the next video we'll look at adding some code to make this button do something when tapped. See you there.