Today's #AndroidDesign #Protip from +Roman Nurik is about nine-patches and working with them in #AndroidStudio .Nine-patches
(well, N-patches to be more precise) are a critical component of any Android app UI. They let you draw custom rectangular UI elements that can scale to any size.
When drawing nine-patches, remember to provide them in all key densities for your app
(e.g. MDPI, HDPI, XHDPI). If relying on the platform scaling higher-density nine-patches down for lower densities, make sure that (1) you leave some extra room around stretch region edges to avoid scaling artifacts and (2) stretch regions are at least 2–4 pixels wide so that they don't scale down to 0 pixels and crash your app!
Additionally, a great feature in Android Studio is the ability to preview and edit nine-patches!
Simply open up a .9.png
file in Android Studio and begin dragging the stretch and padding regions as needed. You can also preview what the nine-patch will look like by looking in the right pane and dragging the Patch scale
slider along the bottom. It's a great alternative to the existing draw9patch
tool, and it's built into the IDE! One caveat is that as of this writing, there's no way to undo nine-patch edits, so make sure your project is under source control (which is a good idea anyway).
A preview of what the nine-patch tool looks like and a summary of nine-patch platform scaling gotchas are attached to this post.
That's all for today, but if you've got additional tips related to nine-patches, let's hear them in the comments!