(typing)
Now there are a number of different layouts that
you can use to create app screens in Android Studio,
and we're gonna have a quick look
at a few others a little bit later.
Using layouts to position items on the screen
used to be quite complicated,
when you wanted to line things up horizontally
and vertically, to get the screen just the way you want.
But when they released Android Nougat,
Google introduced the ConstraintLayout,
and that basically replaces the old RelativeLayout
and is also a good alternative to many of the older layouts.
Now we're going to discuss the older layouts later
so that you're familiar with them.
You may have to work on updating older code
so it's good to at least be familiar with
some of these other layouts.
But for most of the examples in this course,
I'm gonna be using the new ConstraintLayout
and the trusty LinearLayout, when creating layout screens.
Now Google didn't just introduce a new type of layout,
they also completely revamped the Android Studio
Layout Designer to handle it.
So we're gonna start a new project
and get into discovering how to use the Layout Designer.
Now the first project we're gonna create
isn't our button click app, it's just something
that we're gonna have a play with the designer,
and probably get it into a right mess.
Now the only way, though, to learn how
to use the designer is to try it out.
So I'm not even going to run this app,
I'm just gonna be placing things on the screen,
moving them around, and showing you
how to put things where you want them
and have them stay there.
And that's why I said we were going to play with it.
So make sure you do have fun.
But before we start that, I just wanted to point out that
one of the best widgets for demonstrating this
is an ImageView, and that's because
it's a very visual component
and you can easily see it on the screen.
So I'm going to be adding an ImageView to our layout.
Now an ImageView without an image
isn't very interesting, though.
So the first thing you'll want to do
is start by downloading the sample images
that I've included in the resources section for this video.
Now you can actually get them by moving your mouse
up to the top left of this video
and clicking on the 3-bar menu icon
above Resources available.
And that will slide out a panel and you'll see
the two resources, in this case
ball_640x480.jpg
and also ball_100x100.jpg.
So download those files and save them
onto your hard drive, and then click the X above
the tooltip when you've done that
and you're ready to continue with this video.
Now you can, of course, use any image that you want.
So by all means use one
of your own pictures, images, if you'd prefer.
One thing to note, though, is that
there's a really odd peculiarity
in Android Studio, and that's that it doesn't like
images that have capital letters in the filename.
Now you can only use the characters 0 to 9
and lowercase a to z, as well as the dash,
underscore, and full stop.
Now you might be wondering why that is the case
but in fact there's a good reason for this.
And the reason is that filenames
in Windows aren't case sensitive,
in other words Ball.jpg with a capital B
would be the same file as ball.jpg with a lowercase b.
However, on Linux or OS X, Mac OS X,
they would actually be two different files.
So it would be very easy to produce
a project on one operating system
that ultimately wouldn't work on another operating system.
So rather than building a complex set of checking,
Google just made the rule that upper-case letters
aren't allowed, which makes everyone's life easier.
So bear that in mind when you create any type
of resource in Android Studio, including your images.
You should really be using just lowercase letters.
Now I'd also suggest if you are intending to use
your own images, that you don't use a full HD,
in other words a 1920 by 1080 image,
remembering this is gonna be viewed
on a 3 inch wide screen.
Alright so hopefully at this point
you've got the image file ready.
It's time to create our test project.
So I've got Android Studio started now
as you can see on the screen.
I'm going to click on Start a new Android Studio project.
Now we're going to be playing with a designer
a bit like a child with a box of crayons.
So for that reason I'm gonna call this project Playing.
Now if you make a right mess, and
frankly I hope that you do
because it shows that you've been experimenting,
then you can create a new project and call it
Playing 2 or Playing 3, etc.
And also you can make a note of the project location
which you can see over here at the bottom of the screen
and you can use your file manager
to delete the entire Playing directory
if you wish before starting again.
That's entirely up to you.
Now the company domain should have been remembered
from last time so I'm going to leave
that as to what it was, learnprogramming.academy.
Now you of course are free to use your own domain
there if you prefer, but one thing to bear in mind
is that my sample code
will be using learnprogramming.academy.
So using something different can make it harder
for you to use differencing tools
on the projects when comparing your source code with mine.
Now I'm going to be covering that later in this course,
so if you want to keep things simple
then use the same domain name
that I'm using here, learnprogramming.academy.
So the project location should have been filled in
for you as it was for me on the screen then,
but you can change that
to any suitable directory, if you prefer.
Now the last thing you have to check on this screen
is the box labelled Include Kotlin support,
and you can see over here that,
that is checked by default.
If you don't tick that box, Android Studio's
gonna generate Java code instead of Kotlin.
Now there's no difference in designing layouts
whether you're using Java or Kotlin,
so this video is the same for
my Java and Kotlin Android courses.
So if you're actually in my Java Android course,
then in fact you'd want to take the checkbox off,
but if you're in the Kotlin course you want to
click that to include Kotlin support.
And by the way it's perfectly possible to mix
Java and Kotlin in the same project,
in which case you'd tick the box
if you were deciding to use a Java project
to also include Kotlin support.
For now though I suggest that if you are
in the Java course you leave it un-ticked for Java
and ticked for Kotlin.
So I'm going to click on Next.
So on this screen I'm going
to choose API 17 as the default,
as I've explained in a previous video.
Now we don't want any of these other options,
so leave them all unchecked and click on Next.
Now for our purposes here, we're going to use
the Empty Activity and that's highlighted
by default, but if not, check on that
and click on Next again.
Now there's nothing to change on this next screen
but you do want to make sure that the two boxes,
Generate Layout File. the check box to the left there,
and Backwards Compatibility (AppCompat),
you want to make sure that they're both checked,
as they are in this case.
And in terms of what they do,
well Generate Layout function
creates a layout file for you, and if you
un-tick it, you'll just have
to create the layout from scratch.
Now that actually isn't hard to do,
and in fact in future videos we'll be
creating another layout later,
but why create work at this stage of the course.
And the Backwards Compatibility box, or the checked box,
that causes Android Studio to use the AppCompat library
and that's so that your code will work
on earlier versions of Android, even if they use
features that were introduced in later versions.
There's very rarely a reason to un-tick this,
so I'm going to leave it checked.
Now the suggested names for the Activity and Layout,
MainActivity and activity_main, are fine.
So I'm now going to click on Finish.
Now Android Studio is now in the process of
creating the project and you can see
that the build progress, or
the build progress rather, as it does that.
And I'm running at this stage, as you can see,
a beta version of Android Studio 3.
So it's a little bit slower than
what the final release will be,
but we'll give it a moment to finish.
Alright, so you can see down the bottom right hand corner
that it's working away and the gradle build is running
and it's actually indexing a few files.
It actually does quite a bit of stuff,
even after the editing window has appeared.
And it's a good idea not to do too much
until all that's finished.
And you can see now, down the bottom right hand corner
of the screen, the progress bar has disappeared
and for all intents and purposes now, it's finished
setting things up and we're ready to go.
Alright so, there's a few things now
that I want to talk about with the Layout Designer.
And firstly, experiment and try things out.
Make a mess of it all and start again, maybe more than once.
You won't actually do any harm and you
can always delete the project directories
when you've made a right mess of things.
And if you're going to do that you'd obviously
want to shut down Android Studio
before you deleted anything.
Now it's particularly important to experiment
with the Layout Designer and
that's because it changes so much.
Now Google introduced this new Layout Designer
in Android Studio 2.2, back in 2016.
And personally. I've lost count of how many changes
they've made to it through to version 2.3.3,
and now, what we're running, Android Studio 3.
Now we're actually working
at the cutting edge of mobile technology
and Google are constantly changing things.
Now something that works in a certain way today,
may very well not work in that way
or may work differently tomorrow.
Now we do record videos frequently in this course,
but if we try to keep up with all the changes,
we'd never get any new content added.
As it turns out I'm re-recording these videos
in August and September because Android Studio's
Layout Designer is now very different
to what it was back in February 2017.
Now that very well may make life "interesting"
but I don't want you to feel sorry for me.
It's far harder for you!
Now you're having to learn how
to use a development environment that's changing
all the time, and frankly that's certainly not easy,
when you're learning
something new like Android.
Myself and JP, we're so used to all this,
sometimes we barely notice a change.
But when you're starting out and you haven't
had much experience in the software
or in Android in general, it can get very confusing.
Now there's not really a lot you can do about this,
other than learning to live with it and experimenting.
Now there is something we can do to help,
and that's to explain what's going on.
So in these videos in this section of the course,
I won't just be showing you a series of keys to press
or operations to perform, I'm going
to be explaining why you're doing what you're doing.
That way you'll develop an understanding
of what's going on, why you're doing certain things,
and what's happening when you do.
Now when you really understand how it's all working,
change is much easier to deal with.
Alright, so that's what I'm going to be doing.
What you can do though, is experiment, try things out.
You know, if you're not sure what a button
on the toolbar does, one of these button up here,
then just click one and see what happens when you click it.
What actually pops up on the screen when that happens,
and just really experiment with the various buttons
to see what happens when you do it.
What I can guarantee, is one thing.
It won't damage your computer.
The very worst thing that will happen
is that you will do strange things to the project
and may have to start over again from scratch.
But when you're learning, going through it
all again is a good thing.
Alright, now for the good news.
What I've been saying really only applies
to the Layout Designer.
The Android code base is far more stable,
and that changes far less frequently.
Now there are changes that affect the code,
things like annotations that we'll be looking at.
But generally, the code side of things,
well that doesn't change very often.
So it's not going to be as difficult
as I may have implied just now.
It's just that this visual Layout Designer
is the thing that changes so often.
Alright, so let's finish this video here,
and in the next video we'll start getting stuck in
and talking more about, and using, the Layout Designer.
See you in the next video.