-
Title:
Change the TextView
-
Description:
-
Okay, so we've seen TextView code for
the first time.
-
>> But
it's kind of hanging out in limbo.
-
>> Right, we do need a space
where we can house it.
-
>> Yeah, that space is an IDE.
-
>> There's that acronym again.
-
What does it stand for again, Catherine?
-
>> Integrated Development Environment
>> Right, and
-
we are going to be using
Android Studio in this class.
-
This is what it looks like.
-
Still a little intimidating.
-
>> Yeah.
I think we might need something
-
that will help our learner
ramp up a little bit easier.
-
>> Right, so we've been working
on developing something that is
-
Android Studio on training wheels,
in the tradition of really convoluted
-
acronyms in computer science,
we are calling it XMLV.
-
>> Which stands for XML Visualizer.
-
>> So you write a little bit of XML?
-
You get to see the output.
-
You write some more,
you get to see more output.
-
>> Yeah.
-
So let's go use it.
-
>> Okay.
-
>> Since this XML visualizer was
created specifically for this course,
-
it won't provide all the functionality
that Android Studio supports.
-
But eventually in the problem
set of this lesson,
-
we'll get you into Android Studio so
you won't need this website anymore.
-
A link is in the instructor notes
If you want to follow along.
-
For this code,
the text says Happy Birthday.
-
So when I look at the device it says,
Happy Birthday.
-
Now let's try to change the text
to Happy Birthday, Kunal.
-
And then when I zoom in on the device
preview you see that it now says,
-
Happy Birthday, Kunal.
-
And what happens by trying to
stand the width and the height.
-
I'll pick some arbitrary
values like the 300dp for
-
the width and 500 for the height.
-
And now in the preview pane, you see
that the TextView is a lot bigger.
-
The text though, however, is still
the same size in the top left corner.
-
Notice that for the width and
height values of 300 and
-
500 is followed by dp in each case.
-
This is a unit of measure
like centimeters or
-
millimeters, that we use to describe
the size of views on Android.
-
As well as the distancing between views.
-
The unit dp stands for
density-independent pixels.
-
Let me explain why we need that.
-
Say these beautifully drawn rectangles
represent different devices.
-
They're the same physical size, but
they differ in terms of resolution.
-
This is a medium resolution device with
a medium number of pixels on the screen,
-
high resolution and
extra-high resolution device.
-
When I say pixel, I mean a phone screen
is made up of many tiny squares,
-
which are pixels, and they light up
based on what you're looking at.
-
So if I define the size of a view, for
example, a button, to be 2 pixels tall
-
by 2 pixels wide, this is what it would
look like on a medium resolution device.
-
On a high resolution device,
it would also be 2 pixels by 2 pixels.
-
But it's a little bit smaller,
-
because there's a lot more pixels trying
to be packed into this device, and
-
then on an extra high resolution device
where there's tons more pixels packed
-
into this space,
this button is actually pretty tiny.
-
I can barely tap on it with my finger.
-
I have to use edge of my finger or
my fingernail to reach it.
-
Just because I have extra
high resolution device,
-
doesn't mean I have a smaller finger.
-
I still want to be able to tap
the buttons on the screen.
-
And that is why we have
density-independent pixels.
-
I can define my button to
be 2dps tall by 2dps wide.
-
This is what it would look like
across the different devices.
-
It is the same physical size, but
-
under the hood Android is mapping
it to a different number of pixels.
-
You don't have to worry about any of
that logic, all you need to remember
-
is that you need to define your
sizes in terms of dp values.
-
When designing your apps, we recommend
that all touch targets like buttons
-
should be at least 48dps tall and wide.
-
Notice that it says 48dps and
not 48 pixels,
-
otherwise it would be really tiny on
this extra high resolution device.
-
This will make your app easy to use for
everyone.
-
So with all of this knowledge,
I want you to try and
-
change the TextView code now.
-
You're going to be writing your very
first lines of XML, how exciting.
-
So first try to change
the text in the TextView.
-
And then try to change
the sides of the TextView.
-
Then I want you to try to
create an error sad face.
-
And then I want you to undo it,
happy face.