23章:10 行でズバリ!! [C#] WPF - コントロールを動的に作成する

    作成2013.04.18

     10 行でズバリ!! [C#] WPF - コントロールを動的に作成するは下記の参照元情報からほぼ完全な作成方法の説明と解説を参照できます。

  1. 参照元情報
     10 行でズバリ!! [C#] WPF - コントロールを動的に作成する
    「10 行でズバリ!! [C#] WPF - コントロールを動的に作成する」にジャンプする
     作成方法の詳細は上記を参照願います。


  2. 10 行でズバリ!! [C#] WPF - コントロールを動的に作成するの完成ファイル
     10 行でズバリ!! [C#] WPF - コントロールを動的に作成するの作成の解説とおりに作業を実施すると、C#プロジェクトファイル群が完成しますが、 ここでは、VBで作成したプログラムをC#言語に変換を基本とします。
     完成ファイルは以下からダウンロードできます。
     ダウンロード後は解凍してから使用してください。
      [10 行でズバリ!! [C#] WPF - コントロールを動的に作成する]をダウンロードする。
     解凍すると「23DynamicControls」フォルダーがあります。
    注(1)「23DynamicControls」フォルダーの「DynamicControls.sln」ファイルをダブルクリックすると「Express 2012 for Windows Desktop」が起動します。
    注(2)メニューの「ウインド」_「ウインドレイアウトのリセット」で標準に戻ります。
    注(3)「ソリューションエクスプローラ」ウインドウ内の「MainWindow.xaml」をダブルクリックすると「デザイン」が表示されます。
    注(4)メニューの「表示」_「コード」を選択するとコードが表示されます。
    注(5)「DynamicControls.sln」の動作確認は「デバッグ」_「デバッグ開始」で実行します。デバッグ機能を用いて動作確認を行います。


  3. DynamicControls.slnの実行
    (1)「Express 2012 for Windows Desktop」のデバッグ機能を使用します。
    (2)「デバッグ」_「デバッグ開始」を選択します。
    (3)操作画面が表示されます。
    (4)スライダーを動かすとInputの値が変化します。
    (5)四角のエリア内をクリックすると、座標値が画面左上に表示されます。
    (6)クローズボックスで終了します。


  4. 新規プロジェクトの作成
    (1)MainWindow.xamlのデザイン設定
     新規プロジェクトを作成すると「デザイナー」にはMainWindow.xamlが自動生成されます。MainWindow.xamlのデザイン設定はVBのMainWindow.xamlのコピー&ペーストで完成します。

    (2) MainWindow.xaml.csコード
     基本コードが自動生成されます。


  5. MainWindow.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="350" Width="525">
        <Grid x:Name="grid1">
        </Grid>
    </Window> 
    


  6. MainWindow.xamlコードの解説
    (1)<Grid x:Name="grid1">以外は標準生成コードです。x:Name="grid1"はClass MainWindowのコード記 載上必要となります。


  7. MainWindow.xaml.csの全コード
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Shapes;
    
    namespace DynamicControls
    {
        public partial class MainWindow : Window
        {
            public MainWindow()
            {
                InitializeComponent();
            }
            private void Window_Loaded(object sender, RoutedEventArgs e)
            {
                grid1.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(100) });
                grid1.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) });
                grid1.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Auto) });
                grid1.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Auto) });
                grid1.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Auto) });
    
                var label1 = new Label() { Content = "Slider:" };
                label1.SetValue(Grid.RowProperty, 0);
                label1.SetValue(Grid.ColumnProperty, 0);
                grid1.Children.Add(label1);
                var slider1 = new Slider();
                slider1.SetValue(Grid.RowProperty, 0);
                slider1.SetValue(Grid.ColumnProperty, 1);
                grid1.Children.Add(slider1);
    
                var label2 = new Label() { Content = "Input:" };
                label2.SetValue(Grid.RowProperty, 1);
                label2.SetValue(Grid.ColumnProperty, 0);
                grid1.Children.Add(label2);
                var tbox1 = new TextBox();
                tbox1.SetValue(Grid.RowProperty, 1);
                tbox1.SetValue(Grid.ColumnProperty, 1);
                var binding = new Binding() { Source = slider1, Path = new PropertyPath(Slider.ValueProperty) };
                tbox1.SetBinding(TextBox.TextProperty, binding);
                grid1.Children.Add(tbox1);
    
                var label3 = new Label() { Content = "Rectangle:" };
                label3.SetValue(Grid.RowProperty, 2);
                label3.SetValue(Grid.ColumnProperty, 0);
                grid1.Children.Add(label3);
                var rect1 = new Rectangle() { Height = 100.0 };
                rect1.SetValue(Grid.RowProperty, 2);
                rect1.SetValue(Grid.ColumnProperty, 1);
                var brush = new LinearGradientBrush()
                {
                    StartPoint = new Point(0.0, 0.0),
                    EndPoint = new Point(1.0, 1.0)
                };
                brush.GradientStops.Add(new GradientStop() { Color = Colors.Yellow, Offset = 0.0 });
                brush.GradientStops.Add(new GradientStop() { Color = Colors.Red, Offset = 1.0 });
                rect1.Fill = brush;
                grid1.Children.Add(rect1);
    
                rect1.MouseLeftButtonDown += rect1_MouseLeftButtonDown;
            }
    
            void rect1_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
            {
                this.Title = e.GetPosition(grid1).ToString();
            }
        }
    }
    


  8. MainWindow.xaml.csコードの解説
    (1)private void Window_Loadedはウインドウがロードされるときに呼び出されます。
    (2) grid1.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(100) });は変数grid1.ColumnDefinitionsに初期値がGridLength(100)のColumnDefinition() 型変数を生成し代入します。
    (3)上記は代入のためNewを2回使用していますが、変数が単純定数でなくクラスで定義されているため、このように複雑な記載となります。
    (4)var label1 = new Label() { Content = "Slider:" };は変数label1をLabel()型で初期値{.Content = "Slider:"}にして生成します。
    (5)label1.SetValue(Grid.RowProperty, 0);はlabel1のGrid.RowPropertyに0を設定します。
    (6)grid1.Children.Add(label1)はlabel1をgrid1をはめ込みます。
    (7)var slider1 = new Slider();は変数slider1をSlider()型で生成します。
    (8)slider1.SetValue(Grid.ColumnProperty, 1);はslider1のGrid.ColumnPropertyに1を設定します。
    (9) grid1.Children.Add(slider1);はslider1をgrid1をはめ込みます。
    (10)var tbox1 = new TextBox();は変数tbox1をTextBox()型で生成します。
    (11)tbox1.SetValue(Grid.RowProperty, 1)はtbox1のGrid.RowPropertyに1を設定します。
    (12)var binding = new Binding() { Source = slider1, Path = new PropertyPath(Slider.ValueProperty) };
    は変数bindingをBinding()型で初期値 {.Source = slider1, .Path = new PropertyPath(Slider.ValueProperty)}で生成します。
    (13)Path = new PropertyPath(Slider.ValueProperty)はパスにPropertyPath(Slider.ValueProperty)型のパスを設定します。
    (14)tbox1.SetBinding(TextBox.TextProperty, binding);はtbox1のBindingに(TextBox.TextProperty, binding)を設定します。
    (15)var rect1 = new Rectangle() { Height = 100.0 };はは変数rect1をRectangle()で初期値{.Height = 100.0}にして生成します。
    (16)rect1.SetValue(Grid.RowProperty, 2);はrect1のGrid.RowPropertyに2を設定します。
    (17) var brush = new LinearGradientBrush()
    {StartPoint = new Point(0.0, 0.0),EndPoint = new Point(1.0, 1.0)}
    brush.GradientStops.Add(new GradientStop() { Color = Colors.Yellow, Offset = 0.0 }); brush.GradientStops.Add(new GradientStop() { Color = Colors.Red, Offset = 1.0 });
    rect1.Fill = brush;は四角にグラデーションを設定します。
    (18)grid1.Children.Add(rect1);はslider1を rect1をはめ込みます。
    (19)rect1.MouseLeftButtonDown += rect1_MouseLeftButtonDown;は
    rect1_MouseLeftButtonDownイベント関数を発生させます。
    (20) void rect1_MouseLeftButtonDownはrect1_MouseLeftButtonDownイベントで呼び出されます。
    (21)this.Title = e.GetPosition(grid1).ToString();はウインドウタイトルに座標を表示します。


    感想:
    (1)MainWindow.xaml.csコードは長いので解読は大変です。
    (2)VBからC#への変換は、すんなりできました。
    (3)変数の型にverを使用すると自動変換されるので便利です。







24章:10 行でズバリ!! [C#] Silverlight アプリケーションの開発に行く。

トップページに戻る。