Bug 26567 - Button.Image property resizing on empty string
Summary: Button.Image property resizing on empty string
Status: RESOLVED FIXED
Alias: None
Product: Forms
Classification: Xamarin
Component: Forms ()
Version: 1.3.2
Hardware: PC Windows
: Normal enhancement
Target Milestone: ---
Assignee: Jason Smith [MSFT]
URL:
Depends on:
Blocks:
 
Reported: 2015-01-29 14:26 UTC by Jon Douglas [MSFT]
Modified: 2016-04-08 19:22 UTC (History)
5 users (show)

Tags: ios visual button
Is this bug a regression?: ---
Last known good build:


Attachments
Example (1.74 KB, image/png)
2015-01-29 14:26 UTC, Jon Douglas [MSFT]
Details
Sample Repo (364.88 KB, application/x-zip-compressed)
2015-01-29 14:29 UTC, Jon Douglas [MSFT]
Details


Notice (2018-05-24): bugzilla.xamarin.com is now in read-only mode.

Please join us on Visual Studio Developer Community and in the Xamarin and Mono organizations on GitHub to continue tracking issues. Bugzilla will remain available for reference in read-only mode. We will continue to work on open Bugzilla bugs, copy them to the new locations as needed for follow-up, and add the new items under Related Links.

Our sincere thanks to everyone who has contributed on this bug tracker over the years. Thanks also for your understanding as we make these adjustments and improvements for the future.


Please create a new report on Developer Community or GitHub with your current version information, steps to reproduce, and relevant error messages or log files if you are hitting an issue that looks similar to this resolved bug and you do not yet see a matching new report.

Related Links:
Status:
RESOLVED FIXED

Description Jon Douglas [MSFT] 2015-01-29 14:26:22 UTC
Created attachment 9563 [details]
Example

*Customer Description

The issue comes from simply supplying the image and no text (thus an empty string -> "") What happens in this specific case is that your button control (Xamarin.Forms.Button), when centered (as shown in the difference of the first 2 buttons in the issue project), the button will resize itself to the width of the given image. The problem is that some space within the button will be reserved for the text that technically does not exist and is eating up that space, even though the button sized itself to the the size of the image, the image gets distorted.

A simple hack to that is to set the text property to a string containing whitespace as such -> " " which causes the button to take more space and properly display the image. Note that this hack is not a proper solution as it causes bad UX because the button's image is not centered and can be clicked in places it would not be expected to interact.

A width request would (theoretically) result in the same hack as the empty string, but with the same consequences. I think it's safe to say it's an unexpected behaviour or bug as the issue originates from using HorizontalOptions because of how the control internally handles it's presentation.
Comment 1 Jon Douglas [MSFT] 2015-01-29 14:28:55 UTC
*Additional Information & Sample Reproduction

Project showing issue with using Images in button (Button.Image property).
It showcases how the button squeezes because it resizes to fit just the
image, but space is reserved for the text.
Can be patched by setting the text to a string containing whitespace or
forcing width of button until image is ok. This causes the button to be
larger and with the image not being centred can cause weird UX (not
applicable if setting a border, but causes an ugly UI).
It also showcases that setting the aspect property of the image has
absolutely no impact on how it is rendered.
Comment 2 Jon Douglas [MSFT] 2015-01-29 14:29:23 UTC
Created attachment 9564 [details]
Sample Repo
Comment 3 Rui Marinho 2016-04-08 19:22:47 UTC
Thank you for taking the time to submit this report. After reviewing the description of this bug, we believe it no longer affects the current version of Xamarin.Forms. If you are still experiencing the issue after updating your packages, please reopen this report with an attached reproduction.
 
For your convenience, we have created some reproduction best practices viewable here: https://gist.github.com/jassmith/92405c300e54a01dcc6d