CODEWITHSUNDEEP
xamarin.formsxamarin.android
Yaraa
Yaraa

Reputation: 13

How Xamarin Form Remove Layout Padding with children?

I'm beginner in Xamarin Form. This's my xaml code:

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

I tested all xamarin layout and controls. Please see picture, there is red distance between layout and control (Image). how can i remove this distances and set image as full screen?

Upvotes: 1

Views: 245

Answers (3)

Leo Zhu
Leo Zhu

Reputation: 14956

set image as full screen

there are two methods to implement this:

1.set the image as the ContentPage's background

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

Upvotes: 1

FreakyAli
FreakyAli

Reputation: 16439

If you want to just show the image on the whole screen there is no need for you to define a parent layout secondly its a BAD performance practice to do so :

What your ContentPage XAML should look like: 

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

Upvotes: 0

Himanshu Dwivedi
Himanshu Dwivedi

Reputation: 8174

Try this:

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

Upvotes: 0

Related Questions