Question

我有以下Grid。

 <Grid DockPanel.Dock="Bottom">
     <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="4" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}">
         <Border.RenderTransform>
             <TranslateTransform X="2" Y="2" />
         </Border.RenderTransform>
         <Border.BitmapEffect>
             <BlurBitmapEffect Radius="4" />
         </Border.BitmapEffect>
     </Border>
     <Grid Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
         <Image Source="{Binding Image}"></Image>
     </Grid>
 </Grid>

它呈现这样。

Sample

注意第一个是水平的而另一个是垂直的。

如何告诉Border与内部Grid的尺寸相同？这样我就可以匹配投影。

Answer 1

您发布的代码对我来说很好，边框大小与内部网格的大小相匹配，因为它们都被拉伸以适应外部网格的大小。

如果您的外部网格无论如何都是设置大小，并且您的内部图像是可变大小，您可能需要考虑将边框移动到内部网格并将其水平/垂直对齐设置为中心，这样它就不会伸展以填充它的内容

<Grid DockPanel.Dock="Bottom">
     <Grid HorizontalAlignment="Center" VerticalAlignment="Center" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">

          <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="4" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}">
              <Border.RenderTransform>
                  <TranslateTransform X="2" Y="2" />
              </Border.RenderTransform>
              <Border.BitmapEffect>
                  <BlurBitmapEffect Radius="4" />
              </Border.BitmapEffect>
          </Border>

         <Image Source="{Binding Image}" Height="150" Width="150"></Image>
     </Grid>
 </Grid>

Answer 2

我会尝试以下内容：

<Grid DockPanel.Dock="Bottom">
     <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="4" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"
Width="{Binding ElementName=G, Path=ActualWidth}"
Height="{Binding ElementName=G, Path=ActualHeight}"
     >
         <Border.RenderTransform>
             <TranslateTransform X="2" Y="2" />
         </Border.RenderTransform>
         <Border.BitmapEffect>
             <BlurBitmapEffect Radius="4" />
         </Border.BitmapEffect>
     </Border>
     <Grid x:Name="G" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
         <Image Source="{Binding Image}"></Image>
     </Grid>
 </Grid>

干杯

在WPF中匹配堆叠的项目大小

2 个答案: