I'm trying to display images in my Xamarin forms app using "FFImageLoading" library, however, when I try to display with aspectFill it gets cut off and when I try aspect fit, it leaves spaces on the sides. I want the image to be full-width and still maintain it's resolution, similar to what Instagram does. See code below:
<Grid
Padding="0"
Grid.Column="0"
Grid.Row="1"
Grid.ColumnSpan="3"
HeightRequest="430"
HorizontalOptions="FillAndExpand"
IsClippedToBounds="True">
<ffimageloading:CachedImage
DownsampleToViewSize="True"
VerticalOptions="Start"
Aspect="AspectFill"
DownsampleUseDipUnits="True"
HorizontalOptions="FillAndExpand"
Source="{Binding PhotoPath}">
<ffimageloading:CachedImage.Transformations>
</ffimageloading:CachedImage.Transformations>
</ffimageloading:CachedImage>
</Grid>
I've also attached some screenshot for visuals:[
Seconds one there's space between, I want it to be full screen
From document Display images, we could know that:
The Aspect property determines how the image will be scaled to fit the display area:
So, if you want to display your image completely, you can try to set property
AspecttoFill(Aspect="Fill") for your Image. But this may result in the image being distorted.Of course, the better way is to set the size of the image control to match the aspect ratio of the image.
If you want the images to be of the same height, you can use these images that with the same or similar aspect ratio of the image.