In the app I'm developing, we have a table/list that makes use of a kind of master/details approach; when you select a row in the main table, a second table below it is populated with 'child' items.
However, I've just noticed a feature of the grid control I'm using: the ability to have the 'details' shown inline in the main grid, just underneath the selected row. For example:
(Note: the above screenshot is not of my app; it's just an example I found on the internet, so I'm really not interested in specific comments about it. Thanks.)
I was wondering, does anyone know of UI design guidelines for this pattern? Does the pattern even have a commonly-agreed name?
- I can imagine that it would break down if the details panel were excessively tall (whatever that means), but is there anything else I should be looking out for?
- Is there even any styling I can apply to make my master/details relationship any clearer without cluttering the design?
- Have you seen any good examples of this pattern in use?
If anyone has any references -- or even just tips -- I'd love to hear it.