-
Notifications
You must be signed in to change notification settings - Fork 29.7k
[CP] Add ability to customize NavigationBar indicator overlay and fix in…
#139162
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
auto-submit
merged 1 commit into
flutter:flutter-3.16-candidate.0
from
Piinks:pickNavOverlay
Dec 5, 2023
Merged
[CP] Add ability to customize NavigationBar indicator overlay and fix in…
#139162
auto-submit
merged 1 commit into
flutter:flutter-3.16-candidate.0
from
Piinks:pickNavOverlay
Dec 5, 2023
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…dicator shape for the overlay (flutter#138901) fixes [Provide ability to override `NavigationBar` indicator ink response overlay](flutter#138850) fixes [`NavigationBar.indicatorShape` is ignored, `NavigationBarThemeData.indicatorShape` is applied to the indicator inkwell](flutter#138900) ### Code sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @OverRide Widget build(BuildContext context) { return const MaterialApp( debugShowCheckedModeBanner: false, home: Scaffold( bottomNavigationBar: NavigationBarExample(), ), ); } } class NavigationBarExample extends StatefulWidget { const NavigationBarExample({super.key}); @OverRide State<NavigationBarExample> createState() => _NavigationBarExampleState(); } class _NavigationBarExampleState extends State<NavigationBarExample> { int index = 0; @OverRide Widget build(BuildContext context) { return NavigationBar( elevation: 0, overlayColor: const MaterialStatePropertyAll<Color>(Colors.transparent), // indicatorShape: RoundedRectangleBorder( // borderRadius: BorderRadius.circular(4.0), // ), indicatorColor: Colors.transparent, selectedIndex: index, onDestinationSelected: (int index) { setState(() { this.index = index; }); }, destinations: const <Widget>[ NavigationDestination( selectedIcon: Icon(Icons.home_filled), icon: Icon(Icons.home_outlined), label: 'Home', ), NavigationDestination( selectedIcon: Icon(Icons.favorite), icon: Icon(Icons.favorite_outline), label: 'Favorites', ), ], ); } } ``` </details> ### Before #### Cannot override `NavigationBar` Indicator ink well overlay  #### Indicator shape is ignored for the indicator overlay  ### After #### Can use `NavigationBar.overlayColor` or `NavigationBarThemeData.NavigationBar` to override default indicator overlay `overlayColor: MaterialStatePropertyAll<Color>(Colors.red.withOpacity(0.33)),`  `overlayColor: MaterialStatePropertyAll<Color>(Colors.transparent),`  #### Indicator shape is respected for the indicator overlay 
TahaTesser
approved these changes
Nov 28, 2023
Member
TahaTesser
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
HansMuller
approved these changes
Nov 28, 2023
Contributor
HansMuller
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
engine-flutter-autoroll
added a commit
to engine-flutter-autoroll/packages
that referenced
this pull request
Dec 6, 2023
engine-flutter-autoroll
added a commit
to engine-flutter-autoroll/packages
that referenced
this pull request
Dec 7, 2023
engine-flutter-autoroll
added a commit
to engine-flutter-autoroll/packages
that referenced
this pull request
Dec 7, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
autosubmit
Merge PR when tree becomes green via auto submit App
cp: approved
Approved cherry-pick request
cp: review
Cherry-picks in the review queue
f: material design
flutter/packages/flutter/material repository.
framework
flutter/packages/flutter repository. See also f: labels.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
…dicator shape for the overlay (#138901)
fixes Provide ability to override
NavigationBarindicator ink response overlay fixesNavigationBar.indicatorShapeis ignored,NavigationBarThemeData.indicatorShapeis applied to the indicator inkwellCherry pick fixes #139159
Code sample
expand to view the code sample
Before
Cannot override
NavigationBarIndicator ink well overlayIndicator shape is ignored for the indicator overlay
After
Can use
NavigationBar.overlayColororNavigationBarThemeData.NavigationBarto override default indicator overlayoverlayColor: MaterialStatePropertyAll<Color>(Colors.red.withOpacity(0.33)),overlayColor: MaterialStatePropertyAll<Color>(Colors.transparent),Indicator shape is respected for the indicator overlay
Replace this paragraph with a description of what this PR is changing or adding, and why. Consider including before/after screenshots.
List which issues are fixed by this PR. You must list at least one issue. An issue is not required if the PR fixes something trivial like a typo.
If you had to change anything in the flutter/tests repo, include a link to the migration guide as per the breaking change policy.
Pre-launch Checklist
///).If you need help, consider asking for advice on the #hackers-new channel on Discord.