はじめに
xamlファイルを全く記述しないでC#のコードだけでGUIを構築するのが目標です。今回も「XAML」「バインディング」などの知識ゼロのまま進めていきます。前回まではButtonの文字サイズを自動調整するためにViewboxを使ってきました。
Button left_button = new Button(); left_button.Content = new Viewbox() { Child = new Label { Content = "左のbuttonだよ" } };
今回は少しちがう使い方を試してみます。
今回の目的
右半分の真ん中の白いエリアに注目して下さい。Windowサイズを変更しても正方形が崩れていません。
Viewboxを使うとこのようなことが可能になります。この方法について学習します。
方法
RowDefinitionのHeightをautoに設定する
right_grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) }); right_grid.RowDefinitions.Add(new RowDefinition() { Height = GridLength.Auto }); right_grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) });
センターに挿入するGridのサイズを指定する
サイズの数値はWidth、Heightの比が1:1であれば何でもいいです。Grid right_center = new Grid() { Width = 200, Height = 200 };
センターに挿入するGridをViewboxに挿入する
Viewbox right_center_box = new Viewbox { Child = right_center };
ViewboxをGridに挿入する
Grid.SetRow(right_center_box, 1);
right_grid.Children.Add(right_center_box);
全体のコード
private void WindowSetting() { Grid mainGrid = new Grid(); mainGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(7, GridUnitType.Star) }); mainGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(3, GridUnitType.Star) }); Content = mainGrid; Button left_button = new Button(); left_button.Content = new Viewbox() { Child = new Label { Content = "左のbuttonだよ" } }; Grid.SetColumn(left_button, 0); mainGrid.Children.Add(left_button); Button button1 = new Button(); button1.Content = new Viewbox() { Child = new Label { Content = "上のbuttonだよ" } }; Button button2 = new Button(); button2.Content = new Viewbox() { Child = new Label { Content = "下のbuttonだよ" } }; Grid right_grid = new Grid(); Grid.SetColumn(right_grid, 1); mainGrid.Children.Add(right_grid); right_grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) }); right_grid.RowDefinitions.Add(new RowDefinition() { Height = GridLength.Auto }); right_grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) }); Grid right_center = new Grid() { Width = 200, Height = 200 }; Viewbox right_center_box = new Viewbox { Child = right_center }; Grid.SetRow(button1, 0); Grid.SetRow(right_center_box, 1); Grid.SetRow(button2, 2); right_grid.Children.Add(button1); right_grid.Children.Add(right_center_box); right_grid.Children.Add(button2); }
さいごに
間違いや改善点があればコメント頂けましたら幸いです。つづきはこちらです。Windows Presentation Foundation (WPF) に入門してみる part 5 テンキー付きの計算ドリルを作る - パソコン関連もろもろ
前回までの記事
Windows Presentation Foundation (WPF) に入門してみる part 1 - パソコン関連もろもろWindows Presentation Foundation (WPF) に入門してみる part 2 Imageを並べる - パソコン関連もろもろ
Windows Presentation Foundation (WPF) に入門してみる part 3 ComboBoxを使う - パソコン関連もろもろ