courses I tutorials

Explore different tutorials to get hands on with Silverlight and Expression Blend across a wide array of topics in a short time.

school.tutorials

Using SketchFlow for Windows Phone Series

In this ToolBox module you discover principles of good UX design. You also discover how to start and build your prototype using the SketchFlow Template for Windows Phone.

More tutorials...

Customizing the ListBox to wrap data

In this next section, you change the template for the ItemsPanel so that your data can wrap in the ListBox container.

  1. Right-click on the ListBox and select Edit Additional Templates > Edit Layout of Items (ItemsPanel) > Create Empty.
    Edit Additional Templates menu
  2. When the CreateItemsPanelTemplate Resource panel appears, change the name to ItemsPanelTemplate_Wrap and press OK. You are now in the ItemsPanel template.
    Resource panel
  3. Select the StackPanel in the Objects and Timeline panel and press Delete.
  4. Select Assets at the bottom of the Tools panel and type Wrap into the Search textbox; the WrapPanel control appears. Click on it to select it. The WrapPanel is now accessible at the bottom of the Tools panel. Note: If you do not see WrapPanel appear in projects that you are working on, you will need to reference the Silverlight Toolkit for Windows Phone, as we covered in Module 1.
  5. Double-click on the WrapPanel icon located at the bottom of the Tools panel to add it to the ItemsPanel.
  6. Switch to the Selection tool and grab the right, middle handle on the WrapPanel and drag it in towards the left to make it closer to the size of the ListBox.
    Use Selection tool
  7. Click on the Return to scope arrow in the Objects and Timeline, or the ListBox breadcrumb at the top of the artboard to exit the template.
  8. Press Ctrl+ S. You will now edit the ItemTemplate for this ListBox to customize it further.