Reputation: 985
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>
Upvotes: 0
Views: 1825
Reputation: 8124
Simply place the image inside Grid like this:
<Grid>
<Image Source="SplashScreen.png" Aspect="AspectFill"/>
<StackLayout Padding="60" VerticalOptions="Center">
<Button Text="Хидрология" TextColor="White" BackgroundColor="#2196F3"
Clicked="NavigateButtonHydro_OnClicked">
</Button>
</StackLayout>
</Grid>
Upvotes: 1
Reputation: 10978
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>
Upvotes: 1
Reputation: 16587
On the your ContentPage set a background like this:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
.
.
.
BackgroundImageSource="SplashScreen.png"/>
Upvotes: 0