Reputation: 509
I am trying to put a company logo at the top of an About screen. My graphic designer says "make it 40% of the screen width. So I code Image Aspect="AspectFit"
and put it in Column 1 of a Grid with ColumnDefinitions="3*,4*,3*"
. Voila! It is 40% of the screen width. But AspectFit "Letterboxes the image (if required) so that the entire image fits into the display area, with blank space added to the top/bottom or sides depending on whether the image is wide or tall." So I end up with a heck of a lot of padding above and below the image, depending on how wide the screen is. I have a kludge solution -- coding RowDefinitions="120"
but is there a way to do this that will work correctly every time, rather than being a kludge that is more or less good enough most of the time? Is there a way to get Xamarin Forms to crop rather than pad?
VS 2019 Community on Windows 10 Pro 64. Target platforms Android, iOS and UWP.
Upvotes: 2
Views: 191
Reputation: 509
And the answer is ... you apparently need to do it in code:
private void OnAboutPageLayoutChanged(object sender, EventArgs e)
{
const double heightRatio = 200.0 / 600.0 ; // Ratio of image height to width
GridLogo.RowDefinitions[0].Height = ImageLogo.Width * heightRatio;
}
Upvotes: 1