Skip to content

Only use custom image sizing with ImageButtons#18521

Merged
PureWeen merged 2 commits intomainfrom
dev/jd/buttonimagefix
Nov 14, 2023
Merged

Only use custom image sizing with ImageButtons#18521
PureWeen merged 2 commits intomainfrom
dev/jd/buttonimagefix

Conversation

@jknaudt21
Copy link
Copy Markdown
Contributor

@jknaudt21 jknaudt21 commented Nov 3, 2023

Problem

Updates on the image resizing #17120 affected normal buttons with images, causing them to call the custom image sizing logic. The updates made images to occupy the space they are provided in respect to their constraints. This fixed ImageButton and Image but adversely affected Button.

Standard Buttons don't have control over their image dimensions, but do have control on how they want to lay these images out them out. Calling the new logic removes this functionality and causes buttons to occupy their available space/occupy the space requested by the image (which would ignore the text in the button).

Solution

Use the old sizing logic with normal Buttons but still use the new sizing logic for ImageButton. We can differentiate them based on the value of the native view's CurrentTitle. ImageButtons can't have text and have a null value for CurrentTitle, so we add this check before using the image resizing logic.

Note: Even if a Button has no Text value (or its ""), the native control will have a non-null CurrentTitle that'll just be the empty string. This is included in the tests I'm adding

Before & After

18504 (click me!)
    <Grid WidthRequest="500" BackgroundColor="Red">
        <Button HorizontalOptions="Center" VerticalOptions="Center" BackgroundColor="AliceBlue" ImageSource="dotnet_bot.png" Text="Hello world!"/>
    </Grid>
Before After
image image
18655 (click me!)

Copy source from sample project: https://github.com/zwikk/maui-playground/blob/main/Source/ButtonImageSource/ButtonImageSource/MainPage.xaml

Before After
image image

Issues Fixed

Fixes #18504
Fixes #18655

Remaining work

  • Add tests
  • Add screenshots

@jknaudt21 jknaudt21 changed the title Only use custom sizing with ImageButtons Only use custom image sizing with ImageButtons Nov 3, 2023
@Eilon Eilon added the legacy-area-controls Label, Button, CheckBox, Slider, Stepper, Switch, Picker, Entry, Editor label Nov 6, 2023
@jknaudt21 jknaudt21 force-pushed the dev/jd/buttonimagefix branch from e793874 to e6cb278 Compare November 6, 2023 23:36
@jknaudt21 jknaudt21 marked this pull request as ready for review November 6, 2023 23:36
@jknaudt21 jknaudt21 requested a review from a team as a code owner November 6, 2023 23:36
@jknaudt21 jknaudt21 force-pushed the dev/jd/buttonimagefix branch from e6cb278 to dd8ffdd Compare November 6, 2023 23:39
emaf
emaf previously approved these changes Nov 7, 2023
ImageButtons have a null value for CurrentTitle and can't have Text on them, giving us a way to distinguish Imagebuttons from normal buttons.

Normal buttons with images should still use the standard sizing logic
@jknaudt21 jknaudt21 force-pushed the dev/jd/buttonimagefix branch from 0e70ec9 to 9253782 Compare November 13, 2023 23:17
@PureWeen PureWeen merged commit 78e64c2 into main Nov 14, 2023
@PureWeen PureWeen deleted the dev/jd/buttonimagefix branch November 14, 2023 14:55
@github-actions github-actions bot locked and limited conversation to collaborators Dec 15, 2023
@Eilon Eilon added area-controls-button Button, ImageButton and removed legacy-area-controls Label, Button, CheckBox, Slider, Stepper, Switch, Picker, Entry, Editor labels May 13, 2024
@samhouts samhouts added the fixed-in-8.0.6 Look for this fix in 8.0.6 SR1! label Aug 2, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

area-controls-button Button, ImageButton fixed-in-8.0.6 Look for this fix in 8.0.6 SR1!

Projects

None yet

5 participants