Hire everyone in this tutorial we're going to go ahead and create another Android application.
So just click on this.
Start in your Android studio project here and then for the name of the application and just type in
here app number 43.
As you can see here and here you can specify the company domain package name and project location and
then click on next here I'll choose API 16 Android 4.1 jellybean for a mini SDK next Blancher activity.
Next aren't here.
Don't try to change anything.
And then click can finish.
OK.
Now let's actually did it this hello world takes you here.
And as you can see here I have this floating action button here and I don't just want to actually delete
this floating action button for this application.
So just click on this activity underline made it examine inside this lay out a folder and then select
this fluty an action button and then press on delete key on your keyboard.
So I'll ask you to go back and say this content underline underline mean that example and here are you
want to design the user interface of our application.
Now let's actually tracked a linear layout vertical into these relatively out here.
Just put it at the center of this relatively out here.
OK.
And now let's actually track of vertical scroll view.
Contained in this folder.
You have this vertical scroll view.
OK.
Just select it and put it inside.
These are linearly outwards equal here and put it at the center of this linearly with vertical.
So as you can see here are the lay out gravity of this scroll view is actually the center horizontal.
OK.
And now let's actually track and order linearly especially con.
So as you know this scroll you actually only accepts one child.
OK.
So we just need to track another linearly out of vertical into this scroll you hear.
And now we can actually put our own user interface components inside these linearly out vertical that
is inside this scroll view.
OK.
Now let's actually select this scroll view here.
OK.
And as you can see Italy out of it is much apparent and the layout height is much apparent.
OK.
Now let's actually track a linearly out horizontal into this linearly or two vertical here.
OK.
So this is the linearly or horizontal.
And now I want to actually track two buttons inside this linearly and horizontal that is inside these
linearly as vertical OK.
So let's actually drag a button as you can see we have this button inside these widgets folder.
OK select it and put it inside these linearly as horizontal here.
OK.
And let's actually drag another button.
So just select it and put it inside this linearly out horizontal here.
OK.
Now let's ask you to select this first button here.
Double click on it and for the text just type in here let's make let's make a directory to downloads
folder.
OK.
And for the ID just type in here Pythian download directory.
OK.
And then press Enter key on your keyboard.
So now let's actually select this a second button here as you can see.
Now let's actually find the ID attribute that is that is actually related to this second button and
for the ID just type in here Pythian music directory and then person enter key on your keyboard.
And for the text just typing here let's make a directory to music folder.
Let's make it a directory to music.
Folder and then person enter key on your keyboard.
So now as you can see we can see these two buttons very well.
So just for like I said if both of these buttons here as you can see inside this componentry section
and for the layout we assign the value 0.
And for the lay out rate is the value of 50.
So now we can see these two buttons.
Well OK.
So now let's actually track and are there linearly out horizontal into these linearly as vertical So
as you can see here we assigned the value 0 for the layout of these two buttons.
OK.
And we assign the value in about 50 for the weight of these two buttons.
So this.
So these buttons the bits of these buttons is actually it's going to actually take only a half of its
parent.
OK.
Half of the weight of this patent which is this linearly held horizontally.
So hopefully that makes sense.
And as you can see if you have another linearly or horizontal and again essentially direct and order
a button inside this linearly or horizontal here and this actually the right and other button into these
linearly out horizontal.
So as you can see here we have two buttons here.
Now let's actually select this first button here as you can see we have this button here.
Double click on it and for the text just type in here let's make a directory to documents folder and
for the ID just type in here PTEN documents
folder.
OK.
And then press that enter key on your keyboard.
Now let's actually select this a second button here and now let's actually find the ID attribute that
is related to this button for the ID just type in here between ringtones
folder and then present in Turkey on your keyboard.
And for the text as you can see just type in here let's make a directory.
Let's make a directory to ringtones folder
and then press enter key on your keyboard.
OK.
So now again we cannot see these two buttons very well so just select both of them.
And then for the layout we assign the value zero and for the layout with fate assigned the value 50
or 0.5.
OK.
So hopefully that makes sense.
Now let's actually like and how they are linearly and horizontal into these linearly as vertical here.
Okay.
So as you can see we have this linearly outpolls until selected and put it inside this linearly out
vertical here.
Okay.
And then actually drag a button into this linearly or horizontal here and now essentially to I another
button into this linearly and horizontal here.
So now let's actually to select this first the bottom here.
Double click on it and for the text just type in here let's make our directory to both podcasts folder
OK.
And for the ID just type in here PTEN between podcasts folder and then person enter key on your keyboard.
So now let's actually select the second part in here and now again it's actually find the ID attribute
inside this properties section.
So as you can see here this is the this is the the id attribute for the ID just type in here between
movies folder
and then press enter key on your keyboard.
And now let's actually find the text attribute that is related to the Spartan.
So just select it and for the text just type in here let's make a directory to movies folder and then
press enter key on your keyboard.
So as you can see we cannot see these two buttons very well.
So again just select both of them and for that they have to be assigned the value 0 and 4 for the lay
out weight assigned a value of 50 or 0.5.
Now let's actually drag another button into these linearly out of Artecoll here as you can see we have
this linearly it's vertical and inside linearly nearly vertical if you have 3 linearly or horizontal.
OK.
As you can see here.
So now I want to actually drag a button into this in here linearly Ellsworthy call here as you can see
here.
So if you have this button here and now let's actually make it assigned the value you match parent for
the lay out feat of the Spartan as you can see here.
So I just selected and assign a value match palette as you can see here.
So just double click on it and for the text just type in here let's make our directory to pictures folder
and for the ID as you can see here and divided between pictures folder and then person enter key on
your keyboard.
And again let's actually select another button here inside this little folder and put it inside this
linearly out vertical.
Here and now assign the value of match parent for the layout of this spot.
As you can see here.
Double click on it and for the text assigned a value.
Let's make a direct directory to LRM folder alarm's folder.
And for the ID assign the value between alarm's folder and then a person enter key on your keyboard.
OK.
Now let's actually drag a text field into this linearly out vertical here.
OK.
So first of all inside is textfield folder as you can see we have these takes here.
OK.
So just select this plain text field here as you can see.
Select it and put it in so it is linearly outwards to God.
OK.
And now for the layout it's assigned the value match parent OK and double click on it.
And as you can see assign the value EDT value for the ID of these takes.
OK.
And then person entelechy on your keyboard.
Now let's actually drag our button into these linear layouts vertical.
So just select the spot in here and put it inside this nearly vertical.
Here and again are assigned a value match parent for the layout of this button.
As you can see here WTG and important.
And for the text just that just type in here save it to documents folder in SD card and for the ID just
type in here between save FOID and then person until key on your keyboard.
And now let's actually track or take a text view into this linearly at vertical.
So as you can see here we have this large the X view here.
Just select it and put it inside this linear linearly out vertical here.
OK.
And again assign the value of match parent for the lead out of this text view.
OK.
And now just double click and this takes few here and delete the text of this text view.
And for the ID just type in here takes the value and then press enter key on your keyboard.
So now let's actually drag a button into this linearly or vertical.
Here.
OK.
So as you can see here we have this button here again assigned a value match Pallant for the layout
of the Spartan.
And now double click on the spot in here and for the text just type in here.
Retrieve the information from SD card and for the ID just typing here PTEN retrieve
the info OK and then person enter key on your keyboard.
So now let's actually change the background color of these linearly outward vertical here as you can
see here.
That's actually to change the background of color.
So here we have this background color as you can see just typing here.
Hash tag 0 0 0 0 F F and then precedented g on your keyboard.
So as you can see here now the background color is blue.
So now let's actually run our project and see the design of our user interface.
So now as you can see our application is running on this emulator.
And remember if you want to actually run your application first you need to actually did it the block
of code that is related to the floating action pattern because we don't have that Flutey in action but
in our application we need to actually delete a data block of code that is inside of these uncreate.
So if you have that block of code in your uncreate benefit delete that block of code and then run your
application.
And here as you can see we cannot easily see this a text field.
And this takes view that they actually put inside this nearly vertical.
So now as you can see it just selectees textfield here as you can see.
And now for the background as you can see here for the background color.
Assign the value hash that F F F and as you can see now the background color of these textfield is white
and then this actually selectees takes view here again for the background color assigned the value hashtag
hashtag.
F F F and then press on until G on your keyboard.
Now that back in uncolored of this text view is white.
Now let's put it on our project again and see what happens.
So now as you can see now the background color of this takes field and this takes view is white.
OK.
Now let's actually change the background color of this relatively out that this linearly vertical is
inside of these relatively OK.
So just select is relatively out here and for the background color as you can see here we have this
black attribute here selected and assigned a value hash tag and just type in here.
0 0 0 2 3 4.
So now as you can see the background color of these relatively has actually changed.
OK.
So let's actually do it on our project again and let's see actually the design of our application.
So now our application is running on this emulator here and now we can see the design of our application.
Now we can see that the color of these relatively is actually changed and this is much more and I said
OK so let's ask you to go back and say this content underline minute example and now are going to actually
putting some other components inside these linearly out vertical.
So now let's actually drag an image view into this linearly Ellsworthy call here.
So just just select this image view here and then put it inside this linearly out vertical here as you
can see here.
OK.
Just put it inside this linearly Ellsworthy called and then and now this actually change some of the
properties of this image view.
Now as you can see if you have these layouts gravity OK and assigned value center horizontal for the
lay of gravity of this image view.
OK.
Now as you can see this image is at the center.
OK horizontal.
Now for the layout we assign the value of 50.
And for the layout height assigned a value of 50.
OK.
As you can see here as I like this lay out right here and now we can actually assign the value 054 the
layout height.
OK.
Or you can actually change this to 100 OK with 100 and and layers height 100.
And then.
Now let's actually assign an ID to this image view.
So just select this idea here and then assign the value I N G and Emman.
Now I want to actually copy and paste an image into my into this triable folder that we have in our
project structure.
So now as you can see I want to actually copy and paste an image inside this triable folder.
So let's actually go back on my desktop here as you can see I have this image here.
So I just need to right click on this image.
And then asked selectees copy tiger that's pian G.
And now I just need to select this tribal folder right click on it and then select the paste option
here.
And now I just need to click on OK.
So now I have this a tiger image in my triable folder.
OK.
And now again just let me actually to make this design area of idea.
Now I can just double click on this image view here and then I select the spots in here and then just
click on the project map here and then I'll close this colored folder.
And now I can actually search for my tiger image.
So here I can just type in Tiger and now as you can see this is my tiger.
And then click on OK.
So now we have this tiger image here inside this image view.
Now let's actually select the spot in here.
Inside these widgets folder and put it inside this linearly out vertical here.
OK.
So now we have this button.
And now it's actually assigned a value center horizontal for the layout gravity of the Spartan.
OK.
So now as you can see the spotting is actually at the center horizontal of this linearly outhaul linearly
as vertical as you can see here.
That's actually our selected spot in here.
And for the ID Let's actually find the ID attribute.
Now for the ID assigned the value PTEN allow access pictures and then present enter key on your keyboard.
Now let's actually find the text attributes of this button.
Now you can see here this is the text attribute just selected and assigned a value just type in here
allow access pictures in SD card.
OK so as you can see here for takes for the taste of these button.
I assign the value allow access pictures in SD card.
OK.
And then press that entity on your keyboard.
So now let's actually in on our project again in order to see the design of our application.
So now as you can see our application is running on this emulator and now we can see this image here
and we can see the spot and here allow access pictures in SD card.
OK so now let's actually go back and say this content line made that example.
Now let's actually track our horizontal scroll view into this linearly out vertical.
So as you can see here now inside these containers for there we have these horizontal scroll view here
just the selected and put it inside this linearly out vertical here.
And now let's actually select this linearly as horizontal inside these layouts folder.
So now put it inside this horizontal scroll view here as you can see here.
OK so now as you can see our linearly horizontal.
Now inside these horizontal scroll view.
And then let's actually select this horizontal scroll view.
And for the lay out gravity assigned the values center horizontally.
OK.
Now as you can see this horizontal scroll view is horizontally centered inside this little linearly
out vertical.
And now as you can see this is our linearly out horizontal and now are just selectees horizontal scroll
view.
That's actually find the idea and attributes.
Now as you can see the idea of this horizontal scroll view is horizontal scroll view.
Now selectees linearly horizontal.
And let's actually find the ID attribute and for the ID assign the value linearly out horizontal and
then press enter key on your keyboard.
OK.
Now let's actually find the image switcher inside these experts for there.
So as you can see here inside these experts there we have this image switcher component.
Just select it and put it inside these linearly out where the call here.
OK.
And now let's actually find out gravity attribute that is related to this image suture and just assigned
a value center horizontal for this for the gravity of this image switcher.
OK.
And now let's actually find the idea attribute of this image.
As you can see here.
The idea is image treater OK.
So just leave it as default and now as you can see the design of our user interface is actually finished.
And let's actually run our project again in order to see the design of our application.
So now as you can see here our application is running and this emulator.
And here is the design of our user interface of this application.
OK.
So now let's actually go back inside this main activity that I find here and then let's actually delete
this.
These are lines of code that are related to the Options menu.
OK so now I'm going to actually create another class inside our project.