Dynamic Type

Creating an interface that appeals to everyone can be daunting. Some people prefer more compact interfaces so they can see more information at once. Others might want to be able to easily see information at a glance, or perhaps they have poor eyesight. In short: People have different needs. Good developers strive to make apps that meet those needs.

Dynamic Type is a technology that helps realize this goal by providing specifically designed text styles that are optimized for legibility. Users can select one of seven preferred text sizes from within Apple’s Settings application (plus a few additional larger sizes from within the Accessibility section), and apps that support Dynamic Type will have their fonts scaled appropriately. In this section, you will update ItemCell to support Dynamic Type. Figure 10.6 shows LootLogger rendered at the smallest and largest user-selectable Dynamic Type sizes.

Figure 10.6  ItemCell with Dynamic Type supported

ItemCell with Dynamic Type supported

The Dynamic Type system is centered around text styles. When a font is requested for a given text style, the system will consider the user’s preferred text size in association with the text style to return an appropriately configured font. Figure 10.7 shows the different text styles.

Figure 10.7  Text styles

Text styles

Open Main.storyboard. Let’s update the labels to use text styles instead of fixed fonts. Select the nameLabel and valueLabel and open the attributes inspector. For Font, choose Text Styles - Body (Figure 10.8). Repeat the same steps for the serialNumberLabel, choosing the Caption 1 text style.

Figure 10.8  Changing the text style

Changing the text style

Now let’s change the simulator’s preferred font size. You do this through the Settings application.

Build and run the application. From the simulator’s Hardware menu, select Home. Next, on the simulator’s Home screen, open the Settings application. Choose Accessibility, then Display & Text Size, and then Larger Text. (On an actual device, this menu can also be accessed in Settings via Display & BrightnessText Size.) Drag the slider all the way to the left to set the font size to the smallest value (Figure 10.9).

Figure 10.9  Text size settings

Text size settings

Build and run the application again from Xcode. (If you switch back to the application, you will not see the changes. You will fix that in the next section.) Add some items to the table view and you will see the new smaller font sizes in action.

Responding to user changes

When the user changes the preferred text size and returns to the application, the table view will get reloaded. Unfortunately, the labels will not know about the new preferred text size. To fix this, you need to have the labels automatically adjust to content size changes.

Open Main.storyboard and select all three ItemCell labels. Open the attributes inspector, and check the Automatically Adjusts Font checkbox (Figure 10.10). This will set the corresponding adjustsFontForContentSizeCategory property on each label to true.

Figure 10.10  Automatically adjusts label font

Automatically adjusts label font

Build and run the application and add a few rows. Go into Settings and change the preferred reading size to the largest size. Unlike before, when you now switch back to LootLogger, the table view cells will update to reflect the new preferred text size.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset