Professional Android 4 Application Development

434 x CHAPTER 11 ADVANCED USER EXPERIENCE
FIGURE 11-2
NinePatch Drawables
NinePatch (or stretchable) images are PNG files that mark the parts of an image that can be
stretched. They’re stored in your res/drawable folders with names ending in .9.png extensions.
res/drawable/stretchable_background.9.png
NinePatches use a one-pixel border to define the area of the image that can be stretched if the image
is enlarged. This makes them particularly useful for creating backgrounds for Views or Activities
that may have a variable size.
To create a NinePatch, draw single-pixel black lines that represent
stretchable areas along the left and top borders of your image, as
shown in Figure 11-3.
The unmarked sections won’t be resized, and the relative size of each
of the marked sections remains the same as the image size changes, as
shown in Figure 11-4.
To simplify the process to create NinePatch images for your application,
the Android SDK includes a WYSIWIG draw9patch tool in the
/tools folder.
Creating Optimized, Adaptive,
and Dynamic Designs
FIGURE 11-3
When designing your UI, it’s important to ensure that not only are
FIGURE 11-4
your assets and layouts scalable, but also that they are optimized for
a variety of different device types and screen sizes. A layout that looks
great on a smartphone may suffer from excessive whitespace or line lengths on a tablet.
Conversely, a layout optimized for a tablet device may appear cramped on a smartphone.
It’s good practice to build optimized layouts for several different screen sizes that take advantage of
their relative size and aspect ratio. The specific techniques used to design such UIs are beyond the
scope of this book, but they are covered in detail at the Android Training site: http://developer
.android.com/training/design-navigation/index.html.