Basic Library for UWP/WinRT XAML
手順2:アプリケーションへの TabControlの追加

前の手順では、Windows ストアプロジェクトを作成しました。この手順ではアプリケーションに C1TabControl を追加します。

次の手順に従います。

  1. MainPage.xaml で、<Grid> タグと </Grid> タグの間にカーソルを置き、1回クリックします。
  2. <Grid> タグと </Grid> タグの間に次のマークアップを追加します。

    コードのコピー
    <C1:C1TabControl x:Name="tabControl" TabStripOverlapDirection="Left"  TabStripOverlap="8" TabItemShape="Sloped" TabItemClose="InEachTab" TabStripPlacement="Bottom" TabStripMenuVisibility="Visible">
    </C1:C1TabControl>
    このマークアップは、プロジェクトに C1TabControl を追加します。また、プロパティは以下のように設定されています。
    • TabStripOverlapDirection プロパティは Left に、TabStripOverlap8 に設定されています。これは、タブ間で許可される重なりを示します。
    • TabItemClose プロパティは InEachTab に設定されています。これにより、各タブに閉じるボタンが追加されます。
    • TabItemShape プロパティは Sloped に設定されています。これにより、タブ項目の形状が Office フォルダのタブに似せて変更されます。
    • TabStripMenuVisibility プロパティは Visible に設定されています。
    • TabStripPlacement プロパティは Bottom に設定されています。これにより、タブストリップがコントロールの下端に配置されます。
      また、C1TabControl 内に C1TabItem を追加する必要があります。
  3. <C1:C1TabControl> タグと </C1:C1TabControl> タグの間に次のマークアップを追加します。

    コードのコピー
    <C1:C1TabItem Header="メモ" CanUserPin="True">
        <RichEditBox HorizontalAlignment="Left" Height="680" VerticalAlignment="Top" Width="1330"/>
    </C1:C1TabItem>
    <C1:C1TabItem Header="タスク">
        <RichEditBox HorizontalAlignment="Left" Height="680" VerticalAlignment="Top" Width="1330"/>
    </C1:C1TabItem>
    <C1:C1TabItem Header="催促">
        <RichEditBox HorizontalAlignment="Left" Height="680" VerticalAlignment="Top" Width="1330"/>
    </C1:C1TabItem>
    <C1:C1TabItem Header="トピック" CanUserPin="True">
        <RichEditBox HorizontalAlignment="Left" Height="680" VerticalAlignment="Top" Width="1330"/>
    </C1:C1TabItem>
    これにより、複数の C1TabItem が追加され、それぞれに RichEditBox が含まれます。2つの C1TabItem は、CanUserPinTrue に設定され、実行時のタブの固定を許可しています。

この手順では、C1TabControl コントロールを追加してカスタマイズしました。次の手順では、プログラムを実行し、このクイックスタートで行ったことを確認します。

関連トピック

 

 


Copyright © GrapeCity inc. All rights reserved.