Fix ImageButton not rendering correctly based on its bounds #28309

Shalini-Ashokan · 2025-03-11T14:03:25Z

Issue Details

The ImageButton image rendered on Android was not adjusting its bounds correctly, leading to improper scaling.

Root Cause

The image button was not rendering based on its bounds value.

Description of Change

In ImageButton Android Handler, set true for SetAdjustViewBounds(), when you enable view bounds adjustment, the ImageView will automatically resize to maintain the image's aspect ratio.

Validated the behavior in the following platforms

Android
Windows
iOS
Mac

Issues Fixed

Fixes #25558
Fixes #14346

Output ScreenShot

Before	After

dotnet-policy-service · 2025-03-11T14:03:52Z

Hey there @Shalini-Ashokan! Thank you so much for your PR! Someone from the team will get assigned to your PR shortly and we'll get it reviewed.

MartyIX · 2025-03-11T14:06:07Z

src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue25558.cs

+using UITest.Appium;
+using UITest.Core;
+
+namespace Microsoft.Maui.TestCases.Tests.Issues


Super-nit: After #28040, you can convert this to file-scope namespace by CTRL+. in Visual Studio (I believe it's the same in VS Code).

If it is converted, then new files will use file-scope namespaces more and more as people IMO copy old files to create new code.

Thanks for the suggestion , I have changed the file-scope namespace.

MartyIX · 2025-03-11T14:07:19Z

src/Core/src/Platform/Android/ImageViewExtensions.cs

+			if (image.Aspect == Aspect.AspectFill)
+				imageView.SetAdjustViewBounds(false);
+			else
+				imageView.SetAdjustViewBounds(true);


nit: Code style for "new code" should be:

Suggested change

if (image.Aspect == Aspect.AspectFill)

imageView.SetAdjustViewBounds(false);

else

imageView.SetAdjustViewBounds(true);

if (image.Aspect == Aspect.AspectFill)

{

imageView.SetAdjustViewBounds(false);

}

else

{

imageView.SetAdjustViewBounds(true);

}

@MartyIX, Thanks for the suggestion, I have updated the code style.

jsuarezruiz · 2025-03-12T06:47:55Z

/azp run

azure-pipelines · 2025-03-12T06:48:16Z

Azure Pipelines successfully started running 3 pipeline(s).

jsuarezruiz · 2025-03-12T09:22:54Z

src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue25558.cs

