Use C# Windows Stores Components in C++ Stores Components

Introduction

This article helps you to port C# Windows Stores components to C++ Windows Stores components using the Windows RunTime components project.

Step 1: Create Visual C# Runtime Component Project

Create a “Windows Runtime Component Visual C#” project form the following navigations.

1. File -> New -> Project (the following “New Project” dialog will open).
   
   
   
   
2. Choose the “Windows Runtime Component Visual C#” project from Templates -> Visaul C# -> Windows Runtime Component Visual C# with a name like “MyCSharpComponents” or whatever you desire.

Step 2: Add a UserControl to hold our desire C# controls

1. Create a UserControl to hold our desired C# control by pressing Ctrl+Shift+A to show the following “Add New Item” dialog.
   
   
   
   
2. Create a UserControl with a name like “MyCSharpButton.xaml” or whatever you desire.

Step 3: Add desired C# Control like Button

1. Here I am using a C# Button, so double-click on the “MyCSharpButton.xaml” file and add the following code.
   

   <UserControl
       x:Class="MyCSharpComponents.MyCSharpButton"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:local="using:MyCSharpComponents"
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       mc:Ignorable="d"
       d:DesignHeight="300"
       d:DesignWidth="400">
   
       <Button x:Name="MyButtonCSharp" Content="Button" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"></Button>
   </UserControl>

2. Now rebuild the project to ensure the compilation.

Step 4: Create a C++ Windows Store Application

1. Create a C++ Windows Store Blank App to use the C# button by right-clicking the solution then Add -> New Project to show the “Add New Project” dialog as below:
   
   
   
   
2. Create a “Blank App” from Visual C++ with a name like “CPPSample” or whatever you desire.

Step 5: Add “MyCSharpComponents” project as a reference for the “CPPSample”

1. Add a “MyCSharpComponents” Runtime Component project as a reference of “CPPSample” by right-clicking the “CPPSample” and click the “Reference” menu to show the “CPPSample Property Page”.
   
   
2. Click the “Add New Reference” button to open the “Add Reference” dialog.
   
   
3. Refer to “CSharpComponent” from Solution -> Projects.
   
   

Step 6: Add the C# Control with CPP sample

1. Double-click the “MainPage.xaml” and implement the following code with a namespace and C# button hosted.
   

   <Page
       x:Class="CPPSample.MainPage"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:local="using:CPPSample"
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       xmlns:csharp="using:MyCSharpComponents"
       mc:Ignorable="d">
   
       <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
           <csharp:MyCSharpButton Width="200" Height="50"></csharp:MyCSharpButton>
       </Grid>
   </Page>

2. Now rebuild and the set the “CPPSample” as the startup project and run the application.