この手順では、OrgChart for UWPを使用して、Windows ストアアプリケーションを作成します。C1OrgChart を使用すると、データの構造や関係を示す階層図を作成できます。プロジェクトをセットアップし、C1OrgChart コントロールをアプリケーションに追加するには、次の手順に従います。

1. Visual Studio で、［ファイル］→［新規作成］→［プロジェクト］を選択します。
2. ［新しいプロジェクト］ダイアログボックスで、左ペインの言語を展開し、言語の下で［Windows ストア］を選択し、テンプレートリストで［新しいアプリケーション (XAML)］を選択します。
3. 名前を入力し、［OK］をクリックしてプロジェクトを作成します。MainPage.xaml ファイルの XAML ビューを開きます。このクイックスタートでは、XAML マークアップを使用して、いくつかのコントロールを追加します。
4. ツールボックスに移動し、C1OrgChart アイコンをダブルクリックします。これで、アプリケーションにコントロールが追加されます。これで、参照と XAML 名前空間が自動的に追加されます。
5. 次のマークアップを <OrgChart:C1OrgChart> タグに追加します。
   • Name="c1OrgChart1"
   • ConnectorThickness="2"
   • ConnectorStroke="Black"
   • Orientation="Vertical"
   • ChildSpacing="20, 30"
   XAML マークアップは次のようになります。
   

   マークアップ	コードのコピー
   <OrgChart:C1OrgChart Name="c1OrgChart1" ConnectorThickness="2" ConnectorStroke="Black" Orientation="Vertical" ChildSpacing="20,30" VerticalAlignment="Center" HorizontalAlignment="Center" >

6. <OrgChart:C1OrgChart> タグと </OrgChart:C1OrgChart> タグの間に次のC1OrgChart.ItemTemplate を配置します。
   

   マークアップ	コードのコピー
   <OrgChart:C1OrgChart.ItemTemplate> <DataTemplate> <Border Background="#FF6AD400" Width="180" Height="90"> <TextBlock Text="{Binding Name}" FontSize="20" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White"/> </Border> </DataTemplate> </OrgChart:C1OrgChart.ItemTemplate>

これで、アプリケーションのユーザーインタフェースのセットアップは終了しましたが、C1OrgChart コントロールにはまだコンテンツがありません。次の手順では、C1OrgChart コントロールにコンテンツを追加します。