Skip to content

Introduce TabBar.tabAlignment #125036

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

Merged
merged 6 commits into from
May 1, 2023
Merged

Conversation

TahaTesser
Copy link
Member

fixes #124195

This introduces TabBar.tabAlignment while keeping the default alignment for both M2 and M3.

Pre-launch Checklist

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I read the Tree Hygiene wiki page, which explains my responsibilities.
  • I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
  • I signed the CLA.
  • I listed at least one issue that this PR fixes in the description above.
  • I updated/added relevant documentation (doc comments with ///).
  • I added new tests to check the change I am making, or this PR is test-exempt.
  • All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

Sorry, something went wrong.

@flutter-dashboard flutter-dashboard bot added f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels. c: contributor-productivity Team-specific productivity, code health, technical debt. labels Apr 18, 2023
@TahaTesser TahaTesser requested a review from Piinks April 18, 2023 14:55
@TahaTesser
Copy link
Member Author

@Piinks
In the next PR, I'll the default alignment using this tabAlignment and fix #117722 which will produce golden changes.

@TahaTesser TahaTesser requested a review from Piinks April 26, 2023 16:28
@Piinks Piinks added the c: new feature Nothing broken; request for a new capability label Apr 27, 2023
///
/// It is not recommended to set [TabAlignment.startOffset] when
/// [ThemeData.useMaterial3] is false.
startOffset,
Copy link
Contributor

Choose a reason for hiding this comment

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

I understand the difference between start and startOffset is the 52 pixels.. but they seem backwards. Should the one with the extra pixels be startOffset?

Copy link
Member Author

Choose a reason for hiding this comment

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

startOffset is the name I came up with, it's a start positon with an offset of 52 pixels.

start for start position makes sense, we could a better name for startOffset

Copy link
Contributor

Choose a reason for hiding this comment

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

startOffset is the name I came up with, it's a start position with an offset of 52 pixels.

Yeah I think it makes sense, the docs look backwards though. start is documented with 52 pixels.

Copy link
Member Author

Choose a reason for hiding this comment

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

Oops, thank you.

'$tabAlignment is only valid for non-scrollable tab bars.',
);
}
if (!widget.isScrollable
Copy link
Contributor

Choose a reason for hiding this comment

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

Reading through these cases now, it is a bit clearer which is allowed. Although, I am curious why a scrollable one cannot be aligned at the start?

It is ok to expose options that deviate from the spec if that is why.

Copy link
Member Author

Choose a reason for hiding this comment

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

Reading through these cases now, it is a bit clearer which is allowed. Although, I am curious why a scrollable one cannot be aligned at the start?

They can be aligned. if scrollable is true and tab alignment is TabAlignment.start, it won't throw an error.

Copy link
Contributor

@Piinks Piinks left a comment

Choose a reason for hiding this comment

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

LGTM, thanks for clarifying the error messages and docs. :)

@Piinks Piinks added a: fidelity Matching the OEM platforms better autosubmit Merge PR when tree becomes green via auto submit App labels May 1, 2023
@auto-submit auto-submit bot merged commit a732a74 into flutter:master May 1, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 1, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 1, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 1, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 1, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 1, 2023
tarrinneal pushed a commit to flutter/packages that referenced this pull request May 1, 2023

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
Manual roll Flutter from 66fa4c5 to 828a040 (79 revisions)

Manual roll requested by tarrinneal@google.com

flutter/flutter@66fa4c5...828a040

