XAML code to layout a control class

I am very new to WPF and XAML and don't fully understand how to do the following (VS2010, WPF, VB.net):

I have a custom class that inherits from TabItem, and in this class I have several controls that I want on my tab page, a RichTextBox and a TextBox. These TabItems will be dynamically created at runtime and added to a TabControl as the user needs them. How do I create XAML code and store it so when the custom class is dynamically created at run time it lays out the two contained controls as I need?

    Public Class CodePage : Inherits TabItem
        Private RTB As RichTextBox
        Private TB As TextBox
        ...
    End Class

My guess at the XAML:

    <Window x:Class="MainWindow"
        xmlns:local="clr-namespace:KRL" 
        xmlns="h开发者_如何学Cttp://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        <Style TargetType="{x:Type local:CodePage}">
            <Grid>
                NEED HELP HERE
            </Grid>
        </Style>

        <Grid>
            ...
        </Grid>
    </Window

Thank you in advance and sorry if this has been asked before, I've tried researching and don't understand.

First of all, your custom TabItem needs to override metadata so that the correct style is picked up based on your new type rather than your base class (apologies - I've used C# because I'm not proficient enough in VB):

public static CodePage()
{
    FrameworkElement.DefaultStyleKeyProperty.OverrideMetadata(
        typeof(CodePage),
        new FrameworkPropertyMetadata(typeof(CodePage)));
}

This will allow you to define a default style in your theme (Generic.xaml) as such:

<Style TargetType="{x:Type local:CodePage}">
    ...
</Style>

In this style, you can define a template. This tells WPF how to render that control when an instance of it is found in the logical tree.

By the looks of things, you've created the controls in code rather than your template. This is a mistake. You should instead define dependency properties to store the data in your CodePage class and define the look in your template (be it with text boxes, rich text boxes, or whatever). An example template might look like this:

<Style ...>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:CodePage}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <TextBox Text="{TemplateBinding Property1}"/>
                    <TextBox Grid.Column="1" Text="{TemplateBinding Property2}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>

I would then be able to use your CodePage class like this:

<TabControl>
    <whatever:CodePage Header="Hello" Property1="Foo" Property2="Bar"/>
</TabControl>

Chances are you'll want a custom TabControl that overrides its container generation to return instances of your CodePage instead of TabItem, but that's another story.

Just my two sense, but it looks like you are writing this the way you would a WinForms application. With the power that WPF has you probably don't need to have your CodePage inherit from TabItem at all. Have you looked into any of the MVVM articles out there? At a high level I would say that you want to instead create a CodePageViewModel and then create a DataTemplate so that it displays your controls correctly in Microsoft's TabItem.