Share via

How to: Add Tab Items to a TabControl

  • Article

[This documentation is for preview only, and is subject to change in later releases. Blank topics are included as placeholders.]

The Windows Presentation Foundation (WPF) TabControl class contains multiple tab items that share the same space on the screen. At design time, you can add tab items to a TabControl in the WPF Designer. This topic discusses three ways that you can add tab items to a TabControl.

Using the Designer

You can add a tab item to a TabControl by right-clicking the design surface.

To add tab items to a TabControl by using the designer

  1. In the WPF Designer, select a TabControl.

  2. In the upper part of the TabControl, right-click a TabItem.

  3. Select Add Tab from the context menu.

    A new TabItem is added to the TabControl.

Note

By default, the WPF Designer uses a Grid as the tab item's root container. If you need a different root container, you can delete the Grid and add a different container, for example, a DockPanel control.

Using the Collection Editor

You can also add tab items to a TabControl by using the collection editor. When you use the collection editor to configure tab items, Design view and XAML view are updated automatically.

To add tab items to a TabControl by using the collection editor

  1. In the WPF Designer, select a TabControl.

  2. In the Properties window, locate the Items property, and click the ellipsis button in the property value column.

    The Collection Editor dialog box appears.

  3. Click Add to add a new tab item.

  4. (Optional) Set the properties of the tab item.

  5. (Optional) Repeat steps 3 and 4 to add more tab items.

  6. Click OK to close the Collection Editor and return to the WPF Designer.

Using XAML View

You can also add tab items to a TabControl manually by typing in XAML view. Design view is automatically updated with the new tab items.

To add tab items to a TabControl by using XAML view

  1. In XAML view, locate a TabControl element.

  2. Add a TabItem element as a child of the TabControl element. The markup should resemble the following:

    <TabControl Name="tabControl1" Height="100" Width="200">
    <TabItem Header="tabItem1" Name="tabItem1">
    </TabItem>
</TabControl>

See Also

Reference

TabControl

TabItem

Other Resources

WPF Container Controls