GroupBox

 

GroupBox是一个容器控件，用来呈载和组合其他控件。在这里只要注他的Header属性就行，TabControl在后面的控件中学习。

XAML代码：

<Grid x:Name="LayoutRoot">     

<GroupBox Width="300" Margin="170,35,170,100">

 <GroupBox.Header>

    <Label>Employee Data</Label>

 </GroupBox.Header>

 <StackPanel>

 <TabControl Name="myTabControl"

     TabStripPlacement="Top"

         Margin="0, 0, 0, 10" Height="280"

     >

    <TabItem Name="PersonalInfo">

      <TabItem.Header>_Personal Info</TabItem.Header>

      <StackPanel>

        <TextBlock>Employee</TextBlock>

        <TextBlock>Select your name</TextBlock>

        <ListBox Name="empName" SelectionChanged="updateSummary">

          <ListBoxItem IsSelected="true" Cursor="SizeWE" Content="GuiSuWei"/>

          <ListBoxItem Content="ZhangJian"/>

          <ListBoxItem Content="ZhouJinQiao"/>

          <ListBoxItem Content="LiZhi"/>

        </ListBox>

       </StackPanel>

    </TabItem>

    <TabItem>

      <TabItem.Header>_Job Info</TabItem.Header>

        <StackPanel>

        <TextBlock>Select a job</TextBlock>

        <ListBox Name ="job" SelectionChanged="updateSummary">

          <ListBoxItem IsSelected="true">Programmer</ListBoxItem>

            <ListBoxItem>Tester</ListBoxItem>

            <ListBoxItem>Writer</ListBoxItem>

            <ListBoxItem>Manager</ListBoxItem>

          </ListBox>

        </StackPanel>

        </TabItem>

        <TabItem Name="Skill">

          <TabItem.Header>_Skill</TabItem.Header>

          <StackPanel>

            <TextBlock>

                Select your strongest skill

            </TextBlock>

        <ListBox Name="skills" SelectionChanged="updateSummary">

            <ListBoxItem IsSelected="true">C#</ListBoxItem>

            <ListBoxItem>Visual Basic</ListBoxItem>

            <ListBoxItem Content="C++"/>

            <ListBoxItem>JScript</ListBoxItem>

               <ListBoxItem Content="J#"/>

          </ListBox>

      </StackPanel>

      </TabItem>

      <TabItem Name="Summary" >

        <TabItem.Header>Su_mmary</TabItem.Header>

        <StackPanel>

        <TextBlock Name="emp"/>

        <TextBlock Name="ejob"/>

        <TextBlock Name="eskill"/>

      </StackPanel>

    </TabItem>

 </TabControl>

    <Button Content="Show Summary" Click="goToSummaryTab"/>

 </StackPanel>

</GroupBox>

</Grid>

CS代码：

 private void displayData()

        {

            ListBoxItem lbi = empName.SelectedItem as ListBoxItem;

            emp.Text = "Name: " + lbi.Content.ToString();

            lbi = job.SelectedItem as ListBoxItem;

            ejob.Text = "Job: " + lbi.Content.ToString();

            lbi = skills.SelectedItem as ListBoxItem;

            eskill.Text = "Strongest Skill: " + lbi.Content.ToString();

        }

        private void OnLoad(object sender, RoutedEventArgs e)

        {

            displayData();

        }

        private void updateSummary(object sender, RoutedEventArgs e)

        {

            if (Page.IsLoaded)

                displayData();

        }

        private void goToSummaryTab(object sender, RoutedEventArgs e)

        {

            displayData();

            Summary.IsSelected = true;

        }

效果如下：

本文参考MSDN组织。