以 xamarin 形式获取不需要的裁剪图像答案

【问题标题】：Getting unwanted cropped imaged in xamarin forms以 xamarin 形式获取不需要的裁剪图像
【发布时间】：2017-03-31 04:55:24
【问题描述】：

我是 xamarin 的新手，正在尝试使用 xaml 了解视图和图像的基本定位。

这是我的 xaml：

   <ContentPage.Content>
        <StackLayout Spacing="10"
                     x:Name="layout"
                     VerticalOptions="FillAndExpand">
            <Button Text="StackLayout"
              VerticalOptions="Start"
              HorizontalOptions="FillAndExpand"
              Clicked="OnButtonClicked"/>
            <BoxView x:Name="myBoxView"
               Color="Yellow"
               VerticalOptions="FillAndExpand"
               HorizontalOptions="FillAndExpand" />
            <Image x:Name="myImageView"
                   Source="circles2.jpg"
                   Aspect="AspectFit" 
                   VerticalOptions="Center"
                   HorizontalOptions="FillAndExpand"/>
            <Image x:Name="streamedImageView"
                   Source="squares.bmp"
                   Aspect="AspectFit"
                   VerticalOptions="Center"
                   HorizontalOptions="FillAndExpand"/>
        </StackLayout>
    </ContentPage.Content>

程序加载时，出现的是：

大约三分之一的屏幕是黄色的
“circles2.jpg”图像非常小（小于图标）。它似乎炸毁了黄色框。
“squares.bmp”图片占据了整个剩余空间。

如果我将“circles2.jpg”更改为“triangles.bmp”，那么它会在水平方向上占据所有可能的空间，而“squares.bmp”也会在水平方向上占据尽可能多的空间，但在屏幕底部，因为没有屏幕了。

从我目前所做的所有研究来看，我认为不应该裁剪视图——它们都应该找到适合屏幕的方式。

我做错了什么？如何让 .bmp 图片停留在屏幕范围内？

谢谢。

【问题讨论】：

标签： c# layout xamarin view xamarin.forms

【解决方案1】：

你应该了解图像控件属性：

参考：https://developer.xamarin.com/guides/xamarin-forms/working-with/images/

填充 - 拉伸图像以完全准确地填充显示区域。这可能会导致图像失真。
AspectFill - 裁剪图像，使其填充显示区域，同时保留外观（即不失真）。
AspectFit - 对图像进行信箱处理（如果需要），以便整个图像适合显示区域，根据图像是宽还是高，在顶部/底部或两侧添加空白空间。

U 为 circles2.jpg 使用 AspectFit 并使用 HorizontalOptions="FillAndExpand" 图像控件将足够长以放置您的 circles2.jpg。如下图蓝色是图片控件红色是你的circles2.jpg .当您的 circles2.jpg 足够大时，图像控件就会分心。

如何让 .bmp 图片停留在屏幕范围内？

StackLayout不适合你。RelativeLayout应该更好：

https://developer.xamarin.com/guides/xamarin-forms/user-interface/layouts/relative-layout/

【讨论】：