第0章 パネルとレイアウト 1/3

C#.use(better, IronPython=”WPF”)　《記事一覧》
パネルとレイアウト

《著》本間りす《監修》小泉ひよ子とタマゴ倶楽部


レイアウト〔layout〕は、アプリケーションを構成する雑多な要素に秩序を与えます。クラス Panel では、さまざまなレイアウトに共通する機能を提供します。そのため、構成要素を統一的に管理するためには、このクラスの役割を理解するのが早道です。
《参照》レイアウトの詳細は、第６章「@」で解説します。□

Panel

Panel を拡張したコントロールには「複数の」オブジェクトを格納できます。

    System.Windows.Controls.Panel

    +-- System.Windows.Controls.Canvas

    +-- System.Windows.Controls.DockPanel

    +-- System.Windows.Controls.Grid

    +-- System.Windows.Controls.StackPanel

    +-- System.Windows.Controls.WrapPanel

    +-- ...

分離コードでは、プロパティー Children を利用して、さまざまな UIElements を配置します。

事例：Canvas

例題を使って、その便利な機能のいくつかを紹介します。キャンバス（親要素）の中に、別のキャンバス（子要素）を置いて、入れ子構造（親子関係）にできます。


>ipy.exe cat.py xCanvas.xaml

このアプリケーションを起動すると、背景の白い親キャンバスの中に、３つの子キャンバス（赤/緑/青）を置いているのが分かります。
《付記》XAML ファイルをダブルクリックするだけでも、起動できます。□

マークアップ：Canvas

マークアップでは、タグを入れ子するだけで、各要素の親子関係を記述できます。

  <Canvas Width="180" Height="120">

    

    

    <Canvas

      Width="50" Height="50" Top="50" Left="50"

      Background="Blue" />

プロパティー Width=/Height= には、幅/高さを指定します。プロパティー Top=/Left= には、親要素の上端/左端からのオフセット位置を指定します。プロパティー Background= には、背景色を指定します。
まず、ウィンドウの中に、１つのキャンバスを配置します。次に、このキャンバスの中に、３つのキャンバスを配置します。最後のキャンバスは、幅 Width=50 高さ Height=50 を持ち、上端から Top=50 左端から Left=50 の位置に置かれ、青 Background=Blue で描かれます。すると、このようなウィンドウが現れます。


1/3