代码之家 › 专栏 › 技术社区 › Otto Abnormalverbraucher

具有基于内容的行定义的网格

wpfgrid wpf

0

Otto Abnormalverbraucher · 技术社区 · 7 年前

我正在尝试做一些像一个图像与可调的边缘。图像本身实际上是一条路径,位于StackPanel中,垂直拉伸。stackpanel的宽度可以调整,我想保持图像的比率和路径大小与边距的比率。

<StackPanel>
  <Grid HorizontalAlignment="Stretch">
    <Grid.RowDefinitions>
      <RowDefinition Height="0.25*"/>
      <RowDefinition Height="0.5*"/>
      <RowDefinition Height="0.25*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="0.25*"/>
      <ColumnDefinition Width="0.5*"/>
      <ColumnDefinition Width="0.25*"/>
    </Grid.ColumnDefintions>

    <Path Grid.Row="1"
          Grid.Column="1"
          Data="...blabla..."
          Fill="#FF0072C6"
          Stretch="UniformToFill"/>
  </Grid>
</StackPanel>

现在,问题是,即使路径对象在网格中绘制,第一行和第三行的高度始终为零,而不是基于第二行的高度进行设置。我知道这是因为网格位于stackpanel中,它忽略了自动高度设置,甚至不允许网格垂直拉伸(或水平拉伸,具体取决于方向)。如果我给网格设置一个固定的高度,它确实可以工作,但这会在调整大小时破坏图像的纵横比。我怎样才能让它工作?

这就是我所拥有的:

这就是我想要的:

编辑:

我的问题似乎有点混乱。所以希望澄清一下,在调整stackpanel的大小之后,下面是期望的结果:

如您所见,整个网格应该像实际图像一样调整大小。网格应保持其纵横比。这与网格内的路径无关。

1 回复 | 直到 7 年前

1

Babbillumpa 7 年前

如果我已经正确地理解了这个问题,一个简单的解决方案可以是固定大小和使用 视图框 以下内容:

<StackPanel>

<!--The other rows-->

    <Viewbox>
        <Grid Width="100" Height="100">
            <Grid.RowDefinitions>
                <RowDefinition Height="25"/>
                <RowDefinition Height="50"/>
                <RowDefinition Height="25"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="25"/>
                <ColumnDefinition Width="50"/>
                <ColumnDefinition Width="25"/>
            </Grid.ColumnDefinitions>
            <Path Grid.Row="1"  Grid.Column="1"   Data="M8.5,13.5L11,16.5L14.5,12L19,18H5M21,19V5C21,3.89 20.1,3 19,3H5A2,2 0 0,0 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19Z" Fill="Blue" Stretch="Uniform" />
        </Grid>
    </Viewbox>
</StackPanel>