My Profile
Sign Out
Tickets
Knowledge Base
Login
Create Ticket
Articles in this section
Category / Section
  1. Home
  2. WinRT
  3. General

How to use the Syncfusion XAML controls in C++ project?

5 mins read

The Syncfusion XAML controls cannot be used directly. You can use them by creating a UserControl as C# WindowsRuntimeComponent. The following steps guide on how to achieve this.

  1. Create a C++ application.

Figure 1: Creating C++ application

  1. In Solution Explorer, add a new C# WindowsRuntimeComponent project to the Solution and add reference to your desired Syncfusion controls for WinRT XAML for the project (WindowsRuntimeComponent1.csproj).
  2. Create a UserControl (MyUserControl.xaml).

Figure 2: Solution Explorer

  1. Add the Syncfusion components to the UserControl as illustrated in the following code example.

MyUserControl.xaml

<Page
x:Class="WindowsRuntimeComponent1.MyUserControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:WindowsRuntimeComponent1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:Syncfusion="using:Syncfusion.UI.Xaml.Controls.Input"
xmlns:navigation="using:Syncfusion.UI.Xaml.Controls.Layout">
<Grid Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="200"/>
</Grid.RowDefinitions>
<navigation:SfAccordion SelectedIndex="0" AccentBrush="Blue" HorizontalAlignment="Left"
SelectionMode="{Binding Mode, Mode=TwoWay}"  Width="450" >
<navigation:SfAccordion.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Margin="10" FontSize="18"/>
</Grid>
</DataTemplate>
</navigation:SfAccordion.HeaderTemplate>
<navigation:SfAccordionItem Header="WinRT">
<Grid Height="256" Background="#FFF4F3F2"
Width="450">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition />
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Essential Studio" Margin="10,10,10,2" FontSize="13.333" Foreground="Black"/>
<TextBlock Text="WinRT" Grid.Row="1" Margin="10,-2,10,10" FontSize="32"  Foreground="Black"/>
<RichTextBlock Margin="10,-6,10,10" Grid.Row="2" TextAlignment="Justify" Foreground="Black">
<Paragraph>
<Run Text="Essential Studio for WinRT contains all the controls you need to build line-of-business applications, including charts, gauges, maps, diagrams, and radial menus. It also includes a unique set of controls for reading and writing Excel, Word, and PDF documents in Windows store apps."
FontSize="12"/>
</Paragraph>
<Paragraph />
<Paragraph>
<Run Text="All WinRT controls are optimized for touch, supporting common gestures: zooming, panning, selecting, double-tapping, rotating, resizing. Interaction feels natural, letting you build a native user interface to delight your users."
FontSize="12"/>
</Paragraph>
</RichTextBlock>
<Border Grid.Row="3" Padding="10" Margin="10" Width="170" HorizontalAlignment="Right" Background="#FF86BA35">
<TextBlock Text="Download free evaluation" Foreground="White" FontSize="13.333"/>
</Border>
</Grid>
</navigation:SfAccordionItem>
<navigation:SfAccordionItem Header="Windows Phone">
<Grid Height="256" Background="#FFF4F3F2"
Width="450">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition />
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Essential Studio" Margin="10,10,10,2" FontSize="13.333" Foreground="Black"/>
<TextBlock Text="Windows Phone" Grid.Row="1" Margin="10,-2,10,10" FontSize="32"  Foreground="Black"/>
<RichTextBlock Margin="10,-6,10,10" Grid.Row="2" TextAlignment="Justify" Foreground="Black">
<Paragraph>
<Run Text="Essential Studio for Windows Phone 7 contains all the controls you need to build line-of-business mobile applications including charts, gauges, maps, editors, and much more."
FontSize="12"/>
</Paragraph>
<Paragraph />
<Paragraph>
<Run Text="All components in the toolkit solve real problems; we never include controls just to increase the total count. Every component has been built as a solution to a real problem that developers face when creating enterprise applications."
FontSize="12"/>
</Paragraph>
</RichTextBlock>
<Border Grid.Row="3" Padding="10" Margin="10" Width="170" HorizontalAlignment="Right" Background="#FF86BA35">
<TextBlock Text="Download free evaluation" Foreground="White" FontSize="13.333"/>
</Border>
</Grid>
</navigation:SfAccordionItem>
<navigation:SfAccordionItem Header="Silverlight">
<Grid Height="256" Background="#FFF4F3F2"
Width="450">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition />
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Essential Studio" Margin="10,10,10,2" FontSize="13.333" Foreground="Black"/>
<TextBlock Text="Silverlight" Grid.Row="1" Margin="10,-2,10,10" FontSize="32"  Foreground="Black"/>
<RichTextBlock Margin="10,-6,10,10" Grid.Row="2" TextAlignment="Justify" Foreground="Black">
<Paragraph>
<Run Text="Essential Studio for Silverlight contains all the controls you need for building typical line-of-business web applications including grids, charts, gauges, menus, calendars, editors, and much more. It also includes some unique controls that enable your applications to read and write Excel, Word, and PDF documents."
FontSize="12"/>
</Paragraph>
<Paragraph />
<Paragraph>
<Run Text="All components in the toolkit solve real problems; we never include controls just to increase the total count. Every component has been built as a solution to a real problem that developers face when creating enterprise applications."
FontSize="12"/>
</Paragraph>
</RichTextBlock>
<Border Grid.Row="3" Padding="10" Margin="10" Width="170" HorizontalAlignment="Right" Background="#FF86BA35">
<TextBlock Text="Download free evaluation" Foreground="White" FontSize="13.333"/>
</Border>
</Grid>
</navigation:SfAccordionItem>
<navigation:SfAccordionItem Header="WPF">
<Grid Height="256" Background="#FFF4F3F2"
Width="450">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition />
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Essential Studio" Margin="10,10,10,2" FontSize="13.333" Foreground="Black"/>
<TextBlock Text="WPF" Grid.Row="1" Margin="10,-2,10,10" FontSize="32"  Foreground="Black"/>
<RichTextBlock Margin="10,-6,10,10" Grid.Row="2" TextAlignment="Justify" Foreground="Black">
<Paragraph>
<Run Text="Essential Studio for WPF contains all the controls that you need for building typical line-of-business web applications including grids, charts, gauges, menus, calendars, editors, and much more. It also includes some unique controls that enable your applications to read and write Excel, Word, and PDF documents."
FontSize="12"/>
</Paragraph>
<Paragraph />
<Paragraph>
<Run Text="All components in the toolkit solve real problems; we never include controls just to increase the total count. Every component has been built as a solution to a real problem that developers face when creating enterprise applications."
FontSize="12"/>
</Paragraph>
</RichTextBlock>
<Border Grid.Row="3" Padding="10" Margin="10" Width="170" HorizontalAlignment="Right" Background="#FF86BA35">
<TextBlock Text="Download free evaluation" Foreground="White" FontSize="13.333"/>
</Border>
</Grid>
</navigation:SfAccordionItem>
<navigation:SfAccordionItem Header="Windows Forms">
<Grid Height="256" Background="#FFF4F3F2"
Width="450">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition />
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Essential Studio" Margin="10,10,10,2" FontSize="13.333" Foreground="Black"/>
<TextBlock Text="Windows Forms" Grid.Row="1" Margin="10,-2,10,10" FontSize="32"  Foreground="Black"/>
<RichTextBlock Margin="10,-6,10,10" Grid.Row="2" TextAlignment="Justify" Foreground="Black">
<Paragraph>
<Run Text="Essential Studio for Windows Forms contains all the controls that you need for building typical line-of-business web applications including grids, charts, gauges, menus, calendars, editors, and much more. It also includes some unique controls that enable your applications to read and write Excel, Word, and PDF documents."
FontSize="12"/>
</Paragraph>
<Paragraph />
<Paragraph>
<Run Text="All components in the toolkit solve real problems; we never include controls just to increase the total count. Every component has been built as a solution to a real problem that developers face when creating enterprise applications."
FontSize="12"/>
</Paragraph>
</RichTextBlock>
<Border Grid.Row="3" Padding="10" Margin="10" Width="170" HorizontalAlignment="Right" Background="#FF86BA35">
<TextBlock Text="Download free evaluation" Foreground="White" FontSize="13.333"/>
</Border>
</Grid>
</navigation:SfAccordionItem>
</navigation:SfAccordion>
<StackPanel Grid.Row="1">
<Syncfusion:SfTextBoxExt Text="Rate us" Margin="10 0"/>
<Syncfusion:SfRating ItemsCount="5" Value="4" Margin="10" HorizontalAlignment="Left"/>
</StackPanel>
</Grid>
</Page>
  1. Add the WinRT reference component to the C++ Application and drop the UserControl, containing the Syncfusion components on the page.
  2. Now, the Syncfusion controls are successfully added to the C++ application. The above code example results in the following output.

Figure 3: Syncfusion control added in C++ application

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied