This course will be retired on July 14, 2025.
Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Build a Simple Android App with Java!
You have completed Build a Simple Android App with Java!
Preview
We just saw how to edit an existing TextView. Now let's see how to add a new one!
Documentation
- UI Overview
- View
- Supporting Different Densities - Excellent Video
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
Okay, that first TextView was an easy one,
it was already on the screen.
0:00
Now, let's see how we can add
another TextView to our layout.
0:04
Let's go back to the Design view.
0:08
On the left side of the Design view,
we find a palette.
0:11
The Palette has all sorts of Android
controls that we can drag and
0:15
drop into our layout.
0:18
Inside the Palette, components are split
into groups to make them easier to find.
0:20
For example, the Widgets group contains
some commonly used elements like buttons,
0:24
checkboxes, and progress bars.
0:29
Everything here in the Palette
is a type of Android view.
0:32
Now a view, in the Android sense,
0:36
is a rectangular area on the screen
that we can see and interact with.
0:38
These items in the Palette are all
specialized types of views,
0:42
kind of like how a motorcycle is
a specialized type of vehicle.
0:45
Inside the Text section,
find the view called TextView and
0:49
then click and drag it onto the screen.
0:53
Moving the TextView around,
we see blue arrows, dotted lines, and
0:55
borders that change depending
on where we move it.
1:00
This is because the TextView
will be placed relative to these
1:03
different areas of the screen.
1:06
We want ours to be centered vertically but
on the left hand side.
1:08
Let's move it until we see a horizontal
dotted line through the middle.
1:12
Also, notice how the orange box doesn't
really correspond to where I'm dragging my
1:18
TextView, this is likely a bug.
1:23
So I'm gonna place it and then pick
it back up, that looks a lot better.
1:26
Now, let's move it until we see a
horizontal dotted line through the middle,
1:32
which means we're centered vertically, and
1:36
a green line on the left, which means
we're aligned to the left edge.
1:38
Then let go of the mouse to drop it in and
there we go.
1:43
Now, let's change the text again.
1:46
Just like we did before, make sure
the TextView is selected and then, over in
1:48
the Properties pane, let's delete this
text and add a default fact to start with.
1:53
Let's say Ants stretch.
1:58
When they wake up in the morning,
and hit Enter.
2:03
Our text seems to be a little small for
the screen but
2:10
we can fix that by changing
the text size property.
2:13
Over in the Property pane,
let's set the text size property.
2:16
It doesn't look like it's visible here
in the quick select section, so let's
2:20
click View all properties and then scroll
down until we find the textSize property.
2:24
Then let's set the textSize to 24sp and
hit Enter.
2:33
Perfect, now we can
actually read our fun fact.
2:41
The sp at the end stands for
scale-independent pixels,
2:44
which is a relative unit that helps
your text look the same on devices with
2:48
different screen sizes and different pixel
densities, like regular versus HD screens.
2:51
One of the nice things about sp values and
why we use them for text
2:57
is that they also take into consideration
a user's preferences for font sizes.
3:01
A user who has a system
wide preference for
3:06
a larger font will have that
preference reflected in our app.
3:08
Now, since we added a textSize
here in the Design view,
3:12
do you think it added
anything in the XML view?
3:15
Sure enough.
3:20
We've got our new TextView and,
down here at the bottom,
3:21
we've got a row called android:textSize
and it's set to the value we entered.
3:23
We can also see that the text
property of this TextView
3:30
is set to the fun fact we entered as well.
3:33
Let's get back to the Design view.
3:35
And now that we know how to change
the textSize, pause me for a moment and
3:39
change the textSize of the Did you
know TextView to 24sp as well.
3:43
Okay, did you pause and do it?
3:48
Last chance.
3:50
All right, my turn.
3:52
I'll select the TextView,
find the textSize
3:54
property, type 24sp, and hit Enter.
3:58
Great job.
4:05
See if you can figure out how to
drag a button onto the screen and
4:06
center it horizontally along the bottom.
4:09
I'll show you how I do
it in the next video.
4:11
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up