Xamarin表格如何删除与孩子的布局填充？

Question

我是Xamarin表格的初学者。这是我的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>

enter image description here

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

Answer 1

将图像设置为全屏

有两种方法可以实现这个：

1.将图像设置为ContentPage的背景

<?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.使用StackLayout：

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

如果您只想在整个屏幕上显示图像，则无需再定义父布局，其次是BAD性能实践：

您的ContentPage 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>