Xamarin Forms: Footer image is not displaying fully

0
votes

In my login UI, I have a footer image, which is showing perfectly in small devices. But on big screen devices (mainly on iPad) it is not showing fully. I tried all Aspect property of Image, but not worked. Screenshot:

I try a lot to fix this but didn't get a solution. Attaching the LoginPage.xaml file with this question. Please suggest a solution for this issue. :)

3
imagexamarin.forms
You can provide the code or sample so that we can help you better . – Lucas Zhang - MSFT

3 Answers

1
votes

Make sure (in the iOS project -> Assets) your image set has 3 different sizes xxx.png,xxx.png@2x and xxx.png@3x .

Which image will be used for your app? That depends on the device your app is viewed on. Higher resolution devices (larger and newer devices) have more pixels on their screens. Thus they need higher resolution images to display properly without any blurring.

If you don’t supply the higher resolution (@2x or @3x) images, your app will automatically try to scale the @1x image up. This is not good and can result in a distorted or blurry image!

0
votes

Based on the file you linked in the comments, I think it would suffice to remove the bottom StackLayout wrapping the Image, and instead put Grid.Row="1" & VerticalOptions="End" to the bottom Image. Please update your question with the relevant code to make the question and answers more helpful to others.

0
votes

Remove latest StackLayout with image and add it after StackLayout with Grid.Row="1" like this

          <Grid Grid.Row="1" 
                BackgroundColor="#c0eefb">

                <Image 
                    Source="ic_footer_image_xx.png" 
                    Aspect="AspectFill" 
                    HorizontalOptions="FillAndExpand"/>
           </Grid>