Вопрос макета WPF

Question

Я немного застрял в реализации довольно простого требования макета.Я хочу показать изображение, а под изображением - кнопку.Изображение должно быть показано целиком, поэтому при необходимости его следует уменьшить, но не увеличивать.

Вот что я хочу:

Кажется простым, но я не могу понять, возможно ли это даже в XAML.Очевидно, что Stackpanel не работает, как и DockPanel, и я не вижу решения с Grid.

Вот моя попытка с DockPanel:

<DockPanel>
    <Button DockPanel.Dock="Bottom">Button</Button>
    <Viewbox 
        Stretch="Uniform"
        MaxWidth="{Binding ElementName=bigImage, Path=ActualWidth}" 
        MaxHeight="{Binding ElementName=bigImage, Path=ActualHeight}">
        <Image x:Name="bigImage"/>
    </Viewbox>
</DockPanel>

Очевидно, что окно просмотра изображения всегда будет заполнять оставшееся пространство, поэтому кнопка всегда будет внизу всего контейнера, а не внизу изображения.

Есть идеи?

Answer 1

Это должно делать то, что вы хотите:

  <Grid>  
    <DockPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <Button DockPanel.Dock="Bottom">Button</Button>
        <Image x:Name="bigImage" StretchDirection="DownOnly" />
    </DockPanel>
  </Grid>

Answer 2

<Grid>
   <Grid.RowDefinitions>
     <RowDefinition Height="*"/>
     <RowDefinition Height="Auto"/>
   </Grid.RowDefinitions>
   <Image Source="photo.PNG" Stretch="Uniform" StretchDirection="DownOnly"/>
   <Button Content="Button" Grid.Row="1" HorizontalAlignment="Left"/>
</Grid>

Вы можете использовать только одну сетку. Если для параметра StretchDirection установлено значение DownOnly, указывать максимальный размер не требуется.