5

我有一个可以通过 api 设置的图像，我希望图像在其宽度超过 250 像素时被剪裁。那行得通。但是，图像与一些文本块一起位于堆栈面板中。即使我们看到的图像被剪裁，实际图像宽度仍然超过 250 像素。

这是xml

<StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                        <Button Foreground="Black" Content="Button" x:Name="BackButton" Style="{StaticResource BackButtonStyle}" Visibility="Collapsed" VerticalAlignment="Center" Margin="25,0,0,0"  Click="BackButtonClick" />
                        <Border>
                            <Image x:Name="LogoImage" Source="Images/Logo.png" Height="50"  Margin="15 0 0 0" Stretch="Uniform" VerticalAlignment="Center">
                                <Image.Clip>
                                    <RectangleGeometry Rect="0 0 50 250"></RectangleGeometry>
                                </Image.Clip>
                            </Image>

                        </Border>
                        <TextBlock Foreground="Black" x:Name="NameTextbox" Margin="15, 0, 0, 0" VerticalAlignment="Center" FontSize="26"></TextBlock>

                        <TextBlock VerticalAlignment="Bottom" x:Name="ErrorMessage" Text="Unable to reach server" Foreground="Red" Margin="15 0 0 0"  FontSize="26" FontWeight="Bold" Visibility="Collapsed"></TextBlock>
                    </StackPanel>

因此，假设图像宽度为 2000 像素。然后图像后面的文本块将被推离屏幕，但只有 250 像素的图像可见。

有什么建议吗？

4

3 回答 3

2

看来我采取了错误的方法。我能够使用禁用滚动的滚动查看器来实现我想要的。

<ScrollViewer MaxWidth="350" HorizontalScrollBarVisibility="Hidden" HorizontalScrollMode="Disabled">
     <Image x:Name="LogoImage" HorizontalAlignment="Left" Source="Images/Logo.png" Height="50" Margin="15 0 0 0" Stretch="Uniform" VerticalAlignment="Center">
     </Image>
</ScrollViewer>
于 2013-02-16T16:19:51.787 回答
1

您可以只设置边框的宽度和高度并将 Image Stretch 设置为 None 并避免使用沉重的 ScrollViewer。

于 2013-02-16T19:32:20.017 回答
0

我试过@FilipSkakun 的回答，效果很好，只做了一次调整：我Image.Stretch把UniformToFill.

我在这里发布我的代码，因为它可能对某人有帮助：

<Border Width="30" Height="30">
    <Border.Clip>
        <EllipseGeometry RadiusX="15" RadiusY="15" Center="15,15" />
    </Border.Clip>
    <Image Source="..." VerticalAlignment="Center" MaxWidth="30" Stretch="UniformToFill" />
</Border>

另外，我可以通过VerticalAlignment属性控制图像定位。

于 2016-04-10T22:03:03.607 回答