- Getting to Know Our Tools 4:52
- Android Tools Overview 5 questions
- Editing a Layout File 4:52
- Changing Text in a Layout 1 objective
- Adding a TextView 4:15
- Changing Text Size 1 objective
- Adding a Button 4:31
- Adding a Button 1 objective
- Setting Colors 5:26
- Setting Colors 2 objectives
- Setting Padding 1:13
- Setting a Fullscreen Theme 3:30
- Setting Padding 1 objective
Preview
Video Player
00:00
00:00
Setting a Fullscreen Theme
3:30The last thing we need to do to complete our layout is get rid of the ActionBar at the top of the screen. Let's see how to do that using an Android theme!
The last thing we need to do is get rid of
this bar here at the top of our screen.
0:00
This is called the action bar,
and it's useful for
0:05
navigating between multiple screens,
or adding actions in the app.
0:07
But we don't need any of that for
this app, so we can safely remove it.
0:12
It's possible to hide
the action bar in Java code.
0:15
But a better solution for us is to
remove it completely using an app theme.
0:18
An app theme is a generalized style that
changes how certain things look in an app.
0:23
We'll cover this in much more
detail in later projects,
0:28
including how to create our own theme.
0:31
But here we just want to use a default
theme that gets ride of the action bar.
0:33
We set the theme for
our app in a file called Android Manifest.
0:38
Let's open the project pane.
0:42
And if we're still looking at our
project from the Android perspective,
0:45
we can find this file in the manifest
folder, and double click it to open it.
0:48
This file contains meta information about
our app, like its icon, name, and theme.
0:54
It's a very important file
in any Android project and
1:02
we'll talk more about it in later videos.
1:05
But to change the theme we need
to do some investigative work.
1:07
Notice that the theme starts with
another prefix, at style slash.
1:11
Over in the project pane let's expand the
res folder and then the values directory.
1:16
Here we have a styles.xml,
and if we open it, sure
1:23
enough there's the value for AppTheme,
which is the name we saw in the manifest.
1:28
This theme is pretty empty, but
it actually gets most of its styling from
1:34
the parent defined here,
Theme.AppCompat.Light.DarkActionBar.
1:39
We're going to change this parent
to something else that doesn't
1:44
have an action bar.
1:47
Now we could just use a system
theme instead our own app theme.
1:48
But if we do it this way, where app
theme has a system theme as a parent,
1:52
then we can inherit everything
from that system theme and
1:57
customize only the parts
we'd like to be different.
2:00
We won't add anything custom in this
project, but we will in later projects.
2:03
Anyhow, we can use code
completion to pick a new theme.
2:07
Let's delete dark action bar.
2:11
And then with the cursor right here after
this last period press Control Space.
2:14
This gives us some suggestions
based on what we've already typed.
2:20
Since we're trying to get rid of
the action bar, let's select this
2:24
one, Theme.AppCompat.Light.NoActionBar.
2:31
Then let's head back to our layout,
click on the design tab, and there we go.
2:34
No more action bar.
2:42
Now let's run our project to make
sure it still works as expected.
2:44
Perfect, this is exactly
what we wanted to see.
2:51
We've added some padding around the edges,
gotten rid of the action bar, and
2:54
now it's really starting
to look like the mockups.
2:58
Nice work.
3:01
We made quite a few changes here.
3:02
Let's take a short break to review
before moving onto the code.
3:04
We've learned a lot about working
with our IDE, and the emulator.
3:07
Then we added some views to our layout,
we added a text view to display a fun fact
3:12
and a button that we'll tap
to show a new fun fact.
3:16
Then we saw how to change some colors and
modify padding.
3:20
As well as how to change our theme.
3:23
Coming up next, we'll add some code to our
button to make it actually do something.
3:25