如何在WPF中保持可缩放,可滚动内容的宽高比？

Question

我是WPF的新手,我遇到了一个似乎有点难以解决的问题.基本上我想要一个可扩展但保持正方形(或任何其他任意)宽高比的4x4网格.这实际上看起来相当棘手,这让我感到惊讶,因为我认为这是一个相当普遍的要求.

我从这样的网格定义开始:

<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网格时才有用.