如何保持纵横比在WPF可扩展的,滚动的内容?内容、WPF

2023-09-02 21:10:25 作者:别惹我我和贞子姐很熟

我是相当新的WPF和我遇到了似乎有点棘手,解决的一个问题。基本上我想要一个4x4格那可扩展的,但保持一个正方形(或任何其他任意)宽高比。这实际上似乎相当棘手的事情,这让我吃惊,因为我会想象它的一个合理的共同要求。

I'm fairly new to WPF and I've come across a problem that seems a bit tricky to solve. Basically I want a 4x4 grid thats scalable but keeps a square (or any other arbitrary) aspect ratio. This actually seems quite tricky to do, which surprises me because I would imagine its a reasonably common requirement.

我开始喜欢这个网格的定义:

I start with a Grid definition like this:

<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>

现在,如果你设置的伸展,它可以填补窗口或其他容器中,你把它的行和列的都是统一的,但纵横比是不固定的。

Now if you set that to stretch, it can fill the Window or whatever container you put it in. The rows and column are uniform but the aspect ratio isn't fixed.

然后我试图把它放在一个StackPanel中使用的可用空间。没有帮助。什么让我很多时候我想起Viewboxes有方式。

Then I tried putting it in a StackPanel to use the available space. Didn't help. What did get me most of the way there was when I remembered 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>

现在我的内容尺度,并保持宽高比。问题是,如果窗口不够宽,我的一些格是关闭屏幕。我希望能够滚动到它,如果是这样的话。同样,我可能需要的最小尺寸,这可能会导致垂直滚动了。

Now my content scales and keeps aspect ratio. The problem is that if the window isn't wide enough some of my grid is off the screen. I'd like to be able to scroll to it if that were the case. Likewise, I might need a minimum size, which might lead to vertical scrolling too.

现在我试图把我的StackPanel和网格(单独)在适当的ScrollViewer容器但随后的内容不再进行调整以适合窗口。它关系到全尺寸的,这是没有好处的。

Now I've tried putting my StackPanel and Grid (separately) in an appropriate ScrollViewer container but then the content no longer scales to fit the window. It goes to full size, which is no good.

因此​​,我怎么去这样做?我是不是找错了树?是否有这样做的更好/更简单的方法?

So how do I go about doing this? Am I barking up the wrong tree? Is there a better/easier way of doing this?

推荐答案

您需要把内容(网格)一个的视框并设置Viewbox.Stretch物业以Stretch.Uniform

You need to put the content (the grid) inside a ViewBox and set the Viewbox.Stretch Property to Stretch.Uniform

视框控件用来拉伸或缩放的子元素,并允许您控制孩子被拉伸的方式。检查范例这里。

The Viewbox control is used to stretch or scale a child element and lets you control the way the child is stretched. Check the examples here.