Question

我正在使用WPF中的Scroll Viewer和Stack Panel设计一个成像库，如下所示：

<ScrollViewer x:Name="ShopsScroll" Grid.Row="1" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden">
        <StackPanel x:Name="stackPanel" Margin="0" Orientation="Horizontal" Height="Auto">
            <Image Source="Images/1F/L1_angesb.jpg"/>
            <Image Source="Images/1F/L1_chanel.jpg"/>
            <Image Source="Images/1F/L1_dior.jpg"/>
            <Image Source="Images/1F/L1_gucci.jpg"/>
            <Image Source="Images/1F/L1_LV.jpg"/>
            <Image Source="Images/1F/L1_nike.jpg"/>
</StackPanel>

由于图像尺寸很大，我想调整它们的大小以适应StackPanel的高度。但是，当我在StackPanel中将height的值设置为“Auto”时，它只使用了图像的高度，而不是其父ScrollViewer。如果我将一个修复值设置为StackPanel，问题似乎已修复，但我需要在全屏幕中使用我的应用程序在不同大小的屏幕上。因此，它应该适应不同的大小，但不能硬编码固定值。

我是怎么做到的？

Answer 1

您可以使用元素绑定将图像的高度绑定到StackPanel元素的高度。抱歉，我现在无法测试此代码，但尝试类似

<Image Source="Images/1F/L1_nike.jpg" Height="{Binding ElementName=ShopsScroll, Path=Height}" />

请参阅MSDN documentation on the Binding.ElementName property。

当您想要绑定到应用程序中另一个元素的属性时，此属性很有用。例如，如果要使用Slider控制应用程序中另一个控件的高度，或者想要将控件的内容绑定到ListBox控件的SelectedValue属性。

Answer 2

尝试为stackpanel

设置HorizontalAlignment = "Stretch"和VerticalAlignment = "Stretch"

在我看来，最好在你的情况下让ItemsControl包含图像

<ItemsControl HorizontalContentAlignment="Stretch">
            <Image Source="Images/1F/L1_angesb.jpg"/>
            <Image Source="Images/1F/L1_chanel.jpg"/>
            <Image Source="Images/1F/L1_dior.jpg"/>
            <Image Source="Images/1F/L1_gucci.jpg"/>
            <Image Source="Images/1F/L1_LV.jpg"/>
            <Image Source="Images/1F/L1_nike.jpg"/>

</ItemsControl>

希望这有帮助

堆栈面板内的图像高度

2 个答案: