Question

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

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

输出Android和Window Phone的屏幕截图.... 我想在背景中使用图像。*

Answer 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"

Answer 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>

Answer 3

因为你的android模拟器上没有物理键。通过使用具有物理键的模拟器将很好

Answer 4

或者使用您的第一个代码，您可以将图像属性方面设置为AspectFill，这样最终会在保持纵横比的同时剪裁图像。

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

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

4 个答案: