The application contains one simple main page and one user panel.
The MainView is a simple page with an image (PictureBox) anchored only at the top to stay centered, two labels, also anchored only at the Top, and a StockPanel anchored at the top and at the bottom in order to resize vertically to fill the page.
The StockPanel view contains a DataRepeater control. it repeats the template panel and all its children vertically (or horizontally) to display all the records in the data source.
Each child control can be bound to a field in the data source.
Once the control is designed, all the child controls in the template are wired to the data source, the system takes care of the rest. It's enough to run a loop like the one below to update all the items in the panel:
Notice that the label next to the "Last Update" label says no data. We can use the Advanced Binding configuration to configure the binding of the last update label to display "no data" when the incoming value is null.
However, there is a trick in the MainView: Responsive Properties! The view is arranged differently when running in a Phone or in a Phone in Landscape mode.
In the code snippet above you'll notice the check on the m.Watching property. That property is bound to the switch control in the Data Repeater. When the user switches it on or off, it automatically updates the Watching property in the data model.
