I wanted to add a slider to control a size of the tile. So that user can increase the height/width of the tiles of pictures as shown below.
This was a pretty trivial task since I had used databinding to define the size of each tile. Here are things that were interesting
Here is how the size of the each tile was controlled…
Created a class that represents the size of tile
This class had implemented INotifyPropertyChanged so that it can serve as a data source in two-way binding.
Created a static resource to instantiate the class
This was done so that I can databind to the instance of the class in my markup using Source syntax.
Databind size of image to instance of tile class using source
Since my controls data context was the result returned by live service APIs, I needed to use source syntax to control the property of the tile.
Expose tile properties through APIs on ImageGridView Control
Now consumer of this user control can set the tile size and it will reflect in the view using databinding.
Build Slider that controls the size of tiles
Added markup for slider in my ImageGridView control
hooked up the ValueChanged event that changes the size of the tile instance.