Silverlight/XAML設計問題 - 水平對齊（對接？）

Question

我有一個關於使用什麼XAML來實現我的設計的問題。我目前在屏幕上有一個圖像區域，寬度可以變化。在圖片上方，我有兩個工具欄，每個工具欄都有多個按鈕。其中一個我想漂浮/停靠在圖像的左邊緣，另一個我想漂浮/停靠在右邊緣。當然，隨着圖像變大，右側的工具箱應保持停靠在右側邊緣。這怎麼能實現？

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

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

任何XAML代碼示例和簡要說明將不勝感激。我是小白。

Answer 1

使用兩行兩列的網格（列寬設置爲自動）。圖像將跨越第二行的兩列。網格的大小與其內容相同，隨着網格的增長（因爲圖像已經增長），右對齊的工具欄將會移動以保持與圖像的對齊。下面是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> 

更改矩形的名爲「圖像」的寬度才能看到效果。

希望這有助於...

克里斯