Showing Revision 5 created 07/18/2016 by Udacity Robot.

1. Title:
   Change the TextView
2. Description:

3. 660 0:01 - 0:04
   Okay, so we've seen TextView code for
   the first time.
4. 3923 0:04 - 0:06
   >> But
   it's kind of hanging out in limbo.
5. 5911 0:06 - 0:09
   >> Right, we do need a space
   where we can house it.
6. 9025 0:09 - 0:11
   >> Yeah, that space is an IDE.
7. 10521 0:11 - 0:13
   >> There's that acronym again.
8. 12580 0:13 - 0:14
   What does it stand for again, Catherine?
9. 13721 0:14 - 0:16
   >> Integrated Development Environment
   >> Right, and
10. 16062 0:16 - 0:20
    we are going to be using
    Android Studio in this class.
11. 19660 0:20 - 0:22
    This is what it looks like.
12. 21650 0:22 - 0:23
    Still a little intimidating.
13. 23310 0:23 - 0:25
    >> Yeah.
    I think we might need something
14. 24870 0:25 - 0:28
    that will help our learner
    ramp up a little bit easier.
15. 27560 0:28 - 0:31
    >> Right, so we've been working
    on developing something that is
16. 30806 0:31 - 0:35
    Android Studio on training wheels,
    in the tradition of really convoluted
17. 34667 0:35 - 0:38
    acronyms in computer science,
    we are calling it XMLV.
18. 37568 0:38 - 0:39
    >> Which stands for XML Visualizer.
19. 39344 0:39 - 0:41
    >> So you write a little bit of XML?
20. 41250 0:41 - 0:42
    You get to see the output.
21. 41980 0:42 - 0:45
    You write some more,
    you get to see more output.
22. 44560 0:45 - 0:45
    >> Yeah.
23. 45190 0:45 - 0:46
    So let's go use it.
24. 46170 0:46 - 0:47
    >> Okay.
25. 47420 0:47 - 0:52
    >> Since this XML visualizer was
    created specifically for this course,
26. 51600 0:52 - 0:55
    it won't provide all the functionality
    that Android Studio supports.
27. 55280 0:55 - 0:58
    But eventually in the problem
    set of this lesson,
28. 57530 0:58 - 1:01
    we'll get you into Android Studio so
    you won't need this website anymore.
29. 62450 1:02 - 1:06
    A link is in the instructor notes
    If you want to follow along.
30. 65670 1:06 - 1:08
    For this code,
    the text says Happy Birthday.
31. 68110 1:08 - 1:12
    So when I look at the device it says,
    Happy Birthday.
32. 72190 1:12 - 1:15
    Now let's try to change the text
    to Happy Birthday, Kunal.
33. 76350 1:16 - 1:20
    And then when I zoom in on the device
    preview you see that it now says,
34. 79550 1:20 - 1:21
    Happy Birthday, Kunal.
35. 81270 1:21 - 1:24
    And what happens by trying to
    stand the width and the height.
36. 84250 1:24 - 1:28
    I'll pick some arbitrary
    values like the 300dp for
37. 87580 1:28 - 1:30
    the width and 500 for the height.
38. 90140 1:30 - 1:34
    And now in the preview pane, you see
    that the TextView is a lot bigger.
39. 95160 1:35 - 1:39
    The text though, however, is still
    the same size in the top left corner.
40. 100750 1:41 - 1:44
    Notice that for the width and
    height values of 300 and
41. 103890 1:44 - 1:48
    500 is followed by dp in each case.
42. 108400 1:48 - 1:51
    This is a unit of measure
    like centimeters or
43. 111000 1:51 - 1:55
    millimeters, that we use to describe
    the size of views on Android.
44. 115120 1:55 - 1:57
    As well as the distancing between views.
45. 118550 1:59 - 2:01
    The unit dp stands for
    density-independent pixels.
46. 122540 2:03 - 2:05
    Let me explain why we need that.
47. 124840 2:05 - 2:09
    Say these beautifully drawn rectangles
    represent different devices.
48. 129030 2:09 - 2:14
    They're the same physical size, but
    they differ in terms of resolution.
49. 134230 2:14 - 2:19
    This is a medium resolution device with
    a medium number of pixels on the screen,
50. 138980 2:19 - 2:23
    high resolution and
    extra-high resolution device.
51. 142580 2:23 - 2:27
    When I say pixel, I mean a phone screen
    is made up of many tiny squares,
52. 146540 2:27 - 2:30
    which are pixels, and they light up
    based on what you're looking at.
53. 150300 2:30 - 2:35
    So if I define the size of a view, for
    example, a button, to be 2 pixels tall
54. 154740 2:35 - 2:39
    by 2 pixels wide, this is what it would
    look like on a medium resolution device.
55. 159670 2:40 - 2:43
    On a high resolution device,
    it would also be 2 pixels by 2 pixels.
56. 163350 2:43 - 2:45
    But it's a little bit smaller,
57. 164850 2:45 - 2:49
    because there's a lot more pixels trying
    to be packed into this device, and
58. 169060 2:49 - 2:53
    then on an extra high resolution device
    where there's tons more pixels packed
59. 172680 2:53 - 2:57
    into this space,
    this button is actually pretty tiny.
60. 176720 2:57 - 2:58
    I can barely tap on it with my finger.
61. 178470 2:58 - 3:03
    I have to use edge of my finger or
    my fingernail to reach it.
62. 182520 3:03 - 3:05
    Just because I have extra
    high resolution device,
63. 184990 3:05 - 3:07
    doesn't mean I have a smaller finger.
64. 186790 3:07 - 3:10
    I still want to be able to tap
    the buttons on the screen.
65. 190060 3:10 - 3:13
    And that is why we have
    density-independent pixels.
66. 192730 3:13 - 3:16
    I can define my button to
    be 2dps tall by 2dps wide.
67. 195720 3:16 - 3:19
    This is what it would look like
    across the different devices.
68. 199390 3:19 - 3:22
    It is the same physical size, but
69. 201800 3:22 - 3:26
    under the hood Android is mapping
    it to a different number of pixels.
70. 206090 3:26 - 3:29
    You don't have to worry about any of
    that logic, all you need to remember
71. 209360 3:29 - 3:34
    is that you need to define your
    sizes in terms of dp values.
72. 213520 3:34 - 3:38
    When designing your apps, we recommend
    that all touch targets like buttons
73. 218040 3:38 - 3:41
    should be at least 48dps tall and wide.
74. 221160 3:41 - 3:44
    Notice that it says 48dps and
    not 48 pixels,
75. 224100 3:44 - 3:48
    otherwise it would be really tiny on
    this extra high resolution device.
76. 227930 3:48 - 3:51
    This will make your app easy to use for
    everyone.
77. 230730 3:51 - 3:53
    So with all of this knowledge,
    I want you to try and
78. 233489 3:53 - 3:55
    change the TextView code now.
79. 235213 3:55 - 4:00
    You're going to be writing your very
    first lines of XML, how exciting.
80. 239890 4:00 - 4:03
    So first try to change
    the text in the TextView.
81. 242700 4:03 - 4:05
    And then try to change
    the sides of the TextView.
82. 245950 4:06 - 4:10
    Then I want you to try to
    create an error sad face.
83. 249700 4:10 - 4:12
    And then I want you to undo it,
    happy face.