Xamarin 窗体如何删除带有子项的布局填充

Question

我是Xamarin Form的初学者。这是我的 xaml 代码：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:BluePin"
             x:Class="BluePin.MainPage"
             x:Name="MainContentPage">
    <RelativeLayout>
            <Image Source="BG.png" 
                   Aspect="AspectFill"></Image>
    </RelativeLayout>
</ContentPage>

在此处输入图像描述

我测试了所有 xamarin 布局和控件。请看图片，布局和控制之间有红色的距离(图片(。如何删除此距离并将图像设置为全屏？

Answer 1

将图像设置为全屏

有两种方法可以实现这一点：

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"
         xmlns:local="clr-namespace:BluePin"
         x:Class="BluePin.MainPage"
         x:Name="MainContentPage"
         BackgroundImage="BG.png"
         >
</ContentPage>

2.使用堆栈布局：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:BluePin"
         x:Class="BluePin.MainPage"
         x:Name="MainContentPage">
    <StackLayout>
      <Image Source="BG.png" 
           HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" 
           Aspect="Fill" />
    </StackLayout>    
</ContentPage>

Answer 2

试试这个：

<ContentPage.Content>
    <RelativeLayout>
         <Image Aspect="AspectFill" Source="BG.png"
                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent,
                                                                          Property=Height,
                                                                          Factor=1}"
                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,
                                                                         Property=Width,
                                                                         Factor=1}"/>
    </RelativeLayout>
 </ContentPage.Content>

Answer 3

如果您只想在整个屏幕上显示图像，则无需定义父布局 其次，这样做是一种糟糕的性能实践：

您的内容页 XAML 应该是什么样子：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         BackgroundColor="Black" x:Name="MainContentPage"
         x:Class="BluePin.MainPage">
<ContentPage.Content>
    <Image Source="{Binding SelectedImage}" Aspect="AspectFill"
                                            HorizontalOptions="FillAndExpand"
                                            VerticalOptions="FillAndExpand" 
                                            BackgroundColor="Transparent"   />
</ContentPage.Content>
</ContentPage>