Telerik UI for Windows Phone by Progress

The RadWrapPanel control allows you to set the direction in which the child elements will get ordered. You can choose between the following values:

  • Horizontal (default) - the child elements get placed one after another in a row. When the available space gets exceeded the following elements get translated to the next row.
  • Vertical - the child elements get placed one after another in a column. When the available space gets exceeded the following elements get translated to the next column.

To set the desired orientation use the Orientation property. Here is an example.

CopyXAML
<telerikPrimitives:RadWrapPanel x:Name="radWrapPanel" Height="300" Orientation="Vertical">
<Border BorderBrush="White" BorderThickness="1" Width="100" Height="100" Background="#FF00BABD" />
<Border BorderBrush="White" BorderThickness="1" Width="100" Height="100" Background="#FF00BABD" />
<Border BorderBrush="White" BorderThickness="1" Width="100" Height="100" Background="#FF00BABD" />
<Border BorderBrush="White" BorderThickness="1" Width="100" Height="100" Background="#FF00BABD" />
<Border BorderBrush="White" BorderThickness="1" Width="100" Height="100" Background="#FF00BABD" />
</telerikPrimitives:RadWrapPanel>

Here is a snapshot of the result.

Wrap Panel-Orientation-01