Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixed Extra Padding on iOS buttons required when image on top or bottom #26018

Draft
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

NirmalKumarYuvaraj
Copy link
Contributor

@NirmalKumarYuvaraj NirmalKumarYuvaraj commented Nov 21, 2024

Issue Details

When the image is positioned at the top or bottom with the title, extra padding is added to the left and right sides of the button.

Root Cause

When the button content layout is set to 'Top' or 'Bottom,' the button content width is recalculated based on both the title width and the image width.

Description of Change

  • Remove the logic for recalculating the button content width. If the content layout is set to 'Top' or 'Bottom,' calculate the title insets for the button based on the image width.

Validated the behaviour in the following platforms

  • Android
  • Windows
  • iOS
  • Mac

Issues Fixed

Fixes #25489

Output

Before After
BeforeFix-mac Afterfix-mac

@dotnet-policy-service dotnet-policy-service bot added the community ✨ Community Contribution label Nov 21, 2024
@jsuarezruiz jsuarezruiz added the area-controls-button Button, ImageButton label Nov 21, 2024
@jsuarezruiz
Copy link
Contributor

/azp run

Copy link

Azure Pipelines successfully started running 3 pipeline(s).

titleInsets.Left -= imageWidth / 2;
titleInsets.Right += imageWidth / 2;
// Which makes the later math easier to follow
if (layout.Position == ButtonContentLayout.ImagePosition.Left || layout.Position == ButtonContentLayout.ImagePosition.Right)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This change will impact to several tests:
image

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changes in the screenshot tests should be expected if this is working correctly so that is not necessarily a bad thing :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-controls-button Button, ImageButton community ✨ Community Contribution
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Extra Padding on iOS buttons required when image on top or bottom
4 participants