How to set image in StackLayout as background using xamarin?-CodePudding

I want to stretch image like background but I don't want to set a width and heigh to stretch it. Also want the button located inside the picture ?

How to fill the whole stacklayout with this image ?

Code:

<StackLayout BackgroundColor="White" Padding="60" VerticalOptions="Center">
        <Image Source="SplashScreen.png" HeightRequest="100" Opacity="1.0"
          RelativeLayout.WidthConstraint=
            "{ConstraintExpression Type=RelativeToParent, Property=Width}"
          RelativeLayout.HeightConstraint=
            "{ConstraintExpression Type=RelativeToParent, Property=Height}"/>
        <Button Text="Хидрология" TextColor="White" BackgroundColor="#2196F3" Clicked="NavigateButtonHydro_OnClicked">
        </Button>
    </StackLayout>

CodePudding user response：

On the your ContentPage set a background like this:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
 .
 .
 .
 BackgroundImageSource="SplashScreen.png"/>

CodePudding user response：

You could use RelativeLayout.

<StackLayout BackgroundColor="White" Padding="60" VerticalOptions="Center">
        <RelativeLayout>
            <Image Source="image.jpeg" HeightRequest="100" Opacity="1.0" Aspect="AspectFill"
      RelativeLayout.WidthConstraint=
        "{ConstraintExpression Type=RelativeToParent, Property=Width}"
      RelativeLayout.HeightConstraint=
        "{ConstraintExpression Type=RelativeToParent, Property=Height}"/>

            <StackLayout Padding="60" VerticalOptions="Center">
                <Button Text="Хидрология" TextColor="White" BackgroundColor="#2196F3" Clicked="NavigateButtonHydro_OnClicked">
                </Button>
            </StackLayout>
         
        </RelativeLayout>
       
    </StackLayout>