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

Remove the padding around checkboxes #7379

Merged
merged 3 commits into from May 23, 2022
Merged

Remove the padding around checkboxes #7379

merged 3 commits into from May 23, 2022

Conversation

mattleibow
Copy link
Member

@mattleibow mattleibow commented May 20, 2022

Description of Change

Since platform checkboxes are designed with the check box and the label as a single control, most have a bit of padding between them.

This PR removes the padding and unifies the size behaviour to just be the check box and some margin..

<VerticalStackLayout Spacing="20" Padding="20">
    <HorizontalStackLayout HorizontalOptions="Start" Background="Silver">
        <CheckBox />
        <Label Text="Hello World" VerticalOptions="Center" />
    </HorizontalStackLayout>
</VerticalStackLayout>
Platform Before After
Android image image
Windows image image
iOS image image

NOTE: The Android and Windows checkboxes are square-ish and have a view bunds of about 32px in size. iOS and Mac Catalyst are round and have a view size of 44px (Apple recommended values) - but a circle size of 18px - which results in a bit more padding. However, this is the values we always had so I am leaving it, but the size can be reduced to 32px and the circle will stay centered.

Issues Fixed

Fixes #7352

@mattleibow mattleibow added this to the 6.0.3xx-sr1 milestone May 20, 2022
@mattleibow mattleibow marked this pull request as ready for review May 20, 2022 19:34
@Eilon Eilon added the area/controls 🎮 Label, Button, CheckBox, Slider, Stepper, Switch, Picker, Entry, Editor label May 20, 2022
@mattleibow mattleibow requested a review from PureWeen May 21, 2022 13:10
@jsuarezruiz
Copy link
Contributor

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 2 pipeline(s).

@Redth Redth merged commit 9dedbf6 into main May 23, 2022
@Redth Redth deleted the dev/checkbox-padding branch May 23, 2022 19:30
@github-actions github-actions bot locked and limited conversation to collaborators Dec 21, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area/controls 🎮 Label, Button, CheckBox, Slider, Stepper, Switch, Picker, Entry, Editor
Projects
None yet
Development

Successfully merging this pull request may close these issues.

CheckBox has default (empty) padding on Windows platform (Mac has no padding)
4 participants