1

設計を実現するためにどのXAMLを使用するかについて質問があります。現在、画面に画像領域があります。幅は変わる可能性があります。画像の上に2つのツールバーがあり、それぞれに多数のボタンがあります。1つは画像の左端にフロート/ドッキングしたいもので、もう1つは右端にフロート/ドッキングしたいものです。もちろん、画像が大きくなるにつれて、右側のツールボックスは右端にドッキングされたままになります。これはどのように達成できますか?

+--------------------------+                                +---------------+
|  TOOLBAR 1               |                                |  TOOLBAR 2    |
+--------------------------+                                +---------------+

+---------------------------------------------------------------------------+
|                                                                           |
|                                                                           |
|                                                                           |
|                    <----- VARIABLE-WIDTH IMAGE ----->                     |
|                                                                           |
|                                                                           |
|                                                                           |
+---------------------------------------------------------------------------+

XAMLコードサンプルと簡単な説明をいただければ幸いです。私は初心者です。

4

1 に答える 1

4

2行2列のグリッドを使用します(列幅は自動に設定されています)。画像は2行目の両方の列にまたがります。コンテンツに合わせたサイズのグリッド。グリッドが大きくなると(画像が大きくなるため)、右揃えのツールバーが移動して、それに応じて画像と揃えられたままになります。ツールバーと画像の代わりに長方形を使用したXAMLの例を次に示します。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <Rectangle Name="Toolbar1" Fill="#FF894220" Width="200" Height="50" VerticalAlignment="Top" HorizontalAlignment="Left" Grid.Row="0" Grid.Column="0" />
    <Rectangle Name="Toolbar2" Fill="#FF894220" Width="200" Height="50" VerticalAlignment="Top" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="1" />
    <Rectangle Name="Image" Fill="#FFB94222" Width="500" Height="100" VerticalAlignment="Top" HorizontalAlignment="Left" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" />
</Grid>

「画像」という名前の長方形の幅を変更して、効果を確認します。

お役に立てれば...

クリス

于 2010-09-30T14:39:51.533 に答える