WindowsPhone 8.1: Now UniversalWrapPanel is an alternative for WrapPanel(C#-XAML)

Introduction:

Still i am really addicted for 'WrapPanel'.Because WrapPanel is great for laying out things in a vertical or horizontal orientation until you reach the edge of the container and then moving on to the next column or row.But unfortunately i found 'WrapPanal' is no longer supported by windows store apps(i.e Universal Apps).Yestereday i found 'UniversalWrapPanel' is an alternative for 'WrapPanel'  layout .And i am heartly says very thanks to @gregstoll for making UniversalWrapPanel.However in this post i am going to explain about UniversalWrapPanel.

Building the sample:

• Make sure you’ve downloaded and installed the Windows Phone SDK. For more information, see Get the SDK.
• I assumes that you’re going to test your app on the Windows Phone emulator. If you want to test your app on a phone, you have to take some additional steps. For more info, see Register your Windows Phone device for development.

• This post assumes you’re using Microsoft Visual Studio Express 2013 for Windows.

Description:

Previously in windowsphone 8.0,WrapPanel control is available from Microsoft.Phone.Controls.Toolkit.dll.WrapPanel is a good layout for positioning child elements sequentially from left to right or top to bottom. When elements extend beyond the panel edge, they are positioned in the next row or column.Unfortunately now WrapPanel is not supported by windows store apps.And so we need an alternative for 'WrapPanel' in windows store apps (i.e UniversalWrapPanel).Ok all right lets start to knowing about new control with following steps.

Step 1:

• Open Visual Studio 2013
• Create new project using the "Blank App" template available under Visual C# -> Store Apps -> Windows Phone Apps. (Ex: "WrapPanel8.1")

Install UniversalWrapPanel for Windows Phone 8.1, run the following command in the Package Manager Console

PM> Install-Package UniversalWrapPanel

After that you will be found 'UniversalWrapPanel' dll in references like this

Step 2:

Open MainPage.xaml and add the namespace in xaml:

1. xmlns:UniversalWrapPanel="using:Gregstoll"  

Step 3:

Lets Write following xaml code to use UniversalWrapPanel

1. <Grid Background="#FF59ABB4">  
2.         <Grid.RowDefinitions>  
3.             <RowDefinition Height="Auto"/>  
4.             <RowDefinition Height="Auto"/>  
5.             <RowDefinition Height="Auto"/>  
6.             <RowDefinition Height="Auto"/>  
7.         </Grid.RowDefinitions>  
8.         <TextBlock FontSize="25" Text="Horizontal UniversalWrapPanel:"/>  
9.         <!--Horizontal Panel-->  
10.         <UniversalWrapPanel:UniversalWrapPanel Grid.Row="1" Orientation="Horizontal" Background="#FF34AC21">  
11.             <Button Content="Button1" />  
12.             <Button Content="Button2" />  
13.             <Button Content="Button3" />  
14.             <Button Content="Button4" />  
15.             <Button Content="Button5" />  
16.         </UniversalWrapPanel:UniversalWrapPanel>  
17.         <TextBlock FontSize="25" Grid.Row="2" Text="Vertical UniversalWrapPanel:"/>  
18.         <!--Vertical Panel-->  
19.         <UniversalWrapPanel:UniversalWrapPanel Background="#FFC500FF" Grid.Row="3" Orientation="Vertical">  
20.             <Button Content="Button1" />  
21.             <Button Content="Button2" />  
22.             <Button Content="Button3" />  
23.             <Button Content="Button4" />  
24.             <Button Content="Button5" />  
25.         </UniversalWrapPanel:UniversalWrapPanel>  
26.     </Grid> 

ScreenShots:

Summary:

From this article we have learned how to use UniversalWrapPanel in Windows Phone 8.1.And i hope you don't need to source code file from me,because of necessary code is available in this post.

FeedBack Note:

Please share your thoughts,what you think about this post,Is this post really helpful for you?I always welcome if you drop comments on this post and it would be impressive.

Follow me always at  @Subramanyam_B 

Have a nice day by Subramanyam Raju :)