Welcome to this lesson and what are we going to be doing in this lesson is we are going to build our
very first Android application.
So open up your Android studio and you should see this screen here.
So next, what are we going to do is we're going to create a new project to get started.
Of course, I'm assuming that you went through the process of installing in a studio whether Mac or
Windows and setting everything up.
OK, so you should have something like this.
And now we're going to go ahead and say create a new project.
So click there and then you will see this awesome, amazing wizard here.
So we have different tabs here.
So we have phone and tablet where OS, Android, TV, Automotive, Android, things can seem a little
bit overwhelming at first.
But let's focus on phone and tablet here.
This is the tab that we want to focus on.
So phone and tablet, because we are going to be building applications for phones.
And then you see here we have different panels, if you will.
So we have no activity, basic activity.
You don't know what an activity is at this moment, but no one will get there.
So we're just getting started.
OK, so and then we have bottom navigation activity and empty activity.
So this is the template we want.
So click on empty activity and I'm going to say next here we have the opportunity to give our application
a name.
In this case, I'm going to say show my name as such.
And then we have a package named Notice here.
I say show my name.
And there is no spaces between the words.
And you could just actually add spaces like that.
That's totally fine.
But I usually like to remove all those spaces.
OK, and then we have the package name.
What is this.
Well, the package name is the identifier for your application.
So usually what we do is we add the reverse domain name of your business or website.
OK, so in this case here I say com that Bob dot show my name, notice the show my name is was actually
appended.
Right.
This show my name String, their name was appended because we added the name for the application, so
it just popolare that for us.
So for you you probably going to have.
Com that example that they can show my name or something like that so you can put any identifier, any
name you want here, but make sure that it is indeed unique.
OK, very good.
And then save location.
Of course you can click here to choose a different location on your machine.
But at this point here, this is fine.
And then next we have language.
So there are two languages here that was Connellan, which is a newer programming language.
And in this course we're going to focus on Java.
So make sure you click all you select Java.
That's very important.
And next, we have the Menom SDK.
So at this point here we have the API level 21, which is Android five that.
What is this?
Well, this is the target API, the target Android version.
We want to run this app.
So if you click anywhere here, really or just click on this arrow down here, you can see there's a
lot of different API levels.
The highest level or the most recent one is API three, Android 30.
But what happens if I choose API 30?
If you choose API 30?
Because is the most recent one.
So it hasn't had a chance to propagate through the Android realm.
If you will notice here, it says your app will run on less than one percent of devices.
So what this means is that the higher the API, the less devices you're going to target.
Now, when devices have the higher API levels, that means we have newer features.
But also, as you see here, means we have less devices that our app will be able to run on.
OK, so in this case here, just because we're just getting started, we want to get things going here,
we're going to go and get a very low API level.
But this does not mean that this course is outdated or we are focusing on older.
This is just for us to get started.
Let's just go to API 24, for instance.
Notice now we have this little text that says your app will run on approximately seventy three point
seven percent or devices way better than less than one percent.
So the lower we go, the more people are app will target.
Okay, so if you go to Kit Kat, actually say Kit Kat, this one here, notice it's ninety eight point
one percent.
OK, why not let's keep 19 so that we can get started here.
All right, so then now that we have everything set up, I'm going to say finish and we'll take a few
seconds.
And you can see now at the bottom here says Gradle is building.
So things are happening in the background.
So you may take a few moments, just be patient.
And once it's all set up, you should see your project ready to be worked on well.
So after a few moments, I hope you didn't have to wait for too long.
You'll see now that we have our Android project ready for us to work on.
Now, there is a lot of things going on here, and I know this is the first time.
And remember, we are just trying to get started to get you writing a very simple application here so
you can feel good about all of this.
OK.
All right.
So what do we see here?
We see a lot of things, as I said.
But one thing to the moment our Android studio finished putting together the project, we have two tabs
here.
We have this activity, main XML and this main activity that Java.
So we have the Java code and then we have the XML code.
So this when you click on this tab, notice now we've open another window with a lot of things here.
Let's look into what's going on.
First of all, what we can actually move, kind of give ourself ourselves more space.
If you just hover over a right between this line there and just drag the left can even quite close it.
If you want to.
If you want to close this panel to the left here, we can go ahead and go like this.
OK, and if you want to open again, just look at this project tab, click there and that will open.
OK, so we have this panel with a lot of things.
What is this?
So this is where we construct our user interface.
So what what users will be able to see when we run this application?
So let's go ahead and make this a little bit bigger so we can see.
So I'm going to go make it bigger and I can close this attributes as well.
Notice we have this attributes tab there.
So you see we have this halo world.
The moment you click on this Halo world, you see there's a lot of things that are happening as well.
So we have these little squiggly lines with arrows at the end.
These are what we call constraints.
So constraints.
What they do is they constraint elements in this case, UI elements, user interface elements, so buttons,
text and so forth within the screen we constraining all of the widgets.
These are called widgets.
Whatever we put in our screen, we constrain them in relation to other widgets.
So in this case, since we only have one widget, which in this case is just hello world, it's just
constraining around.
The constraints are around the screen, the entire screen and also the right here you see we have something
similar to what we have to the left right.
So this is the blueprint of what you see to the left there.
So notice that they all the same.
If you click the same, things happen.
So and also we can go ahead and make this smaller.
We can make everything smaller actually, so we can have more space and we can drag this out so we can
see more about the attributes for whatever is it that we clicked to left here in our window where we
are constructing our user interface.
All these attributes pertain to this.
Hello, world string, if you will.
I go to the corner here.
I have this new cursor that allows us allows me to make this bigger or smaller.
If I go to the right here, notice there's a lot of things.
One of the things that I can do, I can change the text instead of Hello world if I click there.
This is a text attribute.
If I change this to help me hit enter notice.
Now it says Hello me.
Now let's see if we want to make this change the size of our hello world or help me now that we've changed
it.
How do we do that.
Well, we can scroll down until we find size or faster.
We can see at the top here, there is this button here with a magnifying glass search.
Click there and start typing sized.
Let we do that says text size fourteen S.P..
OK, so now you can click here or you can just drop down and get a predefined size.
Let's say eighteen.
Well eighteen.
I was a bigger size.
And now how do we run this.
Because we have changed something real quick here.
We want to be able to run this will quick so we can see that things are indeed working at the top here.
You should have some sort of a emulator already picked up because we have done this in earlier videos.
If you don't just click there.
So go ahead and just pick one.
Let me go ahead and just click this button.
The run button there will take a few moments to start.
Android emulator, and voila, after a few moments, you should see this very nice application working
here.
So hello, me.
So we've changed the Hello World text to help me and we ran our application.
They should see hello me there.
Get back to our project here and close this one down.
What do we want to do?
Want to create something of our own.
So I'm going to go ahead and delete this so we can so we can go ahead and click and write, click and
say delete like that.
So now we have a clean canvas, if you will.
So what I want to do is want to add a button right in the middle here now where we get the button.
OK, let's go ahead and move it back here.
All right.
The buttons actually right away, it's to the left.
You can see we have palettes here.
We have common text buttons, so forth.
If you click on buttons, we see now something change.
Now, this is really small because I can also move back like this opens all kinds of different kind
of buttons.
Can you go to text?
Well, different kind of text and so forth or one of buttons.
So what do we do with just click one and drag and drop it put there in the middle?
Very good.
The moment we drop it there, I notice that we have issues here.
The reason why is because for every button we add or any UI element we add to our user interface, we
need to constrain it that way.
Android knows where to position this button when we run this application.
In fact, we look to the left here.
If you hover over to this reddish exclamation mark, if you have an over and click notice is going to
tell us this view is not constrained, it only has design time position.
So it will jump to zero zero at runtime unless you add constraints.
Well, what this means is if we leave this button as it is right now, when we run this application,
because Android won't know where to position it, it will go ahead and push it to zero zero position,
which is the top left corner.
In fact, let's go ahead and run this so you can see.
So I'm going to go ahead and run the rewind the application here.
I could stop and then run again, but now I can actually click this button here, which will stop and
rewind the app.
So click there.
I have it running again, so I'm going to just going ahead and say terminate and run again, if we look,
we should see that indeed our button is at the top left, which is not what we want.
So that tells us that we must always put constraints on.
So I'm going to go ahead and add constraints to add constraints.
All you do is hover over this left circle there and click and drag.
Notice we have this line here which allows us to constraint to a side in this case to go straight to
the left and then do the same to the right like this.
I can see now the button is constrained is it's always going to be in the middle horizontally if we
go ahead and we run again.
Aha.
You see, it is in the middle or horizontally.
Whatever we do, it's always going to be in the middle horizontally, which is good.
But what we want also is to make sure that it's in the middle vertically so we do the same constraint
up and down like this if we go ahead.
And right now I'm using this other button there to apply changes and restart activity.
And voila, now it's in the middle of the screen.
Very good.
So now we've added a button in the middle of the screen.
What we want to do next is to add some attributes are very important to our button.
Lets let's make this a little bit bigger.
First of all, let's go and close this down so we have more space.
Remember, if I click the button and go to attributes, click there.
Now we can change the attributes of this button.
Now notice here I have to clear this because of what's showing what I had previously searched for.
Look, once it clear our search bar there, now we see all these attributes for a button.
Now we can change the name of our button here because I don't want it to be button.
I want you to say something better.
Let's say show, name hit, enter.
Very good.
Like that.
Now it says show name.
Notice if I click away, then we change the context of our attributes.
Now it's about the all layout.
But if I want to go back, click.
And now we can see these are the attributes for our button.
The other thing we need to make sure is that we have an ID for our A button, which now says button.
That's fine.
We're making really good progress here.
And in the next video, we'll continue working on our very simple application here.