Xaml 如何在Xamarin.表单中居中而不拉伸图像

我有一个

ContentPage

：

<ContentPage.Content>
    <Grid>
        <Image
            Source="background.png"
            Aspect="AspectFill"
        />
        <Image
            Source="logo.png"
            VerticalOptions="Center"
            HorizontalOptions="Center"
        />
    </Grid>
</ContentPage.Content>

但是logo.png（垂直和水平输入）会延伸到整个屏幕宽度

我如何阻止它拉伸并保持其原始大小？ 是的，XAML解决方案绝对是首选

编辑1（根据Paul Kertscher的回答）：
如果我将图像源设置为URL（例如），我会得到预期的结果，即图像不会拉伸。但是，如果我将同一个图像保存到特定的平台目录（比如Resources/ComputerSaysNo.png for iOS），它会延伸到整个屏幕宽度。 在iPhone7模拟器上测试

编辑2
如果我在iOS资源目录中制作logo.png的@2x和@3x副本，并且所有三个图像的大小相同，那么效果就不同了；徽标不会拉伸到占据页面的整个宽度。

来自about

AspectFill

缩放图像以填充视图。为了填充视图，可能会剪裁某些零件

您应该使用

AspectFit

，它不会拉伸图像以填充控件，而是将整个图像填充到控件中：

缩放图像以适合视图。某些零件可能会留空（字母框）

编辑

我试过以下方法

<Grid>
    <Image HorizontalOptions="Center" 
           VerticalOptions="Center" 
           Source="http://lorempixel.com/output/abstract-q-c-200-200-6.jpg" />
</Grid>

<AbsoluteLayout>
    <Image AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1" /> <!-- Background -->
    <Image AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds=".5,.5,.2,.2" /> <!-- Logo with 20% width/height  -->
</AbsoluteLayout>

<Image AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds=".5,.5,150,150" />

如果您喜欢绝对设置图像的大小，可以执行以下操作

<Grid>
    <Image HorizontalOptions="Center" 
           VerticalOptions="Center" 
           Source="http://lorempixel.com/output/abstract-q-c-200-200-6.jpg" />
</Grid>

<AbsoluteLayout>
    <Image AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1" /> <!-- Background -->
    <Image AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds=".5,.5,.2,.2" /> <!-- Logo with 20% width/height  -->
</AbsoluteLayout>

<Image AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds=".5,.5,150,150" />

---

我经常使用的另一个选项是AbsoluteLayout。将PositionPropirative（LayoutFlags）与LayoutBounds=“0.5,0.5，-1，-1（X，Y，Width，Height）组合将使图像位于屏幕的中心。LayoutBounds“0.5”表示它将位于X和Y的中心，-1”将有助于忽略宽度和高度。 确保在AbsoluteLayout中将VerticalOptions设置为

代码如下：

<AbsoluteLayout VerticalOptions="FillAndExpand">
    <StackLayout  AbsoluteLayout.LayoutBounds="0.5,0.5,-1,-1" AbsoluteLayout.LayoutFlags="PositionProportional">
        <Image Source="http://lorempixel.com/output/abstract-q-c-200-200-6.jpg" />
    </StackLayout>
</AbsoluteLayout>

---

我希望它有帮助。

您是否尝试过

Aspect=“AspectFill”

它不起作用。我本以为AspectFill会用图像填充视图。这就是它似乎要做的。请参见我的编辑1。您很困惑，有时工作，有时不工作。您添加的屏幕截图“它不起作用”“这叫图像吗？”？。显示带有图像的清晰屏幕截图，以便人们可以帮助您&不要使用媒体网站，例如，很少有开发人员可能无法访问这些网站。您的徽标图片的原始大小是多少？我自己放了一张图片，并使用您的代码，效果很好。@jackHua徽标宽约400像素，高约150像素。您的徽标图像是否在iOS资源目录中？我的原始xaml使用了AspectFit。同样的问题。@aj学习一个屏幕截图（也许还有一个草图）会很有帮助。我想要的是类似于默认Xamarin启动屏幕的东西。在我的情况下，徽标将是X形。但是现在的情况是，我的徽标被拉伸，占据了整个屏幕的宽度。想象X一直延伸到六边形的边接触屏幕的边。啊，现在我知道了。事实上，我认为如果图像真的比屏幕小，那么while

image

视图就不应该扩展以填充整个内容。给我一点时间，我试试看，保罗。不过，我知道行和列定义是如何工作的。不过，我确实有了一个有趣的发现。请参见编辑1。