Adding a TextView4:15 with Ben Deitch
We just saw how to edit an existing TextView. Now let's see how to add a new one!
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 up