モーダルウィンドウ「about.xaml」のデザイン
このウィンドウは、C1Windowコントロールを直接デザインするのではなく、プロジェクトにWPFユーザーコントロールを追加し、ここにコントロールを配置してデザインします。そして、このユーザーコントロールを、C1WindowコントロールのContentプロパティに組み込みます。
まず、プロジェクトの上でショートカットメニューを表示し、[追加]-[新しい項目]を選びます。
テンプレートで[WPF]-[ユーザーコントロール(WPF)]を選び、名前を「about.xaml」に変更し[追加]ボタンを押します。
Imageコントロールを配置し、画像ファイル(ここでは「setoseto.jpg」)をSourceプロパティに設定して、コントロールのサイズを画像サイズに合わせます。
ユーザーコントロールの背景色のグラデーションと枠線を設定します。このダイアログは、アプリケーションの名称とバージョン番号を表示するだけなので、これでできあがりです。
<UserControl x:Class="Wpf_c1window_cs.about" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" d:DesignHeight="210" d:DesignWidth="375" BorderThickness="2" BorderBrush="LimeGreen"> <UserControl.Background> <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5"> <GradientStop Color="#FF694C24" Offset="0" /> <GradientStop Color="White" Offset="1" /> </LinearGradientBrush> </UserControl.Background> <Grid Height="200" Width="357"> <Grid.ColumnDefinitions> <ColumnDefinition Width="343*" /> <ColumnDefinition Width="14*" /> </Grid.ColumnDefinitions> <Image Height="150" Name="Image1" Stretch="Fill" Width="300" Source="/Wpf_c1window_vb;component/Images/setoseto.jpg" Margin="28,25,14,25" /> </Grid> </UserControl>
モードレスパネル「toolbox.xaml」のデザイン
先ほどのモーダルウィンドウと同様、C1Windowコントロールを直接デザインするのではなく、プロジェクトにWPFユーザーコントロールを追加し、ここにコントロールを配置してデザインします。
まず、プロジェクトの上でショートカットメニューを表示して[追加]-[新しい項目]を選び、もう1つ[WPF]-[ユーザーコントロール(WPF)]を追加します。名前は「toolbox.xaml」にします。
続いて、CheckBoxコントロールを配置し、それぞれContentプロパティを「ページの背景色」「枠線」に変えます。CheckedイベントとUncheckedイベントのイベントハンドラを作成します。「枠線」チェックボックスだけ、IsCheckedプロパティを「True」にしてチェックを付けておきます。
<UserControl x:Class="Wpf_c1window_cs.toolbox" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" d:DesignHeight="81" d:DesignWidth="128"> <Grid Height="70" Width="121" HorizontalAlignment="Left" VerticalAlignment="Top"> <CheckBox Content="ページの背景色" Height="24" Name="CheckBox1" Width="121" Checked="CheckBox1_Checked" Unchecked="CheckBox1_Unchecked" VerticalAlignment="Top" HorizontalAlignment="Left" /> <CheckBox Content="枠線" Height="23" IsChecked="True" Margin="0,21,44,0" Name="CheckBox2" VerticalAlignment="Top" Width="108" Checked="CheckBox2_Checked" Unchecked="CheckBox2_Unchecked"/> </Grid> </UserControl>