如何在 Xamarin 的 stackLayout 中全屏填充图像？答案

【问题标题】：how to Fill Image fullscreen in stackLayout in Xamarin?如何在 Xamarin 的 stackLayout 中全屏填充图像？
【发布时间】：2015-11-26 05:54:38
【问题描述】：

*如何在 Xamarin 的 stackLayout 中全屏填充图像？我无法将图像设置为适合堆栈布局 .XAML 文件代码

  <StackLayout Padding="0" BackgroundColor="Yellow">
    <Image Source="ic_splash.png" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" > </Image>
  </StackLayout>
</ContentPage>

输出 Android 和 Window Phone 的屏幕截图.... 我想把图片放在背景中。*

【问题讨论】：

@chsword 物理键是什么意思？
我在 Xamarin 表单中遇到了同样的问题，我正在使用 WebView。
只需删除 StackLayout

标签： c# .net xaml xamarin xamarin.android

【解决方案1】：

最后我用下面的代码解决了问题....

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                       x:Class="Your.Namespace.Views.LoginView"
             Title="{Binding Title}"
             BackgroundImage="BackgroundImage.png">
  <StackLayout>
    <!-- Your stuff goes here -->
  </StackLayout>
</ContentPage>

我已使用上述代码将背景图片设置为适合屏幕......

BackgroundImage="BackgroundImage.png"

【讨论】：

您好，我想在屏幕的背景图像中添加 'scaleTo' 属性，如果我们使用 backgroundimage 来适应全屏图像，我们将无法应用 'scaleTo' 属性。

【解决方案2】：

BackgroundImage 属性的问题是图像比例可能会随着屏幕尺寸的变化而变化。

Here 我找到了如何使用 RelativeLayout 填充整个屏幕并保存比例：

<RelativeLayout>
  <Image Source="Jupiter.png" Opacity="0.3"
              RelativeLayout.WidthConstraint=
                "{ConstraintExpression Type=RelativeToParent, Property=Width}"
              RelativeLayout.HeightConstraint=
                "{ConstraintExpression Type=RelativeToParent, Property=Height}"/>
  <Grid RelativeLayout.WidthConstraint=
            "{ConstraintExpression Type=RelativeToParent, Property=Width}"
          RelativeLayout.HeightConstraint=
            "{ConstraintExpression Type=RelativeToParent, Property=Height}">

    <Label Text="Hello world from XAML"/>
  </Grid>
</RelativeLayout>

【讨论】：

【解决方案3】：

或者使用您的第一个代码，您可以将图像属性 aspect 设置为 AspectFill，这最终会裁剪您的图像，同时保持宽高比。

<StackLayout Padding="0" BackgroundColor="Yellow">
<Image Source="ic_splash.png" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Aspect="AspectFill" > </Image>

【讨论】：

【解决方案4】：

因为你的安卓模拟器上没有物理键。使用带有物理密钥的模拟器会很好

【讨论】：