- Getting to Know Our Tools 5:22
- Android Tools Overview 5 questions
- Editing a Layout File 4:58
- Changing Text in a Layout 1 objective
- Adding a TextView 3:55
- Changing Text Size 1 objective
- Adding a Button 4:30
- Adding a Button 1 objective
- Setting Colors 5:48
- Setting Colors 2 objectives
- Setting Padding 1:14
- Setting a Fullscreen Theme 3:38
- Setting Padding 1 objective
Preview
Video Player
00:00
00:00
Setting a Fullscreen Theme
3:38The 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:08
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 but
0:16
a better solution for us is to remove
it completely using an app theme.
0:19
An app theme is a generalized style that
changes how certain things look in an app.
0:24
We'll cover this in much more
detail in later projects
0:30
including how to create our own theme.
0:33
But here, we just want to use a default
theme that gets rid of the action bar.
0:35
We set the theme for our app in
a special file called Android manifest.
0:40
Over here on the Project pane,
if we're still looking at our project from
0:45
the Android perspective, we can find
this file in the manifests folder.
0:49
And double click to open it.
0:54
This file contains meta information about
our app like its icon, name and theme.
0:57
It's a very important file
in any Android project.
1:05
And we'll talk more about
it in later videos.
1:08
But to change the theme,
we need to do some investigative work.
1:11
Notice that the theme starts
with another prefix, @style.
1:15
Over in the Project pane, let's expand the
res folder and then the values directory.
1:20
Here, we have a styles .xml and
if we open it, sure enough,
1:26
there is the value for app theme which
is the name we saw in the manifest.
1:31
This theme is pretty empty.
1:36
But it actually gets most of its
styling from the parent defined here,
1:38
Theme.AppCompat.Light.DarkActionBar.
1:42
We're going to change this parent
to something else that doesn't have
1:46
an action bar.
1:49
Now we could just use a system
theme instead of our own app theme.
1:51
But if we do it this way where app
theme has a system theme as a parent,
1:55
then we can inherit everything
from that system theme and
2:00
customize only the parts
we'd like to be different.
2:03
We won't add anything custom in this
project but we will in later projects.
2:06
Anyhow, we can use code
completion to pick a new theme.
2:11
Let's delete DarkActionBar and
2:15
then with the cursor right here after
this last period, press Ctrl+Space.
2:18
This gives us suggestions based
on what we've already types.
2:25
Since we're trying to get
rid of the action bar,
2:29
let's select this one,
Theme.AppCompact.Light.NoActionBar.
2:31
And you hit Escape to
close the documentation.
2:38
Then, let's head back to our layout.
2:41
Hide the Project pane, and
there we go, no action bar.
2:46
Now let's run our project to make
sure it still works as expected.
2:50
Perfect, this is exactly
what we wanted to see.
2:59
We've added some padding around the edges,
gotten rid of the action bar, and
3:02
now it's really starting
to look like the mock ups.
3:06
Nice work.
3:09
We've made a lot of changes here.
3:11
Let's take a short break to review
before moving on to the code.
3:13
We learned a lot about working with
our IDE [LAUGH] and the emulator.
3:16
Then, we added some views to our layout,
we added a text view to display a fun fact
3:20
and a button that we'll tap
to show a new fun fact.
3:25
Then, we saw how to change some colors and
3:29
modify padding,
as well as how to change our theme.
3:30
Coming up next,
3:34
we'll add some code to our button [LAUGH]
to make it actually do something.
3:34