My First XAML Data-Driven UI Recipe
Before XAML in particular and .NET in general, my typical data-driven UI “recipe” was to build on a Tab Control—usually just a bunch of forms in Tabs. The Tab aesthetic is directly connected to the “classic” desktop metaphor—directly coming from Xerox PARC. Next to the desktop there are filing cabinets—and in a drawer of the file cabinets are folders—folders with Tabs.
With the release of Windows 8, Microsoft reinforces what Apple has already started: a move away from the 1920s “modern” office space to the ancient world of the laminar tablet. In the same way the human eye jumps from one space on the surface of stone bas relief to another, our eye can see the flat panel display change in response to our touch. This flat panel aesthetic expressed in XAML leads me to these controls:
- The
DockPanel
will allow the ‘root’ panel display to be subdivided into smaller panels and provide dynamic flow resizing (viaLastChildFill="True"
). - The
Frame
will usually be the “last child” of theDockPanel
and provide the means to let the eye “jump” from one interactive display to another. - The
ItemsControl
with aWrapPanel
template loaded in theFrame
takes advantage of the flow resizing literally making the layout of items flexible.
This four-control approach is not meant to be a Microsoft-only solution. This approach actually comes from Web design (with display: inline-block
) and should be replicated in, say, Adobe Flex. The Web influence on this approach can also be seen through the use of the Frame element because it leads to the Page Navigation controls clearly mimicking the loading of HTML pages.