Question

我是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”也会占用尽可能多的水平空间，但是CROPS AT屏幕的底部，因为没有屏幕。

从我迄今为止所做的所有研究中，我认为不应该发生任何意见 - 他们都应该找到适合屏幕的方式。

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

感谢。

Answer 1

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

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

填充 - 将图像拉伸到完全并准确填充显示区域。这可能会导致图像失真。
AspectFill - 剪切图像，使其填充显示区域，同时保留纵横比（即无失真）。
AspectFit - 将图像装入信箱（如果需要），以便整个图像适合显示区域，顶部/底部或侧面添加空白，具体取决于图像是宽还是高。

你使用AspectFit作为circles2.jpg并使用HorizontalOptions =“FillAndExpand”图像控件将足够长的时间来放置你的circles2.jpg。如下图所示，蓝色是图像控制，红色是你的circles2.jpg 。当你的circles2.jpg足够大时，图像控制会分散注意力。

如何让.bmp图片保持在屏幕范围内？

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

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

以Xamarin形式获取不需要的裁剪图像

1 个答案: