如何在 WPF 中保持可縮放、可滾動內容的縱橫比？

Question

我對 WPF 還很陌生，我遇到了一個似乎有點難以解決的問題。 基本上我想要一個可擴展的 4x4 網格，但保持方形（或任何其他任意）縱橫比。 這實際上看起來很棘手，這讓我感到驚訝，因為我認為這是一個相當普遍的要求。

我從這樣的 Grid 定義開始：

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

現在，如果您將其設置為拉伸，它可以填充窗口或您放入的任何容器。行和列是統一的，但縱橫比不固定。

然后我嘗試將它放在 StackPanel 中以使用可用空間。 沒有幫助。 當我想起 Viewboxes 時，是什么讓我大吃一驚。

<StackPanel Orientation="Horizontal">
  <Viewbox>
    <Grid Height="1000" Width="1000"> <!-- this locks aspect ratio -->
      <Grid.RowDefinitions>
        <Grid.RowDefinition Height="*"/>
        <Grid.RowDefinition Height="*"/>
        <Grid.RowDefinition Height="*"/>
        <Grid.RowDefinition Height="*"/>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <Grid.ColumnDefinition Width="*"/>
        <Grid.ColumnDefinition Width="*"/>
        <Grid.ColumnDefinition Width="*"/>
        <Grid.ColumnDefinition Width="*"/>
      </Grid.ColumnDefinition>
      ...
    </Grid>
  </viewbox>
  <Label HorizontalAlignment="Stretch">Extra Space</Label>
</StackPanel>

現在我的內容可以縮放並保持縱橫比。 問題是，如果窗口不夠寬，我的一些網格就會離開屏幕。 如果是這種情況，我希望能夠滾動到它。 同樣，我可能需要一個最小尺寸，這也可能導致垂直滾動。

現在我已經嘗試將我的 StackPanel 和 Grid（單獨）放在適當的 ScrollViewer 容器中，但內容不再縮放以適應窗口。 它變成全尺寸，這是不好的。

那么我該怎么做呢？ 我是不是叫錯了樹？ 有沒有更好/更簡單的方法來做到這一點？

Answer 1

您需要將內容（網格）放在Viewbox 中，並將Viewbox.Stretch 屬性設置為Stretch.Uniform

Viewbox 控件用於拉伸或縮放子元素，並讓您控制子元素的拉伸方式。 檢查這里的例子。

_{（來源： microsoft.com ）}

Answer 2

在這種情況下，最好的選擇是UniformGrid 。 這僅在您需要 NxN 網格時才有用。

Answer 3

您需要在窗口上設置SizeToContent="WidthAndHeight"以提供您所追求的行為。

Answer 4

為每個 Column 和 RowWidth 放置 0.25* 而不是 *