ここでは、Silverlight アプリケーション用サンプルコードをWPFアプリケーション用コードに変換します。
参照元情報Silverlight におけるレイアウトの基本（Visual Basic ガイド ツアー）
「Silverlight におけるレイアウトの基本」にジャンプする
作成方法の詳細は上記を参照願います。
Silverlight におけるレイアウトの基本Silverlight におけるレイアウトの基本の解説とおりにWPFアプリケーションを作成すると、互換性の問題でエラーが発生しますが、僅かな修正で動作するようになります。
完成ファイルは以下からダウンロードできます。
ダウンロード後は解凍してから使用してください。
[Silverlight アプリケーションの開発]をダウンロードする。解凍すると「23SampleLayouts」フォルダーがあります。
注（１）「23SampleLayouts」フォルダーの「SampleLayouts.sln」ファイルをダブルクリックすると「Microsoft Visual Basic 2010 Express」が起動します。
注（２）メニューの「ウインド」＿「ウインドレイアウトのリセット」で標準に戻ります。
注（３）「ソリューションエクスプローラ」ウインドウ内の「MainWindow.xaml」をダブルクリックすると「デザイン」と「XAML」が表示されます。
注（４）メニューの「表示」＿「コード」を選択するとコードが表示されます。
注（５）「DynamicControls.sln」の動作確認は「デバッグ」＿「デバッグ開始」で実行します。デバッグ機能を用いて動作確認を行います。
SampleLayouts.slnの実行（１）「Microsoft Visual Basic 2010 Express」のデバッグ機能を使用します。
（２）「デバッグ」＿「デバッグ開始」を選択します。
（３）MainWindow画面が表示されます。
（４）ボタンを押すと日時が表示されます。
（５）Nameテキストボックスへの入力とラジオボタンの選択ができます。
（６）クローズボックスで終了します。
新規プロジェクトの作成（１）新規プロジェクト
新規プロジェクトを作成すると「デザイナー」にはとXAMLが自動生成されます。
（２）XAMLコードの作成
サンプルのXAMLコードをコピーして、ペーストすると完成します。
（３） クラスコード
Class MainWindow
End Class
が自動生成されます。
（４） その他
サンプルのXAMLコードをコピーして、ペーストすると簡単に完成しますが、互換性の問題でエラーが発生します。エラーの原因を修正すると動作するようになります。
エラーの原因を修正は学習に有効な作業となります。
XAMLの全コード
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="400" Width="600">
<Grid x:Name="LayoutRoot" Width="400" Height="300" Background="LightGreen">
<!-- Grid レイアウトの行、および列の定義 -->
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Rectangle Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"
Fill="GreenYellow" />
<TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"
VerticalAlignment="Center" HorizontalAlignment="Center"
FontSize="16" Text="Silverlight Layouts" />
<TextBlock Grid.Row="1" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top"
Text="Figures:" />
<!-- Canvas レイアウト -->
<Canvas Grid.Row="1" Grid.Column="1" Background="LightBlue" >
<Ellipse Canvas.Left="50" Canvas.Top="30"
Width="150" Height="80" Fill="Gold" />
<Rectangle Canvas.Left="120" Canvas.Top="80"
Width="120" Height="90" Stroke="DarkBlue" StrokeThickness="7" />
</Canvas>
<TextBlock Grid.Row="2" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Center"
Text="Name: " />
<TextBox Grid.Row="2" Grid.Column="1" HorizontalAlignment="Left"
Width="200" />
<TextBlock Grid.Row="3" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Center"
Text="Gender:" />
<!-- StackPanel レイアウト -->
<StackPanel Grid.Row="3" Grid.Column="1" Orientation="Horizontal" Background="Khaki">
<RadioButton x:Name="genderMale" Content="Male" IsChecked="True" />
<RadioButton x:Name="genderFemale" Content="Female" />
</StackPanel>
</Grid>
</Window>
XAMLの変更点（１）<UserControl x:Class="MySilverlightApp.MainPage"が<Window x:Class="MainWindow"に変更となります。 （<Window x:Class="MainWindow"はWPFアプリケーションのデホルトです。）
（２）上記以外の変更点は無く、Silverlight におけるレイアウトのコードとWPFアプリケーション のコードは同じになります。
Class MainWindowクラスの全コードClass MainWindowクラスのコードはありません。
感想：
（１）XAMLのSilverlight におけるレイアウトのコードとWPFアプリケーションのコードは同じで互換性がありそうです。
２４章：チュートリアル23：コントロールのテンプレート化と再利用(VB)に行く。