Silverlight-TabControl

アイテムを個別のタブに配置し、ユーザーが一度に1つのタブのみを表示できるようにするコンテナー。ユーザーは、タブヘッダーをクリックして、さまざまなビューから選択できます。このコントロールは、コンテンツモデルのさらに別のバリエーションを示しています。好きなものをタブ項目のコンテンツとして配置できます。通常、レイアウトを配置します。スタックパネルなどの要素。

以下に、 TabControl の一般的に使用される*プロパティ*を示します。

以下は、TabControlの最も一般的に使用されるプロパティです。

Sr. No.	Property & Description
1	AllowDrop ユーザーがドラッグしたデータをコントロールが受け入れることができるかどうかを示す値を取得または設定します（Controlから継承）。
2	BackgroundImage このAPIは製品インフラストラクチャをサポートし、コードから直接使用するためのものではありません。このメンバーは、このコントロールには意味がありません（Control.BackgroundImageをオーバーライドします）。
3	Dock どのコントロールの境界線が親コントロールにドッキングされるかを取得または設定し、コントロールが親とともにサイズ変更される方法を決定します（Controlから継承）。
4	Height コントロールの高さを取得または設定します（Controlから継承）。
5	Name コントロールの名前を取得または設定します（Controlから継承）。
6	Width コントロールの幅を取得または設定します（Controlから継承）。 6

2つのタブを含む TabControl の簡単な例を見てみましょう。

<UserControl
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:sdk = "http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
   x:Class = "TabControl.MainPage"
   mc:Ignorable = "d"
   d:DesignHeight = "300" d:DesignWidth = "400">

   <Grid x:Name = "LayoutRoot" Background = "White">

      <sdk:TabControl x:Name = "tabControl" HorizontalAlignment = "Left" Height = "172"
         Margin = "80,77,0,0" VerticalAlignment = "Top" Width = "273">

         <sdk:TabItem Header = "First Tab">

            <Grid Background = "#FFE5E5E5">

               <StackPanel>
                  <TextBlock Text = "First tab content" Margin = "0,0,0,20"/>
                  <Rectangle Fill = "Aqua" RadiusX = "10" RadiusY = "10" Width = "100"
                     Height = "40"/>
               </StackPanel>

            </Grid>

         </sdk:TabItem>

         <sdk:TabItem Header = "Second Tab">

            <Grid Background = "#FFE5E5E5">

               <StackPanel>
                  <TextBlock Text = "Second tab content" Margin = "0,0,0,20"/>
                  <Ellipse Fill = "Azure" Width = "100" Height = "40" Margin = "10"/>
                  <Button x:Name = "button" Content = "Button"
                     HorizontalAlignment = "Left"Margin = "10" VerticalAlignment = "Top"
                     Width = "75" RenderTransformOrigin = "0.494,1.715"/>
               </StackPanel>

            </Grid>

         </sdk:TabItem>

      </sdk:TabControl>

   </Grid>

</UserControl>

上記のコードをコンパイルして実行すると、最初のタブにコンテンツが表示されます。

TabControl First Tabe

2番目のタブをクリックすると、2番目のタブのコンテンツが表示されます。

TabControl 2番目のTabe

Silverlight-tabcontrol

Silverlight-TabControl