Canvasですと、後で余白を追加する際に、融通が利かなかった為です。
Gridは意外に便利でした。
アンカーを付ける(例:HorizontalAlignment="Stretch")ことができるので、急な寸法変更にも楽に対応できます。
ちなみに、Cavnasを使うと、XAMLの書き方は、こんな感じです。
<Canvas> <!-- 表のセル、枠線付きで --> <Label Content="{Binding xxx}" Padding="3,1,0,1" BorderBrush="Black" BorderThickness="1" Canvas.Left="53" Canvas.Top="56" /> ... </Canvas>
Canvas.LeftとCanvas.Topが即値です。レイアウトが崩れにくくていい感じかもしれませんが、いざ横幅を縮めるとなると、再調整に掛かる重労働は必至です。。。
Labelを使うのは、枠線を付けられるからです。TextBlockでは、枠線が付きません。
問題点:
- 箱のかたまりを、他の場所にコピーしたい場合。Canvas.LeftやCanvas.Topの数値を後から手で触るのは大変そう。
- 余白を付けずに用紙を設計してしまった場合。後でMargin="20"を追加すると、かなり幅が縮みます。
課題山盛りで、試行錯誤を致しました。
そこで、次の様にし、落ち着きました。
<Grid HorizontalAlignment="Left" VerticalAlignment="Top" Margin="4,98,0,0" Height="46" Width="389"> <Grid.RowDefinitions> <RowDefinition Height="21*" /> <!-- ヘッダ --> <RowDefinition Height="25*" /> <!-- 金額部分 --> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="113*" /> <!-- 発行年月日 --> <ColumnDefinition Width="71*" /> <!-- 御得意先 --> <ColumnDefinition Width="54*" /> <!-- 担当 --> <ColumnDefinition Width="54*" /> <!-- 区分 --> <ColumnDefinition Width="97*" /> <!-- 伝票No. --> </Grid.ColumnDefinitions> <Rectangle Grid.RowSpan="2" Grid.ColumnSpan="5" RadiusY="5" RadiusX="5" Stroke="Black" /> <Border BorderBrush="Black" BorderThickness="0,1,0,0" Grid.ColumnSpan="5" Grid.Row="1" /> <Border BorderBrush="Black" BorderThickness="1,0,0,0" Grid.RowSpan="2" Grid.Column="1" /> <Border BorderBrush="Black" BorderThickness="1,0,0,0" Grid.RowSpan="2" Grid.Column="2" /> <Border BorderBrush="Black" BorderThickness="1,0,0,0" Grid.RowSpan="2" Grid.Column="3" /> <Border BorderBrush="Black" BorderThickness="1,0,0,0" Grid.RowSpan="2" Grid.Column="4" /> <Label Content="発 行 年 月 日" Padding="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Grid.Column="0" /> <Label Content="御得意先" Padding="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Grid.Column="1" /> <Label Content="担 当" Padding="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Grid.Column="2" /> <Label Content="区 分" Padding="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Grid.Column="3" /> <Label Content="伝 票 No." Padding="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Grid.Column="4" /> <Label Content="{Binding [日付],StringFormat=yyyy.MM.dd}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Padding="1" Grid.Row="1" Grid.Column="0" /> <Label Content="{Binding [得コード]}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Padding="1" Grid.Row="1" Grid.Column="1" /> <Label Content="{Binding [担当]}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Padding="1" Grid.Row="1" Grid.Column="2" /> <Label Content="{Binding [区分]}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Padding="1" Grid.Row="1" Grid.Column="3" /> <Label Content="{Binding [伝票番号]}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Padding="1" Grid.Row="1" Grid.Column="4" /> </Grid>
プレビュー:
特に機密情報を含まないので、そのまま載せています。
構造は次のようなイメージです:
<Grid>
Grid横の情報を定義
Grid縦の情報を定義
枠線エリア
Rectangleで、丸い枠を描画します。Grid.ColumnSpanとGrid.RowSpanを明示する必要が有ります。
Borderで、上だけ線、左だけ線、の形で使って、格子を描画しています。
ヘッダエリア
Labelを使っています。Grid.ColumnとGrid.Rowを使い、所定のセルへ格納します。Width/Heightを書く必要は全く有りません。
ボディーエリア
Binding中、[日付]の[]は、IDictionary辞書の中を見るので、付けます。
</Grid>
このように記述すると、すっきり致しませんか?
ColumnDefinition Width="113*"と書くと、比率ベースで寸法が決まります。親Gridの大きさが変わったとしても、レイアウトが極端に崩れる心配が有りません。
という事で、この形が目下での理想かな、と考えています。
0 件のコメント:
コメントを投稿