如何在ViewBox和WPF中的图像之间添加水平按钮行？

Question

我正在尝试在图像和视图框之间的表单顶部添加一行水平按钮，但是当我添加按钮时，它会填充图像。我尝试添加一个网格来包含按钮，但填充了图像元素。有谁知道我会怎么做到这一点？

我确信必须快速解决这个问题，有人可以解释为什么会这样吗？我通常使用设计师但我认为在这种情况下我应该更好地理解xaml元素和属性。

这是我定义窗口布局的方式：

<Window x:Class="KinectKickboxingBVversion1.ConditioningFrm"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ConditioningFrm"  Height="377.612" Width="637.313">
    <Grid>

        <Viewbox Grid.Row="1" Stretch="Uniform" HorizontalAlignment="Center">

            <Image Name="Image" Width="640" Height="250"/>

           </Viewbox>

    </Grid>
</Window>

将图像源设置为位图：

KinectVideo.Source = BitmapSource.Create(colorFrame.Width, colorFrame.Height, 96, 96,
                    PixelFormats.Bgr32, null, colorData, colorFrame.Width * colorFrame.BytesPerPixel)

Answer 1

如果您想将其放在表单顶部而不进行缩放，请执行以下操作：

<Window x:Class="KinectKickboxingBVversion1.ConditioningFrm"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="ConditioningFrm"  Height="377.612" Width="637.313">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefintion Height="Auto" />
            <RowDefintion Height="*" />
        </Grid.RowDefinitions>

        <StackPanel Orientation="Horizontal" Grid.Row="0">
            <Button Content="1"/>
            <Button Content="2"/>
            <Button Content="2"/>
        </StackPanel>
        <Viewbox Grid.Row="1" Stretch="Uniform" HorizontalAlignment="Center">
            <Image Name="Image" Width="640" Height="250"/>
       </Viewbox>
    </Grid>
</Window>

如果您真的想在Viewbox中添加StackPanel按钮，请执行以下操作：

<Window x:Class="KinectKickboxingBVversion1.ConditioningFrm"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="ConditioningFrm"  Height="377.612" Width="637.313">

    <Viewbox Stretch="Uniform" HorizontalAlignment="Center">
        <StackPanel Orientation="Vertical">
            <StackPanel Orientation="Horizontal">
                <Button Content="1"/>
                <Button Content="2"/>
                <Button Content="2"/>
            </StackPanel>
            <Image Name="Image" Width="640" Height="250"/>
        </StackPanel>
    </Viewbox>
</Window>

将图像源设置为位图：

KinectVideo.Source = BitmapSource.Create(colorFrame.Width, colorFrame.Height, 96, 96,
                    PixelFormats.Bgr32, null, colorData, colorFrame.Width * colorFrame.BytesPerPixel)