2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
666bc34c61aa to 687f4c761db1 (2 revisions) (flutter/flutter#125818)
2023-05-01 34871572+gmackall@users.noreply.github.com Revert "Add
migrator to upgrade gradle version when conflict with And…
(flutter/flutter#125813)
2023-05-01 fluttergithubbot@gmail.com Roll pub packages
(flutter/flutter#125801)
2023-05-01 andrewrkolos@gmail.com [tools] fix `expect` calls in
`FakeCommand` (flutter/flutter#125783)
2023-05-01 engine-flutter-autoroll@skia.org Roll Packages from
7e3f5da to de6131d (41 revisions) (flutter/flutter#125811)
2023-05-01 tessertaha@gmail.com Introduce `TabBar.tabAlignment`
(flutter/flutter#125036)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
b0da68e7e024 to 666bc34c61aa (1 revision) (flutter/flutter#125805)
2023-05-01 44755140+werainkhatri@users.noreply.github.com add support to
customize Slider interacivity (flutter/flutter#121483)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
b4551c72487c to b0da68e7e024 (1 revision) (flutter/flutter#125800)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
605528f293d0 to b4551c72487c (1 revision) (flutter/flutter#125795)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
bba66b658cee to 605528f293d0 (2 revisions) (flutter/flutter#125793)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
2fa61b91d7c2 to bba66b658cee (1 revision) (flutter/flutter#125791)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
30c91b8180e7 to 2fa61b91d7c2 (1 revision) (flutter/flutter#125789)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
d76a22e67eea to 30c91b8180e7 (1 revision) (flutter/flutter#125787)
2023-05-01 andrewrkolos@gmail.com [tools] Apply Android Studio version
detection logic to explicitly configured installation directory
(`flutter config --android-studio-dir`) (flutter/flutter#125596)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
f234d5e1dd26 to d76a22e67eea (1 revision) (flutter/flutter#125776)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
c796390d14cb to f234d5e1dd26 (1 revision) (flutter/flutter#125773)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
e99f31f4437d to c796390d14cb (1 revision) (flutter/flutter#125762)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
1942b0c2cd9a to e99f31f4437d (1 revision) (flutter/flutter#125758)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
7806f8a4fb4c to 1942b0c2cd9a (1 revision) (flutter/flutter#125757)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
8167f909bc8d to 7806f8a4fb4c (2 revisions) (flutter/flutter#125750)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
900b8a89b73b to 8167f909bc8d (1 revision) (flutter/flutter#125748)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
c56ea398b0dc to 900b8a89b73b (1 revision) (flutter/flutter#125747)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
0834c886f06a to c56ea398b0dc (1 revision) (flutter/flutter#125746)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
68f2ed0a1db5 to 0834c886f06a (1 revision) (flutter/flutter#125736)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
0079bb4a20d0 to 68f2ed0a1db5 (1 revision) (flutter/flutter#125735)
2023-04-29 dnfield@google.com Fix crasher in DragableScrollableSheet
when controller is animating and switching widgets
(flutter/flutter#125721)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
8f04b29c1b98 to 0079bb4a20d0 (2 revisions) (flutter/flutter#125734)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
788d0ed5ed06 to 8f04b29c1b98 (1 revision) (flutter/flutter#125731)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
89a8affdced0 to 788d0ed5ed06 (1 revision) (flutter/flutter#125729)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
3835d975c8b0 to 89a8affdced0 (2 revisions) (flutter/flutter#125725)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
1ae848ce6b55 to 3835d975c8b0 (1 revision) (flutter/flutter#125722)
2023-04-29 65850618+Anas35@users.noreply.github.com fix package template
create platform folders (flutter/flutter#125292)
2023-04-28 thkim1011@users.noreply.github.com Sliver Cross Axis Group
(flutter/flutter#123862)
2023-04-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from
2a84ea55e4ef to 1ae848ce6b55 (1 revision) (flutter/flutter#125718)
2023-04-28 zanderso@users.noreply.github.com Remove bringup from
new_gallery_skia_ios__transition_perf (flutter/flutter#125715)
2023-04-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from
98b6fabc66bb to 2a84ea55e4ef (10 revisions) (flutter/flutter#125714)
2023-04-28 109111084+yaakovschectman@users.noreply.github.com Opt into
CMake policy CMP0135 (flutter/flutter#125502)
2023-04-28 leroux_bruno@yahoo.fr Add a channel to query the engine
keyboard state (flutter/flutter#122885)
2023-04-28 fluttergithubbot@gmail.com Roll pub packages
(flutter/flutter#125698)
2023-04-28 36861262+QuncCccccc@users.noreply.github.com
`Checkbox.fillColor` should be applied to checkbox's background color
when it is unchecked. (flutter/flutter#125643)
2023-04-28 zanderso@users.noreply.github.com Add back one Skia test on
iOS (flutter/flutter#125663)
2023-04-28 fluttergithubbot@gmail.com Roll pub packages
(flutter/flutter#125447)
2023-04-28 97679004+phlippieb-discovery@users.noreply.github.com Nit:
grammar in documentation (flutter/flutter#125462)
...
@TahaTesser TahaTesser deleted the tab_alignment branch May 2, 2023 07:40
auto-submit bot pushed a commit that referenced this pull request May 5, 2023

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
fixes #123112

### Description
1. Add proper M3 indicator height aka`IndictorWeight` from the M3 specs for the primary tab bar with label indicator size.
https://github.com/flutter/flutter/blob/db6074ade4e4fde664e6258d671faf356e1b6e85/dev/tools/gen_defaults/data/navigation_tab_primary.json#L9
(this was held due to `indicatorWeight` having a hard-coded value) 

and added a secondary tab bar indicator height.
2. Set a minimum value for the rounded indicator to maintain the indicator shape.
3. With proper indicator height, the rounded indicator position is also fixed.
4. Fix round indicator is shown for the primary tab bar with tab indicator size.
5. Above changes fix #123112.
6. Fix the `startOffset` const value from #125036  to match docs and move it to a variable.
sfshaza2 pushed a commit to flutter/website that referenced this pull request May 26, 2023

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
fixes flutter/flutter#126920


[TabBar.tabAlignment](https://master-api.flutter.dev/flutter/material/TabBar/tabAlignment.html)
was introduced in flutter/flutter#125036

This PR adds a  migration guide for `TabBar.tabAlignment`.


Related flutter/flutter#125974



## Presubmit checklist

- [x] This PR doesn’t contain automatically generated corrections
(Grammarly or similar).
- [x] This PR follows the [Google Developer Documentation Style
Guidelines](https://developers.google.com/style) — for example, it
doesn’t use _i.e._ or _e.g._, and it avoids _I_ and _we_ (first person).
- [x] This PR uses [semantic line
breaks](https://github.com/dart-lang/site-shared/blob/main/doc/writing-for-dart-and-flutter-websites.md#semantic-line-breaks)
of 80 characters or fewer.

---------

Co-authored-by: Anthony Sansone <atsansone@users.noreply.github.com>
nploi pushed a commit to nploi/packages that referenced this pull request Jul 16, 2023
)

Manual roll Flutter from 66fa4c5 to 828a040 (79 revisions)

Manual roll requested by tarrinneal@google.com

flutter/flutter@66fa4c5...828a040

2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
666bc34c61aa to 687f4c761db1 (2 revisions) (flutter/flutter#125818)
2023-05-01 34871572+gmackall@users.noreply.github.com Revert "Add
migrator to upgrade gradle version when conflict with And…
(flutter/flutter#125813)
2023-05-01 fluttergithubbot@gmail.com Roll pub packages
(flutter/flutter#125801)
2023-05-01 andrewrkolos@gmail.com [tools] fix `expect` calls in
`FakeCommand` (flutter/flutter#125783)
2023-05-01 engine-flutter-autoroll@skia.org Roll Packages from
7e3f5da to de6131d (41 revisions) (flutter/flutter#125811)
2023-05-01 tessertaha@gmail.com Introduce `TabBar.tabAlignment`
(flutter/flutter#125036)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
b0da68e7e024 to 666bc34c61aa (1 revision) (flutter/flutter#125805)
2023-05-01 44755140+werainkhatri@users.noreply.github.com add support to
customize Slider interacivity (flutter/flutter#121483)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
b4551c72487c to b0da68e7e024 (1 revision) (flutter/flutter#125800)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
605528f293d0 to b4551c72487c (1 revision) (flutter/flutter#125795)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
bba66b658cee to 605528f293d0 (2 revisions) (flutter/flutter#125793)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
2fa61b91d7c2 to bba66b658cee (1 revision) (flutter/flutter#125791)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
30c91b8180e7 to 2fa61b91d7c2 (1 revision) (flutter/flutter#125789)
2023-05-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from
d76a22e67eea to 30c91b8180e7 (1 revision) (flutter/flutter#125787)
2023-05-01 andrewrkolos@gmail.com [tools] Apply Android Studio version
detection logic to explicitly configured installation directory
(`flutter config --android-studio-dir`) (flutter/flutter#125596)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
f234d5e1dd26 to d76a22e67eea (1 revision) (flutter/flutter#125776)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
c796390d14cb to f234d5e1dd26 (1 revision) (flutter/flutter#125773)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
e99f31f4437d to c796390d14cb (1 revision) (flutter/flutter#125762)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
1942b0c2cd9a to e99f31f4437d (1 revision) (flutter/flutter#125758)
2023-04-30 engine-flutter-autoroll@skia.org Roll Flutter Engine from
7806f8a4fb4c to 1942b0c2cd9a (1 revision) (flutter/flutter#125757)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
8167f909bc8d to 7806f8a4fb4c (2 revisions) (flutter/flutter#125750)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
900b8a89b73b to 8167f909bc8d (1 revision) (flutter/flutter#125748)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
c56ea398b0dc to 900b8a89b73b (1 revision) (flutter/flutter#125747)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
0834c886f06a to c56ea398b0dc (1 revision) (flutter/flutter#125746)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
68f2ed0a1db5 to 0834c886f06a (1 revision) (flutter/flutter#125736)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
0079bb4a20d0 to 68f2ed0a1db5 (1 revision) (flutter/flutter#125735)
2023-04-29 dnfield@google.com Fix crasher in DragableScrollableSheet
when controller is animating and switching widgets
(flutter/flutter#125721)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
8f04b29c1b98 to 0079bb4a20d0 (2 revisions) (flutter/flutter#125734)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
788d0ed5ed06 to 8f04b29c1b98 (1 revision) (flutter/flutter#125731)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
89a8affdced0 to 788d0ed5ed06 (1 revision) (flutter/flutter#125729)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
3835d975c8b0 to 89a8affdced0 (2 revisions) (flutter/flutter#125725)
2023-04-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from
1ae848ce6b55 to 3835d975c8b0 (1 revision) (flutter/flutter#125722)
2023-04-29 65850618+Anas35@users.noreply.github.com fix package template
create platform folders (flutter/flutter#125292)
2023-04-28 thkim1011@users.noreply.github.com Sliver Cross Axis Group
(flutter/flutter#123862)
2023-04-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from
2a84ea55e4ef to 1ae848ce6b55 (1 revision) (flutter/flutter#125718)
2023-04-28 zanderso@users.noreply.github.com Remove bringup from
new_gallery_skia_ios__transition_perf (flutter/flutter#125715)
2023-04-28 engine-flutter-autoroll@skia.org Roll Flutter Engine from
98b6fabc66bb to 2a84ea55e4ef (10 revisions) (flutter/flutter#125714)
2023-04-28 109111084+yaakovschectman@users.noreply.github.com Opt into
CMake policy CMP0135 (flutter/flutter#125502)
2023-04-28 leroux_bruno@yahoo.fr Add a channel to query the engine
keyboard state (flutter/flutter#122885)
2023-04-28 fluttergithubbot@gmail.com Roll pub packages
(flutter/flutter#125698)
2023-04-28 36861262+QuncCccccc@users.noreply.github.com
`Checkbox.fillColor` should be applied to checkbox's background color
when it is unchecked. (flutter/flutter#125643)
2023-04-28 zanderso@users.noreply.github.com Add back one Skia test on
iOS (flutter/flutter#125663)
2023-04-28 fluttergithubbot@gmail.com Roll pub packages
(flutter/flutter#125447)
2023-04-28 97679004+phlippieb-discovery@users.noreply.github.com Nit:
grammar in documentation (flutter/flutter#125462)
...
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 16, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 17, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 17, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 17, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a: fidelity Matching the OEM platforms better autosubmit Merge PR when tree becomes green via auto submit App c: contributor-productivity Team-specific productivity, code health, technical debt. c: new feature Nothing broken; request for a new capability f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Introduce tabs alignment property for Material 3 TabBar
2 participants