Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to Fill Image fullscreen in stackLayout in Xamarin?

*how to Fill Image fullscreen in stackLayout in Xamarin ? I can't set Image in fit to stacklayout .XAML File Code

  <StackLayout Padding="0" BackgroundColor="Yellow">
    <Image Source="ic_splash.png" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" > </Image>
  </StackLayout>
</ContentPage>

Screenshot of Output Android and Window Phone.... enter image description here enter image description here I want to fit Image in Background.*

like image 561
Shahabuddin Vansiwala Avatar asked Nov 26 '15 05:11

Shahabuddin Vansiwala


2 Answers

Finally I solved problem using below 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"
                       x:Class="Your.Namespace.Views.LoginView"
             Title="{Binding Title}"
             BackgroundImage="BackgroundImage.png">
  <StackLayout>
    <!-- Your stuff goes here -->
  </StackLayout>
</ContentPage>

I have set background Image as fit to screen using above code....

BackgroundImage="BackgroundImage.png"

like image 178
Shahabuddin Vansiwala Avatar answered Sep 28 '22 13:09

Shahabuddin Vansiwala


The problem with the BackgroundImage property is that the image proportion could change on screen size changed.

Here I found how to fill all the screen and save proportions using RelativeLayout:

<RelativeLayout>
  <Image Source="Jupiter.png" Opacity="0.3"
              RelativeLayout.WidthConstraint=
                "{ConstraintExpression Type=RelativeToParent, Property=Width}"
              RelativeLayout.HeightConstraint=
                "{ConstraintExpression Type=RelativeToParent, Property=Height}"/>
  <Grid RelativeLayout.WidthConstraint=
            "{ConstraintExpression Type=RelativeToParent, Property=Width}"
          RelativeLayout.HeightConstraint=
            "{ConstraintExpression Type=RelativeToParent, Property=Height}">

    <Label Text="Hello world from XAML"/>
  </Grid>
</RelativeLayout>
like image 21
greene Avatar answered Sep 28 '22 12:09

greene