<UserControl Loaded="UserControl_Loaded" … > … </UserControl>
This topic is designed to get you up and running as quickly as possible by describing the basic steps required for adding the xamTagCloud™ to your page using procedural code and XAML.
You will add a basic xamTagCloud to your page.
Create a Microsoft® WPF™ application.
Add the following NuGet package reference to your application:
Infragistics.WPF.TagCloud
For more information on setting up the NuGet feed and adding NuGet packages, you can take a look at the following documentation: NuGet Feeds.
Attach an event handler to the UserControl’s Loaded event.
In XAML:
<UserControl Loaded="UserControl_Loaded" … > … </UserControl>
Place using/Imports directives in your code-behind or add an XML namespace declaration for xamTagCloud
In XAML:
xmlns:ig="http://schemas.infragistics.com/xaml"
In Visual Basic:
Imports Infragistics.Controls.Menus
In C#:
using Infragistics.Controls.Menus;
Add an instance of the xamTag control to the default Grid layout panel named LayoutRoot. If you are doing this in procedural code, you can handle the user control’s Loaded event and place the code in the event handler.
HorizontalContentAlignment – Stretch
VerticalContentAlignment – Stretch
Height – 300
Width – 250
MaxScale – 5
MinScale - 1
<Grid x:Name="LayoutRoot" Background="White"> <ig:XamTagCloud x:Name="xamTagCloud" Width="250" Height="300" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" MaxScale="5" MinScale="1"> <!-- TODO: Add cloud items --> </ig:XamTagCloud> </Grid>
In Visual Basic:
Dim myTagCloud As New XamTagCloud() myTagCloud.HorizontalContentAlignment = HorizontalAlignment.Stretch myTagCloud.VerticalContentAlignment = VerticalAlignment.Stretch myTagCloud.Height = 300 myTagCloud.MaxScale = 5 myTagCloud.MinScale = 1
In C#:
XamTagCloud myTagCloud = new XamTagCloud(); myTagCloud.HorizontalContentAlignment = HorizontalAlignment.Stretch; myTagCloud.VerticalContentAlignment = VerticalAlignment.Stretch; myTagCloud.Height = 300; myTagCloud.MaxScale = 5; myTagCloud.MinScale = 1;
Add cloud items to the xamTagCloud control. For more information see, Add Cloud Items to xamTagCloud
In XAML:
<ig:XamTagCloud MaxScale="5" MinScale="1" Name="tagCloud"> <ig:XamTagCloudItem Content = "Silverlight" Weight = "10" /> <ig:XamTagCloudItem Content = "ASP.Net" Weight = "2" /> <ig:XamTagCloudItem Content = "WPF" Weight = "5" /> <ig:XamTagCloudItem Content = "Window Forms" Weight = "5" /> <ig:XamTagCloudItem Content = ".NET" Weight = "7" /> …
In Visual Basic:
Dim cloudItem1 As New XamTagCloudItem With {.Content = "Silverlight", .Weight = 10} myTagCloud.Items.Add(cloudItem1) Dim cloudItem2 As New XamTagCloudItem With {.Content = "ASP.NET", .Weight = 2} myTagCloud.Items.Add(cloudItem2) Dim cloudItem3 As New XamTagCloudItem With {.Content = "WPF", .Weight = 5} myTagCloud.Items.Add(cloudItem3) Dim cloudItem4 As New XamTagCloudItem With {.Content = "Windows Forms", .Weight = 5} myTagCloud.Items.Add(cloudItem4) Dim cloudItem5 As New XamTagCloudItem With {.Content = ".NET", .Weight = 7} myTagCloud.Items.Add(cloudItem5) …
In C#:
XamTagCloudItem cloudItem1 = new XamTagCloudItem { Content = "Silverlight", Weight = 10 }; myTagCloud.Items.Add(cloudItem1); XamTagCloudItem cloudItem2 = new XamTagCloudItem { Content = "ASP.NET", Weight = 2 }; myTagCloud.Items.Add(cloudItem2); XamTagCloudItem cloudItem3 = new XamTagCloudItem { Content = "WPF", Weight = 5 }; myTagCloud.Items.Add(cloudItem3); XamTagCloudItem cloudItem4 = new XamTagCloudItem { Content = "Windows Forms", Weight = 5 }; myTagCloud.Items.Add(cloudItem4); XamTagCloudItem cloudItem5 = new XamTagCloudItem { Content = ".NET", Weight = 7 }; myTagCloud.Items.Add(cloudItem5); …
Add the instance of xamTagCloud to the Grid panel’s Children collection. Note: When you initially create a new page, a grid panel is created by default and named LayoutRoot.
In Visual Basic:
Me.LayoutRoot.Children.Add(myTagCloud)
In C#:
this.LayoutRoot.Children.Add(myTagCloud);
Save and run your application.