+	public void Issue25558VerifyImageButtonAspects()
+	{
+		App.WaitForElement("imageButton");
+		VerifyScreenshot();


Pending snapshots on Mac and Windows. Already available in the latest build.

Example, Mac:

Could you commit the images?

@jsuarezruiz, I have committed the image.

jsuarezruiz · 2025-03-12T09:24:30Z

src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue25558.cs

+
+	[Test]
+	[Category(UITestCategories.ImageButton)]
+	public void Issue25558VerifyImageButtonAspects()


This test is failing on Windows:

at UITest.Appium.HelperExtensions.Wait(Func`1 query, Func`2 satisfactory, String timeoutMessage, Nullable`1 timeout, Nullable`1 retryFrequency) in /_/src/TestUtils/src/UITest.Appium/HelperExtensions.cs:line 2367 at UITest.Appium.HelperExtensions.WaitForAtLeastOne(Func`1 query, String timeoutMessage, Nullable`1 timeout, Nullable`1 retryFrequency) in /_/src/TestUtils/src/UITest.Appium/HelperExtensions.cs:line 2384 at UITest.Appium.HelperExtensions.WaitForElement(IApp app, String marked, String timeoutMessage, Nullable`1 timeout, Nullable`1 retryFrequency, Nullable`1 postTimeout) in /_/src/TestUtils/src/UITest.Appium/HelperExtensions.cs:line 665 at Microsoft.Maui.TestCases.Tests.Issues.Issue25558.Issue25558VerifyImageButtonAspects() in /_/src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue25558.cs:line 19 at System.RuntimeMethodHandle.InvokeMethod(Object target, Void** arguments, Signature sig, Boolean isConstructor) at System.Reflection.MethodBaseInvoker.InvokeWithNoArgs(Object obj, BindingFlags invokeAttr)

@jsuarezruiz, I have modified the test to resolve the failing.

Shalini-Ashokan · 2025-03-13T06:55:59Z

@jsuarezruiz, The Issue18242Test failure is related to my changes. Previously, the ImageButton without a specified height was not rendering correctly. Shall I commit the newly generated image?

jsuarezruiz · 2025-03-13T14:43:45Z

@jsuarezruiz, The Issue18242Test failure is related to my changes. Previously, the ImageButton without a specified height was not rendering correctly. Shall I commit the newly generated image?

In that case, yes.

Shalini-Ashokan · 2025-03-14T06:16:10Z

@jsuarezruiz, The Issue18242Test failure is related to my changes. Previously, the ImageButton without a specified height was not rendering correctly. Shall I commit the newly generated image?

In that case, yes.

@jsuarezruiz, I have committed the failure image.

jsuarezruiz · 2025-03-17T08:08:21Z

/rebase

jsuarezruiz · 2025-03-17T08:24:00Z

/azp run

azure-pipelines · 2025-03-17T08:24:21Z

Azure Pipelines successfully started running 3 pipeline(s).

jsuarezruiz · 2025-03-18T12:32:10Z

/azp run

azure-pipelines · 2025-03-18T12:32:30Z

Azure Pipelines successfully started running 3 pipeline(s).

jsuarezruiz · 2025-03-26T07:45:07Z

/rebase

jsuarezruiz · 2025-03-27T06:59:44Z

/azp run

azure-pipelines · 2025-03-27T07:00:05Z

Azure Pipelines successfully started running 3 pipeline(s).

jsuarezruiz · 2025-04-14T07:02:28Z

/rebase

jsuarezruiz · 2025-05-06T11:28:54Z

/rebase

This reverts commit 277d167.

jsuarezruiz · 2025-05-06T11:30:14Z

/azp run MAUI-UITests-public

azure-pipelines · 2025-05-06T11:30:27Z

Azure Pipelines successfully started running 1 pipeline(s).

dotnet-policy-service bot added the community ✨ Community Contribution label Mar 11, 2025

dotnet-policy-service bot added the partner/syncfusion Issues / PR's with Syncfusion collaboration label Mar 11, 2025

MartyIX reviewed Mar 11, 2025

View reviewed changes

jsuarezruiz added the area-controls-button Button, ImageButton label Mar 12, 2025

jsuarezruiz suggested changes Mar 12, 2025

View reviewed changes

Shalini-Ashokan marked this pull request as ready for review March 13, 2025 06:46

Shalini-Ashokan requested a review from a team as a code owner March 13, 2025 06:46

Shalini-Ashokan requested review from PureWeen and tj-devel709 March 13, 2025 06:46

github-actions bot force-pushed the fix-25558 branch from d88c6af to 71b4c79 Compare March 17, 2025 08:08

MartyIX added the platform/android label Mar 18, 2025

github-actions bot force-pushed the fix-25558 branch from e1fdd77 to 6cadf7d Compare March 26, 2025 07:45

github-actions bot force-pushed the fix-25558 branch from 6cadf7d to 8a174ad Compare April 14, 2025 07:03

Shalini-Ashokan added 10 commits May 6, 2025 11:29

Fixed the image scale issue on android

ebd101b

Revert "Fixed the image scale issue on android"

a4e2a5c

This reverts commit 277d167.

Fixed the image scale issue on android

d7d022a

Fixed the image button aspect scenarios

3a03fc1

Added test cases and committed the images

ad28a05

Addressed a review concerns

7e048ab

Commited the image and modified the test case

165f683

Modified the test case

b8662df

Committed the failure image

a09561b

Committed the windows image

af2e61c

github-actions bot force-pushed the fix-25558 branch from 8a174ad to af2e61c Compare May 6, 2025 11:29

Fix ImageButton not rendering correctly based on its bounds #28309

Are you sure you want to change the base?

Fix ImageButton not rendering correctly based on its bounds #28309

Uh oh!

Conversation

Shalini-Ashokan commented Mar 11, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Issue Details

Root Cause

Description of Change

Issues Fixed

Output ScreenShot

Uh oh!

dotnet-policy-service bot commented Mar 11, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jsuarezruiz commented Mar 12, 2025

Uh oh!

azure-pipelines bot commented Mar 12, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Shalini-Ashokan commented Mar 13, 2025

Uh oh!

jsuarezruiz commented Mar 13, 2025

Uh oh!

Shalini-Ashokan commented Mar 14, 2025

Uh oh!

jsuarezruiz commented Mar 17, 2025

Uh oh!

jsuarezruiz commented Mar 17, 2025

Uh oh!

azure-pipelines bot commented Mar 17, 2025

Uh oh!

jsuarezruiz commented Mar 18, 2025

Uh oh!

azure-pipelines bot commented Mar 18, 2025

Uh oh!

jsuarezruiz commented Mar 26, 2025

Uh oh!

jsuarezruiz commented Mar 27, 2025

Uh oh!

azure-pipelines bot commented Mar 27, 2025

Uh oh!

jsuarezruiz commented Apr 14, 2025

Uh oh!

jsuarezruiz commented May 6, 2025

Uh oh!

jsuarezruiz commented May 6, 2025

Uh oh!

azure-pipelines bot commented May 6, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Shalini-Ashokan commented Mar 11, 2025 •

edited

Loading