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

Update FlexPanel default property values to match FlexBox specification #74

Merged

Conversation

Al12rs
Copy link
Contributor

@Al12rs Al12rs commented Jul 9, 2024

Problem:

Some of the properties of FlexPanel have initial values that don't match the official specification of FlexBox.
Specification

This caused default behavior of the FlexPanel to be inconsistent with FlexBox behavior, which it is supposed to be emulating.

Changes:

  • AlignItems property:
    • old: AlignItems.FlexStart
    • new: AlignItems.Stretch
  • AlignContents property:
    • old: AlignContent.FlexStart
    • new: AlignContent.Stretch
  • Wrap property:
    • old: FlexWrap.Wrap
    • new: FlexWrap.NoWrap

All new values were taken from the official FlexBox Specification.

Impact:

This is a breaking change with respect to the default behavior of the FlexPanel and is likely to cause a disruption to current users updating to the new version.

To fix any unwanted changes in behavior, each usage of FlexPanel would have to be checked and updates be made to overrule the new default property values with the old ones.

Since this would be quite a tedious process, the following styles are provided as an alternative to revert the initial values to what they were before this PR.

<!-- Override FlexPanel initial values to revert https://github.com/AvaloniaUI/Avalonia.Labs/pull/74 -->
<Style Selector="panels|FlexPanel">
  <Setter Property="AlignItems" Value="FlexStart" />
  <Setter Property="AlignContent" Value="FlexStart" />
  <Setter Property="Wrap" Value="Wrap" />
</Style>

While this change will cause disruption in the short term, it should prove a benefit in the long run.
This is specifically useful to developers adapting UI designs into Avalonia from HTML/CSS based sources, like Figma or other deign tools or existing UIs.

Having different defaults from FlexBox results in confusion and frustrations for the developers.

Since the whole point of this Avalonia.Labs repository is to host controls and panels that are not API stable, it feels important to make this kind of changes now.

Copy link
Member

@maxkatz6 maxkatz6 left a comment

Choose a reason for hiding this comment

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

It's a breaking change, but better to do it early than too late. While this panel isn't actively used.

@maxkatz6 maxkatz6 merged commit c4a54a5 into AvaloniaUI:main Jul 9, 2024
2 checks passed
@Al12rs Al12rs deleted the feat/flexpanel-properties-initial-values branch July 10, 2024 08:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants