Working With Labels

You’ve probably become pretty familiar with how to add pictures and colorful objects to your display, but now you may be wondering how to add text?

The activity editor allows you to add text to a display by dropping “Labels” onto your activity and then setting attributes of the label to make it say just what you want it to say.

To get started with labels, let’s go back to our basic new activity.  Remember the blue background with the yellow square?  I’m going to start with this activity.  Here’s what it looks like in the editor before I get started.

Blue activity yellow square

Now, let’s go ahead and add some words to this display.  Nothing crazy, just enough to get you going.  To do so, what I’m going to do is click the “+” button (remember to be in “edit mode” on your activity by clicking “Edit” first).

When I click the “+” button, the “Add Item to Activity” window displays.

Add Item on Blue Background

From here, tap “Label”.  When you do so a label displays on your blue background with the words “Your Text Here” filled in.

Activity Blue Background White Your Text Here Label

OK, so far so good.  Now, like anything else, you can move the label anywhere you want it using your fingers.  You can even stretch it to make it larger as I’ve done below.

Activity With Larger Label

OK!!  So far so good.  We’ve got text on our display.  But, what if we want it to say something better than “Your Text Here”?  Well, notice in my picture above that the text is surrounded by a yellow rectangle.  That means it is the “Currently Selected Item”.  Since it is the “Currently Selected Item”, you can tap the “Hammer and Wrench” icon to bring up the property editor to make changes…

Activity with Text Editor showing

So, in the property editor for the label, you can see that there is an entry field where the words “Your Text Here” are entered.  Go ahead and type over the top of those words.  But, let’s make it something a little longer than just your text here.  I’m going to use “The super duper really long sentence that is huge”

Activity Text Edit with Long Text

After I press “Done” on the property inspector, you can see that the text block grows to show the text.  But, what if we don’t really like that?  What if we want the text to take up more space on the screen?  Well, we can do that too!!  Touch the Hammer/Wrench icon to bring up the property inspector again.

With the property inspector showing, touch the “Properties” button on the bottom of the little window.Label Properties Window

The label properties window displays additional properties affecting the label.  From this display you can:

  1. Name the label (why would I want to do that??  More later…)
  2. Categorize the label (huh?  Why? What???  More later….)
  3. Adjust the labels position one pixel at a time (nice for specific placement)
  4. Adjust a bunch-o-other properties that we’ll talk about later
  5. … Eventually, find the property named “Width”.

In the Width Property, type in “400” and press done.

Label Property Too Big

Huh… well, that’s certainly bigger. but the words are hanging off the side.  That’s not so great.  Let’s bring up the property editor one more time but this time, let’s shrink the font a bit by changing the font size!  Just like a word processor, you can control the fonts, the color of the text and the font size using the label’s property editor.  Here, I chose Helvetica 12 and touched Done.

Finally, I used my fingers to “squeeze the label” down to size to fit on the page and presto-chango the label fits on the display.

Label Resized to Fit

Look at that!! You’ve got your text just where you want it, in your font, your color, your size.  Nice, huh?

In this lesson, you’ve learned:

  1. How to add text to your display
  2. How to place the text and resize it
  3. Adjusting font properties
  4. Adjust widths to get the perfect fit
  5. Adjusting colors
  6. And even how to rotate… Wait?  You didn’t learn that?  Well… how do you think you’d do that??

Rotated label