The art of organizing resources

The art of organizing resources

Slides from my talk at Android Makers Paris 2017
video: https://www.youtube.com/watch?v=AjSgAHZT9a0

Do you remember the last time you had to dig into strings.xml to find the right String to use? Or that you manually had to go over all drawables to find the one you needed?

Whenever we start a new project, we take a lot of care in setting up our architecture, CI, build flavors,... But do you also have a strategy to name your resources?

You should! Because the lack of XML namespaces, makes managing Android resources tedious. And causes things to grow out of control easily, especially in large projects.

So let's introduce a simple scheme that will solve your pains:
- easy lookup of any resource (autocomplete)
- logical, predictable names
- clean ordering of resources
- strongly typed resources

This talk will explain the mechanism, its advantages, limitations and provide an easy to use cheat sheet.

5f57d2d205e77e185986459c1b89a874?s=128

Jeroen Mols

April 10, 2017
Tweet

Transcript

  1. 4.

    @MOLSJEROEN SETTING UP A NEW PROJECT ▸ Architecture ▸ Unit

    tests ▸ Build flavours ▸ Code style ▸ Continuous integration & deployment ▸ …
  2. 5.

    @MOLSJEROEN SETTING UP A NEW PROJECT ▸ Architecture ▸ Unit

    tests ▸ Build flavours ▸ Code style ▸ Continuous integration & deployment ▸ … ▸ What about resources?
  3. 6.

    @MOLSJEROEN IMPORTANCE OF RESOURCES Facebook Twitter Hangouts Layouts 3167 1128

    372 Strings 7995 3243 2982 Drawables 4907 2136 1703 Ids 7258 2276 1039 Dimensions 4842 1470 636
  4. 7.

    @MOLSJEROEN CHALLENGES ORGANISING RESOURCES ▸ No XML name spaces ▸

    Huge amount of resources ▸ A lot of types: layouts, strings, drawables, ids,… ▸ Reuse across screens ▸ Tooling support
  5. 9.

    @MOLSJEROEN GOALS ▸ Logical, predictable names ▸ Clean ordering, even

    in folders ▸ Leverage Android Studio autocomplete ▸ Strongly typed resources
  6. 10.

    @MOLSJEROEN • <WHAT> • <WHERE> • <DESCRIPTION> • <SIZE> GENERAL

    RULE fixed set of options per resource, often Android view class custom part Android view subclass or “all” differentiate multiple elements in one screen precise “xdpi" or bucket “small”, optional <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  7. 11.

    @MOLSJEROEN • <WHAT> • <WHERE> • <DESCRIPTION> • <SIZE> GENERAL

    RULE fixed set of options per resource, often Android view class custom part Android view subclass or “all” differentiate multiple elements in one screen precise “xdpi" or bucket “small”, optional <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  8. 12.

    @MOLSJEROEN • <WHAT> • <WHERE> • <DESCRIPTION> • <SIZE> GENERAL

    RULE fixed set of options per resource, often Android view class custom part Android view subclass or “all” differentiate multiple elements in one screen precise “xdpi" or bucket “small”, optional <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  9. 13.

    @MOLSJEROEN • <WHAT> • <WHERE> • <DESCRIPTION> • <SIZE> GENERAL

    RULE fixed set of options per resource, often Android view class custom part Android view subclass or “all” differentiate multiple elements in one screen precise “xdpi" or bucket “small”, optional <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  10. 14.

    @MOLSJEROEN • <WHAT> • <WHERE> • <DESCRIPTION> • <SIZE> GENERAL

    RULE fixed set of options per resource, often Android view class custom part Android view subclass or “all” differentiate multiple elements in one screen precise “xdpi" or bucket “small”, optional <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  11. 22.

    @MOLSJEROEN • <WHAT> • Examples LAYOUTS activity, fragment, view, item

    or layout - activity_main.xml - fragment_articledetail.xml - view_menu.xml - layout_actionbar.xml <WHAT>_<WHERE>.XML
  12. 24.

    @MOLSJEROEN ADVANTAGES 1. Easy to use 2. Ordering by screen

    3. Folder organisation 4. Autocomplete - based on where and what - camel casing
  13. 25.

    @MOLSJEROEN • <WHAT> • Examples IDS name of Android/Custom view

    class - tablayout_main - imageview_menu_profile - textview_articledetail_title <WHAT>_<WHERE>_<DESCRIPTION>
  14. 27.

    @MOLSJEROEN ADVANTAGES 1. Easy to use 2. Ordering by screen

    3. Folder organisation 4. Autocomplete - based on where and what - camel casing 5. Strong typing
  15. 28.

    @MOLSJEROEN • <WHAT>
 • Examples DIMENSIONS width, height, size, margin,

    padding, elevation, keyline or textsize - height_all_toolbar - keyline_all_listtext - textsize_all_medium - size_menu_icon <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  16. 30.

    @MOLSJEROEN ADVANTAGES 1. Easy to use 2. Ordering by screen

    3. Folder organisation 4. Autocomplete - based on where and what - camel casing 5. Strong typing 6. Can be supported by tools
  17. 31.

    @MOLSJEROEN CHEAT SHEET ANDROID RESOURCE NAMING CHEAT SHEET <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> LAYOUTS

    STRINGS DRAWABLES DIMENSIONS <WHAT>_<WHERE>.XML <WHAT> is activity, fragment, view, item or layout <WHERE>_<DESCRIPTION> <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE> <WHERE>_<DESCRIPTION>_<SIZE> “all” if reused in ≠ screens <WHAT> is width, height, size, margin, padding, elevation, keyline or textsize IDS <WHAT>_<WHERE>_<DESCRIPTION> <WHAT> is name of Android/Custom view class custom part Android view subclass fixed set of options differentiate multiple elements in one screen always optional e.g. activity_main.xml all_done e.g. main_intro [xdp] or bucket [small] main_background e.g. all_infoicon_small e.g. linearlayout_main_fragmentcontainer e.g. keyline_all_text choose the right one below @MOLSJEROEN
  18. 32.

    @MOLSJEROEN 1. Easy to use 2. Ordering by screen 3.

    Folder organisation 4. Autocomplete 5. Strong typing 6. Can be supported by tools CONCLUSION <WHAT>_<WHERE>_<DESCRIPTION>_<SIZE>
  19. 33.

    @MOLSJEROEN REFERENCES AND IMAGE CREDITS • Blogpost http://jeroenmols.com/blog/2016/03/07/resourcenaming • Source

    code https://github.com/JeroenMols/ResourceNamingExample • Welcome image credit https://pixabay.com/p-642689/