<Grid  xmlns:sysCollection="clr-namespace:System.Collections;assembly=mscorlib">
        <Grid.Resources>
            <DataTemplate x:Key="fontFamilyData">
                <TextBlock Text="{Binding Path=Source}"/>
            </DataTemplate>
            <DataTemplate DataType="{x:Type FamilyTypeface}">
                <WrapPanel>
                    <TextBlock Text="{Binding Path=Style}"/>
                    <TextBlock Text=" "/>
                    <TextBlock Text="{Binding Path=Weight}" />
                    <TextBlock Text=" "/>
                    <TextBlock Text="{Binding Path=Stretch}" />
                </WrapPanel>
            </DataTemplate>
            <CollectionViewSource Source="{Binding Source={x:Static Fonts.SystemFontFamilies}}" x:Key="familyCollection"/>
        </Grid.Resources>
        <Grid DataContext="{StaticResource familyCollection}" >
            <Grid.RowDefinitions>
                <RowDefinition Height="25"/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="180"/>
                <ColumnDefinition Width="200"/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>

            <!-- Families -->
            <TextBlock Grid.Row="0" Grid.Column="0" FontSize="14" Padding="5">Font Family</TextBlock>
            <ListBox Grid.Row="1" Grid.Column="0" ItemsSource="{Binding}" ItemTemplate="{StaticResource fontFamilyData}" Margin="5"/>

            <!--Family Typefaces (Style, weight, stretch) -->
            <TextBlock Grid.Row="0" Grid.Column="1" FontSize="14"  Padding="5">Style Weight Stretch</TextBlock>
            <ListBox Name="familyTypefacesList" Grid.Row="1" Grid.Column="1" ItemsSource="{Binding Path=FamilyTypefaces}" Margin="5"/>

            <!-- Sample Text -->
            <TextBlock Grid.Row="0" Grid.Column="2" FontSize="14"  Padding="5">Sample Text</TextBlock>
            <Grid Grid.Column="2" Grid.Row="1"  Margin="5">
                <TextBox FontSize="{Binding ElementName=fontSizeSlider, Path=Value}" AcceptsReturn="true"
           FontFamily="{Binding Source={StaticResource familyCollection},Path=Source}"
           FontWeight="{Binding ElementName=familyTypefacesList,Path=SelectedItem.Weight}"
           FontStretch="{Binding ElementName=familyTypefacesList,Path=SelectedItem.Stretch}"
           FontStyle="{Binding ElementName=familyTypefacesList,Path=SelectedItem.Style}"
           TextAlignment="Center" TextWrapping="Wrap">
                    The quick brown fox jumps over the lazy dog
                </TextBox>
                <DockPanel Opacity="0.9">
                    <Slider Name="fontSizeSlider" DockPanel.Dock="Right" Maximum="200" Minimum="6" Value="24"
            SmallChange="0.2" LargeChange="2" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="100" Margin="5"/>
                    <TextBlock Text="px" DockPanel.Dock="Right" VerticalAlignment="Bottom" HorizontalAlignment="Right" Padding="5"/>
                    <TextBlock Text="{Binding ElementName=fontSizeSlider, Path=Value}" DockPanel.Dock="Right" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="40" TextTrimming="CharacterEllipsis" Padding="5"/>
                </DockPanel>
            </Grid>
        </Grid>
    </Grid>