Surface Tip: Adding Items to a ScatterView

Continuing with the basic tips and tricks for Surface 2.0 and keeping our focus on the ScatterView control, I’ll show you how you add items to a ScatterView by code.
First you need to have your ScatterView control in your XAML:
Then, on the code behind file you can add a simple code method to add an image as an item to the existing scatter control (make sure the image file you use is added on the root of the project or change the path to the correct one depending on your image folder structure):
The method above allows you to add the images. For a simple test and sample, you can just call the Add method in the constructor method of your simple app:
public SurfaceWindow1()
{
    InitializeComponent();
    AddWindowAvailabilityHandlers();
    Add();
}
If you run the app, it will display just one image.

Now, you can reuse previous tips to make something more interesting. You can add a style in the ScatterView control so the items you add have a nicer look and feel. Lets change the ScatterView to add the item style template:
Now instead of just adding one image in the constructor, we could actually add a button for the user to add the images dynamically. Lets do that using a DockPanel control with a UniformGrid container to provide a menu style bar with the add button:
The DockPanel in conjunction with the UniformGrid allows you to dock the items contained to one of the borders of the table. You can define which border to dock to and the number of columns to display. Then you just need to add the button.
The button has a click handler defined, so you also need to implement the event handler in the code behind:
Cheers!