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

Feature/#446 tabs bar headings should enlarge width 2 #526

Merged
merged 13 commits into from
Nov 17, 2024

Conversation

Alber-Writer
Copy link
Collaborator

@Alber-Writer Alber-Writer commented Nov 7, 2024

Factors taken into account with variable tab widths:

  • Undefined order: tabs with standard size could be mixed between larger ones.
  • Re-adjusted tabs can have very different widths depending on the available space.

Steps followed in this logic:

  1. Calculate the desired width, depending on each tab text. The method consists of reusing the existing Konva canvas to perform a measurement of the text "on the fly", given a font family and font size.
  2. Save the original tabs order to have a reference in further steps.
  3. Sort "tabs width list" from lower to greater values.
  4. This is the key step in this logic approach: iterate to precalculate how much room would remain if each following tab applies the current proposed width. Then, apply it from smaller widths to larger depending on available space.
  5. Once we get the real widths, rearrange them to match the original order.
  6. Finally calc the x-axis offset position for each tab, considering the size of the previous ones.

I have added unit tests to assure and facilitate the calc processes.
I also added a hook to encapsulate the tab logic and avoid unnecessary re-rendering.
closes #446

@brauliodiez brauliodiez merged commit deb1613 into dev Nov 17, 2024
2 checks passed
@brauliodiez brauliodiez deleted the feature/#446-Tabs-bar-headings-should-enlarge-width-2 branch November 17, 2024 08:15
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.

Tabs bar headings should enlarge width (til a max) if text is larger
2 participants