fluent_ui 4.9.2 fluent_ui: ^4.9.2 copied to clipboard
Implements Windows UI in Flutter. Based on the official documentation
4.9.2 #
- feat:
NavigationAppBar.leading
now has a minimum width ofkCompactNavigationPaneWidth
instead of being fixed to this width (#1103) - feat: Add
TabView.stripBuilder
(#1106) - fix: Correctly apply
EditableComboBox.style
(#1121) - feat: Add
BreadcrumbBar.chevronIconBuilder
andBreadcrumbBar.chevronIconSize
(#1111)
4.9.1 #
- feat: ¹
NumberBox
now supports precision greater than 4. ² AddNumberBox.pattern
,NumberBox.formatter
,NumberBox.format
(#1080) - fix: Resolved issue where
PaneItem
withinPaneItemExpander
remained accessible inNavigationPane
compact mode (#1081) - fix: Correct number of days on
DatePicker
popup (#1049) - feat: Create
PaneItemWidgetAdapter
(#1087) - feat: Add
maxWidth
toTooltipThemeData
for optional wrapping of long tooltips (#1094) - fix: Fixed compile errors with Flutter 3.24.0 stable (#1097)
4.9.0 #
-
fix: ¹
DropDownButton.closeAfterClick
is now correctly applied. ² AddedMenuFlyoutItem.closeAfterClick
, which defaults totrue
. (#1016) -
fix:
MenuFlyoutSubItem
does not close when pressed (#1037) -
fix: Make
ScaffoldPage
opaque (#1048) -
fix: Scroll issue in
DatePicker
. (#1054) -
feat: Add
NumberBox.textInputAction
andNumberBox.onEditingComplete
(#1063) -
fix:
NumberBox
does not calls a rebuild when it is already building (#1064) -
feat: Add
Tab.color
,Tab.selectedColor
andTab.outlineColor
to TabView (#1068) -
feat: Added
NavigationView.onItemPressed
callback, called when the item is on tap (#1067) -
fix: Mark
MenuFlyoutItem
as disabled when.onPressed
isnull
(#1074) -
BREAKING feat: Removed
ButtonState
,ButtonStates
and their related classes. UseWidgetStateProperty
,WidgetState
instead. (#1075) Before:Button( style: ButtonStyle( shape: ButtonState.all(RoundedRectangleBorder(...)), backgroundColor: ButtonState.resolveWith((states) { if (states.isPressed) { return Colors.blue.shade900; } return Colors.blue; }), foregroundColor: ButtonState.resolveWith((states) { return ButtonState.forStates<Color>( states, disabled: Colors.grey, hovered: Colors.white.withOpacity(0.8), pressed: Colors.white.withOpacity(0.6), ); }), ), ),
After:
Button( style: ButtonStyle( shape: WidgetStatePropertyAll(RoundedRectangleBorder(...)), backgroundColor: WidgetStateProperty.resolveWith((states) { if (states.isPressed) { return Colors.blue.shade900; } return Colors.blue; }), foregroundColor: WidgetStateProperty.resolveWith((states) { return WidgetStateExtension.forStates<Color>( states, disabled: Colors.grey, hovered: Colors.white.withOpacity(0.8), pressed: Colors.white.withOpacity(0.6), ); }), ), ),
-
fix: Do not dismiss Scrollbar if it is still being pressed (#1077)
-
feat: Make
Tab
a widget that can be overridable (#1050) To create a custom Tab, you can now extendTab
:class MyCustomTab extends Tab { MyCustomTab({super.key, required super.text, required super.body}); @override State<Tab> createState() => MyCustomTabState(); } class MyCustomTabState extends TabState { @override Widget build(BuildContext context) { super.build(context); return ColoredBox( color: Colors.red, child: super.build(context), ); } }
Explore the
TabState
reference to see all the available methods you can override. -
feat: Deprecate
TabView.addIconData
andTabView.addIconBuilder
. UseTabView.newTabIcon
instead. -
fix:
TabView.closeDelayDuration
default value is now 1 second.
4.8.7 #
4.8.6 #
- fix: Pop the menu flyout before than calling the close callback (#1009)
- fix:
Button.child
is now vertically centered (#1011) - fix: Adjust
Button
's foreground color when hovered and pressed (#1012) - feat: Added
.textController
and.onTextChanged
toEditableComboBox
. (#1017) - fix: Do not show the selected indicator on the combo box popup if the current value is not present in the items list.
4.8.5 #
4.8.4 #
4.8.3 #
4.8.2 #
4.8.1 #
4.8.0 #
-
fix: Correctly paint buttons borders (#956)
-
MINOR BREAKING Removed
ButtonStyle.border
. UseButtonStyle.shape
instead: Before:Button( style: ButtonStyle( border: ButtonState.all(BorderSide(...)), ), ),
Now:
Button( style: ButtonStyle( shape: ButtonState.all(RoundedRectangleBorder(...)), ), ),
-
BREAKING Removed
Chip
and its related widgets. -
BREAKING Removed
PillButtonBar
and its related widgets. UseCommandBar
instead. -
BREAKING Removed
SplitButtonBar
. UseSplitButton
instead. -
BREAKING Removed
BottomSheet
and its related widgets and functions. -
BREAKING Removed
Snackbar
,showSnackbar
and their related widgets. UseInfoBar
anddisplayInfoBar
instead. -
fix: do not close
InfoBar
twice (#955) -
feat: add Kurdish locale (#962)
-
fix: review
debugFillProperties
on widgets (#974) -
fix: Date and Time pickers when localization is not English (#961)
4.7.7 #
- fix:
ProgressRing
andProgressBar
now fit correctly the parent bounds (#942) - fix:
TabView
buttons was only rendered on hover. Now the buttons (add and scroll buttons) are always rendered. - fix:
ComboboxItem
correctly apply foreground color. AddedComboboxItem.enabled
(#949) - Add a support for Cupertino Loclizations from GlobalCupertinoLocalizations, this can help fix some errors when using offical adaptive widgets and other cupertino widgets
- Upgrade the
scroll_pos
dependecy to the latest version which is 0.5.0
4.7.6 #
4.7.4 #
- fix: tap on
DatePicker
day does not skip a day (#914) - fix: ensure
PaneItemExpander
's flyout is attached before using it (#857) - fix: expose more
TextField
properties onNumberBox
(#933) - fix: expose more
TextField
properties onPasswordBox
(#925) - fix:
AutoSuggestBox.onOverlayVisibilityChanged
now results in the correct state (#926) - fix:
MenuFlyoutSubItem
inherits the acrylic data fromMenuFlyout
(#932) - fix:
MenuFlyoutSubItem
inhertis itsMenuFlyout
parent decoration data (#931) - feat: Expose
paneNavigationButtonIcon
onNavigationPaneThemeData
(#929)
4.7.3 #
-
feat: Expose
AutoSuggestBoxState
(#912) With it, you can now control theAutoSuggestBox
state, such as opening and closing the overlay. Use the.dismissOverlay
method to close the overlay and.showOverlay
to display it.Use the
AutoSuggestBox.onOverlayVisibilityChanged
callback to listen to overlay visibility changes. -
fix:
StickyNavigationIndicator
now doesn't stop if another item interrupts the ongoing animation (36b82b) -
fix: Render
Combobox
's elevation outside of the clipper (#896) -
fix: Do not make items exclusive on
NavigationView
's body (#913) -
fix:
Expander.content
has now its focus excluded when closed -
fix: Fixed compile errors with Flutter 3.13.0 stable (#915)
4.7.2 #
- feat: Add Wifi and Bluetooth icons (#909)
- feat: Add
ListTile.cursor
(#901) - feat: Add
Tab.disabled
(#904) - feat: Add
NavigationPaneThemeData.overlayBackgroundColor
, which is displayed on overlays, such as minimal and compact pane overlays (#903) - fix: Correctly remove tooltip as soon as the mouse leaves the widget (#905)
- fix: Do not show
PaneItem.infoBadge
andPaneItem.trailing
while the pane is transitioning (#906) - fix:
NavigationView.onOpenSearch
is called whenautoSuggestBoxReplacement
is pressed (c251600) - fix:
AutoSuggestBox
overlay is now only displayed after the user started typing (d95970a)
4.7.1 #
- Add vertical support to
CommandBar
. (#872) - Deprecated
SplitButtonBar
and its related widgets. UseSplitButton
orSplitButton.toggle
instead (#882, #411) - Implement
BreadcrumbBar
(#878) - Ensure all widgets use the correct debug checks (#883)
Expander
header is sized dynamically (#523)- Added
Expander.contentPadding
andExpander.contentShape
(#891) - Tooltips are dismissed as soon as the mouse leaves (#898)
- Added
FluentThemeData.selectionColor
, which defaults to the accent color normal shade (#897) - Flyout reverse transition duration is properly set (#893)
- Remove view padding when app bar is provided (#884)
NavigationAppBar.title
is expanded to fit the entire width on top mode (#902)AutoSuggestBox
does not duplicate focus (#894)StickyNavigationIndicator
look-and-feel updated to match the native implementation (#380b49c)
4.7.0 #
- Add Slovak localization (#850)
- Add
AutoSuggestBox.itemBuilder
callback builder, which builds the items inside the overlay (#869) - Add
AutoSuggestBoxItem.semanticsLabel
(#869) - Add
ButtonState.forStates
, a helper function to quickly resolve values for each button state (#875) - Slider label color is solid (#847)
- BREAKING Removed
.disabledColor
,uncheckedColor
,.checkedColor
and.borderInputColor
fromFluentThemeData
. Use the values from theme resources instead (1295b6
) - BREAKING To match the native implementation,
ToggleSwitch.thumb
and.thumbBuilder
have been renamed to.knob
and.knobBuilder
, respectively.DefaultToggleSwitchThumb
was renamed toDefaultToggleSwitchKnob
(e15e89d) - Added
CheckboxThemeData.foregroundColor
,RadioButtonThemeData.foregroundColor
andToggleSwitchThemeData.foregroundColor
, which, by default, reacts if the inputs are disabled or not (#861) ToggleSwitch
correctly behaves as disabled whenonChanged
isnull
(4b5afb5
)- Add
PaneItemExpander.initiallyExpanded
(#864) - Add
NumberFormBox
(#862) PaneItem.onTap
fromPaneItemExpander.items
, when displayed in popup, are now correctly invoked (#859)- Navigating through the
Combobox
items on web now works properly (#757) TreeViewItem
, if selection mode issingle
, gets selected when focused with the keyboard (#835)- In multiple selection mode,
TreeView
's built-in checkbox now doesn't receive focus. It can now be focused by invoking it with the keyboard (#877) - Enabled click on
DatePicker
andTimePicker
(#6) DatePicker.endDate.year
is taken into account when displaying the years (#874)DatePicker
's day field is now correctly selected (d152dc)DatePicker
andTimePicker
are correctly fit into the navigator bounds (711390)- Add
TreeView.gesturesBuilder
andTreeViewItem.gestures
(#851) - Improved overall
Semantics
. Now, not every input is treated as a button (2fee45) - Deprecated all mobile widgets:
BottomSheet
,Snackbar
,Chip
andPillButtonBar
- and all their related widgets. (c1cfe491) - BREAKING Removed previously deprecated fields (ee601649):
EditableComboboxFormField.value
. UseEditableComboboxFormField.initialValue
insteadDatePicker.startYear
. UseDatePicker.startDate
insteadDatePicker.endYear
. UseDatePicker.endDate
insteadTextButton
. UseHyperlinkButton
insteadTabView.wheelScroll
. It is no longer usedThemeData
. UseFluentThemeData
instead
4.6.1 #
- Fix incompatibilities with Flutter 3.10
4.6.0 - Flutter 3.10 #
4.5.1 #
- Do not unfocus the auto suggest box on clear (#816)
- Review all the inputs margins and inputs (#799)
HyperlinkButton
now uses the correct color in dark mode (#817)DatePicker
,TimePicker
and all other overlay widgets are now positioned correctly if there are multiple navigators (#817)- Added
PasswordFormBox
(#811) DateTime.startYear
andDateTime.endYear
are now deprecated. UseDateTime.startDate
andDateTime.endDate
instead. (#687)- Added
.decoration
,.foregroundDecoration
,.highlightColor
,.unfocusedColor
,.keyboardAppearance
,.textAlign
,.textAlignVertical
toPasswordBox
(#820) - Do not block text style inheritance in widgets (#823)
NavigationView
now works correctly in top mode (#821)- Add
showDialog.dismissWithEsc
(#826)
4.5.0 #
- MINOR BREAKING Remove default value of
backButtonDispatcher
when usingFluentApp.router
(#803) - Add parameters
onTapDown
andonTapUp
on all buttons. (#795)- Breaking: if you use the abstract class
BaseButton
, these two parameters are now required
- Breaking: if you use the abstract class
- Add
PasswordBox
widget (#795) - Improve example in Navigation/NavigationView in app. (#796)
- Added Tamil language localization. (#798)
- BREAKING CHANGE
TextButton
is renamed toHyperlinkButton
andButtonThemeData.textButtonStyle
is renamed toButtonThemeData.hyperlinkButtonStyle
(#802) - Added
.notificationPredicate
,.scrollbarOrientation
,.pressDuration
and.minOverscrollLength
toScrollbar
(#809) - Rebuild the
TreeView
elements on item invocation (#810)
4.4.2 #
-
Add support for
routerConfig
toFluentApp.router
(#781) -
Add source code for
Show InfoBar
in example application. (#785) -
Make
color
optional inFluentApp.router
. (#782) -
Fix
TabView
scroll (the item count was not correctly set) and now the scroll event is not propagated to the parent. (#772) -
Do not calculate the position of the flyout if the
position
parameter is provided. (#764) -
Add source code for Surfaces/CommandBar in example application (#766)
-
Do not enforce a max height on
PaneItem
(#762) -
Add Greek localization (#761)
-
Add
NavigationState.compactOverlayOpen
(#758):final key = GlobalKey<NavigationState>(); NavigationView(key: key); final isCompactModeOpen = key.currentState?.compactOverlayOpen ?? false;
-
TabView
lazy loading (#751) -
Added Bangla localization (#786)
-
Correctly position the flyouts and tooltips on a multi navigator context (#780)
-
Allow all kinds of menu flyout widgets on
DropDownButton
(#775) -
Added
CommandBarCard.borderColor
4.4.1 #
-
Dynamically adding/removing items in NavigationPane (#744)
-
Fix example application was showing window icons twice on transparency change and maximizing
-
Add
TextFormBox.initialValue
(#749) -
Add
PaneItem.enabled
(#748) -
Add Thai localization (#750)
-
FocusTraversalGroup
is no longer added abovepaneBodyBuilder
(#700) -
BREAKING
NavigationView.paneBodyBuilder
now takes two arguments (#700) Before:NavigationView( paneBodyBuilder: (child) { return child; } ),
Now:
NavigationView( paneBodyBuilder: (item, child) { return child; } )
-
Use correct height and padding on
TextBox
(#754) -
Updated
TextBox
cursor to match the native implementation (#754) -
TextBox
state is now updated correctly when focused (#754)
4.4.0 #
TabView
macos shortcuts (#728)TabView
focus on children now works properly (#648)TabView
colors now follow the Win UI 3 theme resources (#730)- Add myanmar localization (#682)
- Fix
ContentDialog
copy code (#735) TextBox
rework:- BREAKING Removed
.initialValue
. UseTextEditingController.text
instead - BREAKING Removed
.header
and.headerStyle
. UseInfoLabel
instead - BREAKING Removed
.outsidePrefix
,.outsidePrefixMode
,.outsideSuffix
,.outsideSuffixMode
- BREAKING Removed
.minHeight
and.iconButtonThemeData
AutoSuggestBox
popup is now part of the text box tap region (#698)FluentTextSelectionToolbar
now follows global typography (#712)
- BREAKING Removed
- Attach flyout to target at build time (#743)
4.3.0 #
-
Correctly calculate the padding around the flyout on automatic mode
-
Possibility to supply transparent colors to the barrier (#702)
-
Correctly assign the current pane mode to
PaneItemExpander
(#707) -
showFlyout.dismissOnPointerMoveAway
now takes the whole flyout box into consideration -
MINOR BREAKING Replaced
ContentManager
andContentSizeInfo
withFlyout
Before:final size = ContentSizeInfo.of(context).size;
Now:
final size = Flyout.of(context).size;
With it, it's also possible to have multiple info about the current open flyout. Sub-menus also have their own flyout instance. To close the current flyout, use
Flyout.of(context).close();
-
Added option to open
DropDownButton
flyout programatically (#723)final dropdownKey = GlobalKey<DropDownButtonState>(); DropDownButton( key: dropdownKey, ... ); dropdownKey.currentState?.open(...); // opens the flyout final isOpen = dropdownKey.currentState?.isOpen ?? false; // checks if the flyout is open
-
BREAKING Removed deprecated memebers:
DropDownButtonItem
andDropDownButton.buttonStyle
(#724) -
ThemeData
is depreacted. UseFluentThemeData
instead (#722) -
BREAKING
MenuFlyoutSubItem.items
now requires a function Before:MenuFlyoutSubItem( items: [...] ),
After:
MenuFlyoutSubItem( items: (context) { // You can call Flyout.of(context).close(), for example return [...] }, )
4.2.0 #
-
Flyouts rework (#690):
Flyouts were reworked to match the design and behavior of native WinUI 3
BREAKING Removed
Flyout
widget. To replace it,FlyoutTarget
andFlyoutController
were created.FlyoutTarget
works like a target, which the givencontroller
will use to display the flyout
Migration guide:
Before:
final controller = FlyoutController(); Flyout( controller: controller, placement: ..., position: ..., verticalOffset: ..., onOpen: ..., onClose: ..., child: Button( onPressed: controller, child: Text('Tap me'), ), ),
Now:
final controller = FlyoutController(); FlyoutTarget( controller: controller, child: Button( onPressed: _showFlyout, child: Text('Tap me'), ), ), void _showFlyout() async { await controller.showFlyout( barrierDismissible: ..., dismissWithEsc: ..., // NEW dismissOnPointerMoveAway: ..., // NEW placementMode: ..., autoModeConfiguration: ..., // NEW forceAvailableSpace: ..., // NEW shouldConstrainToRootBounds: ..., // NEW additionalOffset: ..., margin: ..., // NEW barrierColor: ..., navigatorKey: ..., // NEW transitionBuilder: ..., // NEW transitionDuration: ..., // NEW builder: (context) => FlyoutContent(...), ); }
Now, it's possible to dismiss the flyout by tapping the barrier (
barrierDismissible
), pressing theESC
keyboard key (dismissWithEsc
) and by moving the cursor (pointer) away from the flyout (dismissOnPointerMoveAway
- defaults to false);Automatic mode is finally implemented, and it's the default mode. By setting
autoModeConfiguration
, it's possible to customize the preferred flyout placement. If flyout doesn't meet the placement conditions, it decides where it fits the best.forceAvailableSpace
determines whether the flyout size should be forced the available space according to the attached target. It's useful when the flyout is large but can not be on top of the target.NavigationView
's top navigation mode now uses it by default on pane items overflow.shouldConstrainToRootBounds
determines whether the flyout should fit the root bounds - usually the window bounds. If false, the flyout will be able to overflow the screen on all sides. Defaults totrue
margin
determines the margin of the flyout to the root.additionalOffset
determines the margin of the flyout to the target.It's now possible to assign a custom transition to the flyout by providing
transitionBuilder
andtransitionDuration
. By default, a light slide-fade transition is used, but it can be highly customizable to fit your needs. It provides the current placement mode - since automatic mode may change it at layout time.DropdownButton
uses it to create its slidethrough transition.position
andplacement
were replaced byplacementMode
, which gives horizontal and vertical options of placement, at all screen alignments. It's also possible to use it in a right-to-left context by usingplacementMode.resolve(Directionality.of(context))
Use
position
to display the flyout anywhere in the screen. It's useful to create context menus -
Added support for Flutter 3.7 (#568)
-
Added
TextBox.magnifierConfiguration
,TextBox.spellCheckConfiguration
andTextBox.onTapOutside
4.1.5 #
- Add
AutoSuggestBox.maxPopupHeight
(#677) - Fix assertion in
NavigationViewState
if no pane was currently selected (#678) - Make
NavigationView.paneBodyBuilder
responsible for state management of the widget it returns, allowingpaneBodyBuilder
to return anIndexedStack
(common use case) (#679) - Added support for Belarusian language (#686)
- Added missing German translation for
minute
,hour
,day
,month
, andyear
4.1.4 #
- Avoid overflow in
DatePicker
andTimePicker
popup (#663) - Ensure sticky indicator is mounted before updating (#670)
- Date and Time pickers popup are now positioned correctly in RTL mode (#675)
- It's now possible to navigate through
AutoSuggestBox
items by long pressing arrow up and down keys - Do not clear focus scope after selecting an item in
AutoSuggestBox
(#671) AutoSuggestBox
'strailingIcon
now comes after the close button- MINOR BREAK
TextBox.clearGlobalKey
was removed, since it was not used - Add
AutoSuggestBox.unfocusedColor
andTextFormBox.unfocusedColor
- Implement
displayInfoBar
, which shows an info bar as an overlay (#673) - Implement
ThemeData.extensions
(#674)
4.1.3 #
4.1.2 #
4.1.1 #
- Ensure acrylic is updated only if it's mounted (#634)
- Ensure the provided
startYear
andendYear
inDateTime
are used properly (#627) - Fix left arrow key not moving to parent item on collapsed
TreeViewItem
(#632) - Added
NavigationPane.scrollBehavior
(#640) - Added
CommandBarCard.borderRadius
(#641) - Ensure combobox scroll controller has a client attached before using it (#620)
- Correctly use
TextFormBox.initialValue
- Added
TreeViewState.toggleItem
, which toggles the item expanded state (#493) - Ensure
NavigationView
pane items are brought into view when selected
4.1.0 #
- Fixed
TreeView
selection state behavior for items that are not expanded (#578) - Added support for Romanian language (#602)
- Ensure the body state in
NavigationView
is properly preserved (#607) - BREAKING Renamed
ExpanderState.open
toExpanderState.isExpanded
- The same identifier is no longer used for every
Expander
(#596) - Ensure the TabView scroll controller has clients before using it (#615)
- TabView now waits a time to resize after closed (#617)
ToggleButton
border width is uniform (#610)
4.0.3+1 #
- Update documentation
4.0.3 #
4.0.2 #
- Add
NavigationView.paneBodyBuilder
for customization of widget built for body of pane. (#548) - Fixed
NavigationAppBar
unnecessary leading icon when no pane is provided inNavigationView
(#551) - Added
NavigationView.minimalPaneOpen
and, with it, the possibility to open minimal pane programatically (#564) - Assign an index to pane item expanders (#566)
- Update
NavigationView
compact mode transition TreeView
updates (#555):- BREAKING Added
TreeViewItemInvokeReason
parameter toTreeView.onItemInvoked
andTreeViewItem.onInvoked
. - Fix clearing out selection state on initial state build in certain cases for a single selection mode tree view.
- Fix single selection mode to properly deselect hidden child items when selecting a collapsed parent item.
- Add
TreeView.includePartiallySelectedItems
so that items who have children with a mixed selection state will be included in theonSelectionChanged
callback. - Add
TreeView.deselectParentWhenChildrenDeselected
optional behavior so that parent items can remain selected when all of their children are deselected. - Add
TreeViewItem.setSelectionStateForMultiSelectionMode
helper method and[TreeViewItem].selectedItems
extension method, to make it easier for application code to programmatically change selection state of items in a multi-selection mode tree view.
- BREAKING Added
- Added support for Uzbek language
4.0.1 #
PaneItemAction.body
is no longer required (#545)- Added
DropDownButton.onOpen
andDropDownButton.onClose
callbacks (#537) - Ensure
MenuFlyoutItem.onPressed
is called after the flyout is closed ifDropDownButton.closeAfterClick
is true (#520) - Ensure the
TimePicker
andDatePicker
popups will fit if the screen is small (#544) - Do not apply padding to
NavigationAppBar.leading
(#539) - Added
AutoSuggestBox.noResultsFoundBuilder
(#542) - Added
AutoSuggestBox.inputFormatters
(#542) - Added support for Hebrew language
4.0.0 #
-
BREAKING Removed
NavigationBody
. UsePaneItem.body
instead (#510/#531): Before:NavigationView( pane: NavigationPane( items: [ PaneItem(icon: Icon(FluentIcons.add)), PaneItem(icon: Icon(FluentIcons.add)), PaneItem(icon: Icon(FluentIcons.add)), ], ), content: NavigationBody( children: [ _Item1(), _Item2(), _Item3(), ], ), ),
Now:
NavigationView( ... pane: NavigationPane( items: [ PaneItem( icon: Icon(FluentIcons.add), body: _Item1(), ), PaneItem( icon: Icon(FluentIcons.add), body: _Item2(), ), PaneItem( icon: Icon(FluentIcons.add), body: _Item3(), ), ], ), ),
Or if you don't have a pane, you can use the content like the following:
NavigationView( content: ScaffoldPage( header: PageHeader( title: titleRow, ), content: child, ), ),
either one attribute of pane or content must not be null
Use
NavigationView.transitionsBuilder
to create custom transitions -
Added
PaneItem.onTap
(#533) -
Compact pane is no longer toggled when item is selected (#533). To toggle it programatically, use
NavigationViewState.toggleCompactOpenMode
when an item is tapped -
Dynamic header height for open pane (#530)
-
Fixes memory leaks on
NavigationView
-
TreeView
updates:-
All items of the same depth level now have the same indentation. Before, only items with the same parent were aligned.
-
The hitbox for the expand icon of each item now uses the item's full height and is three times wider than the actual icon. This corresponds to the implementation in the explorer of Windows 10/11.
-
You can now choose whether the items of a TreeView should use narrow or wide spacing.
-
Do not invoke the tree view item on secondary tap (#526)
-
BREAKING
TreeView.onSecondaryTap
is now a(TreeViewItem item, TapDownDetails details)
callback: Before:TreeView( ..., onSecondaryTap: (item, offset) async {} ),
Now:
TreeView( ..., onSecondaryTap: (item, details) { final offset = details.globalPosition; }, )
-
Expand/collape items with right and left arrow keys, respectively (#517)
-
Added
TreeView.onItemExpandToggle
andTreeViewItem.onExpandToggle
(#522)
-
-
BREAKING
AutoSuggestBox
dynamic type support (#441):Before:
AutoSuggestBox( items: cats.map((cat) { return AutoSuggestBoxItem( value: cat, onFocusChange: (focused) { if (focused) debugPrint('Focused $cat'); } ); }).toList(), onSelected: (item) { setState(() => selected = item); }, ),
Now:
AutoSuggestBox<String>( items: cats.map((cat) { return AutoSuggestBoxItem<String>( value: cat, label: cat, onFocusChange: (focused) { if (focused) debugPrint('Focused \$cat'); } ); }).toList(), onSelected: (item) { setState(() => selected = item); }, ),
[4.0.0-pre.4] - Almost there - [02/09/2022] #
DisableAcrylic
now fully disable transparency of its decendentsAcrylic
s (#468)- Do not interpolate between infinite constraints on
TabView
(#430) - Do not rebuild the
TimePicker
popup when already rebuilding (#437) ToggleSwitch
updates:- Added
TextChangedReason.cleared
, which is called when the text is cleared by the user in anAutoSuggestBox
(#461) - Call
AutoSuggestBox.onChanged
when an item is selected using the keyboard (#483) Tooltip
overlay is now ignored when hovered (#443)- Do not add unnecessary padding in
DropdownButton
(#475) ComboBox
updates:- BREAKING Renamed
Combobox
toComboBox
- BREAKING Renamed
ComboboxItem
toComboBoxItem
- BREAKING Renamed
ComboBox.backgroundColor
toComboBox.popupColor
- Implement
EditableComboBox
, a combo box that accepts items that aren't listed (#244) ComboBox.isExpanded: false
now correctly sets the button width (#382)ComboBox
's items height are correctly calculated, as well as initial scroll offset (#472)- BREAKING
ComboBox.disabledHint
was renamed toComboBox.disabledPlaceholder
- Added
ComboBoxFormField
andEditableComboBoxFormField
(#373) ComboBox.comboBoxColor
is now correctly applied (#468)ComboBox
popup can't be opened if disabled
- BREAKING Renamed
- Implemented
PaneItemExpander
(#299) TimePicker
andDatePicker
popup now needs a minimum width of 260 (#494)- Correctly align
NavigationAppBar
content (#494) - BREAKING Added
InfoLabel.rich
.InfoLabel
is no longer a constant contructor (#494) - Always add
GlobalMaterialLocalizations
aboveReorderableListView
(#492) - BREAKING Removed
ContentDialog.backgroundDismiss
. UseshowDialog.barrierDismissable
(#490) - Reviewed focus (#496)
DatePicker
andTimePicker
now show the focus highlight. Their popup now can be controlled using the keyboardNavigationBody
now uses aFocusTraversalGroup
to handle focus This means the the content of the body will be fully traversed before moving on to another widget or group of widgets. Learn moreTreeViewItem
now shows the focus highlight. They can also be selected using the keyboardExpander
now shows the focus highlight
- Progress Indicators velocity is no longer affected by device frame rate (#502)
- Added
AutoSuggestBox.enabled
(#504) - Correctly keep the
NavigationView
animation state (cf0fae1 ,bd89ba6) - Calculate
selected
for all parents as soon as theTreeView
is built
[4.0.0-pre.3] - Top navigation and auto suggestions - [13/08/2022] #
-
NavigationView
mode fixes:- When top overflow menu is opened,
PaneItemHeader
no longer throws an unsupported error - When on top mode,
PaneItemHeader
is properly aligned to the other items. - Added
NavigationPaneThemeData.headerPadding
, which is applied toPaneItemHeader
on open, compact and minimal mode. It defaults to 10 pixels at the top - BREAKING
PaneItem.getPropertyFromTitle
is nowwidget.getProperty
:
Before:
getPropertyFromTitle<TextStyle>()
Now:
title.getProperty<TextStyle>()
This was changed because the properties of
PaneItemHeader
needed to be accessed, but the old version only supported to get the properties ofPaneItem.title
. It can be called on aText
,RichText
or in anIcon
widgetInheritedNavigationView
is now accessible on the top overflow menu- Added
NavigationPaneThemeData.selectedTopTextStyle
andNavigationPaneThemeData.unselectedTopTextStyle
, which is applied to the items on top mode - Fixed
content
focus on minimal mode - Updated default transitions for top mode:
HorizontalSlidePageTransition
- When top overflow menu is opened,
-
Fix incorrect translation of
TimePicker
in Traditional Chinese. -
Added
ScaffoldPage.resizeToAvoidBottomInset
(#444) -
Consider view padding for
NavigationAppBar
-
Scrollbar
updates (#356):- Correctly use
backgroundColor
to display the track color - Added
padding
andhoveringPadding
- Check if animation is disposed before using it (#446)
- Correctly use
-
Update
AutoSuggestBox
(#450):- Added
.enableKeyboardControls
. When true, items can be selected using the keyboard (#19) - Added
.sorter
, which lets you set a custom sort function for the suggestions.AutoSuggestBox.defaultItemSorter
is used by default - Overlay's height is now correctly calculated based on the screen size. It no longer overlaps the screen.
viewPadding
is also taken into consideration - Close the overlay if the textbox width is changes (#456)
.items
can be dynamically loaded (#387)- BREAKING
.items
is now aList<AutoSuggestBoxItem>
: Before:
AutoSuggestBox( items: [ 'Cat', 'Dog', 'Bird', 'Horse', ], ... ),
Now:
AutoSuggestBox( items: [ 'Cat', 'Dog', 'Bird', 'Horse', ].map((animal) { return AutoSuggestBoxItem( value: animal, // this takes a String child: Text('Animal $animal'), // this takes a Widget. If null, value is displayed as a text onFocusChange: (focused) { // this is called when the item is focused using the keyboard arrow keys if (focused) debugPrint('Focused animal $animal'); }, onSelected: () { // this is called when the item is selected debugPrint('Selected animal $animal'); } ); }).toList(), ... )
- Added
-
Combobox
updates (#454): -
Correctly check if a locale is supported (#455)
[4.0.0-pre.2] - Tabs, Tiles and Bugs - [23/07/2022] #
-
Remove whitespace on
ContentDialog
if title is omitted (#418) -
Apply correct color to the Date and Time Pickers button when selected (#415, #417)
-
Expose more useful properties to
AutoSuggestBox
(#419) -
BREAKING
PopupContentSizeInfo
was renamed toContentSizeInfo
-
Reworked
ListTile
(#422):- BREAKING Removed
TappableListTile
- Added support for single and multiple selection. Use
ListTile.selectable
(#409) - Added focus support
- Use the Win UI design
- BREAKING Removed
-
Reviewed animation durations (#421)
- BREAKING Removed
.animationDuration
and.animationCurve
fromScrollbarThemeData
- Added
expandContractAnimationDuration
andcontractDelay
toScrollbarThemeData
- BREAKING Removed
-
NavigationPaneSize
constraints are now correctly applied when in open mode (#336) -
NavigationIndicator
can't be invisble anymore when animation is stale (#335) -
Updated
TabView
:-
BREAKING Removed
TabView.bodies
. Now,Tab.body
is used. BeforeTabView( tabs: [ Tab(text: Text('Tab 1')), Tab(text: Text('Tab 2')), ], bodies: [ Tab1Body(), Tab2Body(), ], ),
Now:
TabView( tabs: [ Tab( text: Text('Tab 1'), body: Tab1Body(), ), Tab( text: Text('Tab 2'), body: Tab2Body(), ), ], ),
-
Updated
TabView
tabs' constraints and padding -
Fixed tab width when
TabWidthBehavior
iscompact
-
FlutterLogo
is no longer the default tab Icon
-
-
DropDownButton
menu is now sized correctly according to the screen size -
If there isn't enough space to display the menu on the preferred position,
Flyout
will display on the opposite position (#435)
[4.0.0-pre.1] - Materials and Pickers - [29/06/2022] #
-
Exposed private properties that makes it easier to create custom panes for
NavigationView
(#365):kCompactNavigationPaneWidth
kOpenNavigationPaneWidth
NavigationPane.changeTo
PaneItem.getPropertyFromTitle
-
PaneScrollConfiguration
is now applied to custom pane onNavigationView
-
Added
NavigationViewState.displayMode
. It results in the current display mode used by the view, including the automatic display mode (#360):// Define the key final key = GlobalKey<NavigationViewState>(); NavigationView( // pass the key to the view key: key, ..., ) // Get the current display mode. Note that, in order to find out the automatic display mode, // the widget must have been built at least once final PaneDisplayMode currentDisplayMode = key.currentState.displayMode;
-
The app bar action no longer overflow when minimal pane/compact overlay is open (#361)
-
Update
AutoSuggestBox
:- It now uses
Acrylic
, but it can be disabled usingDisableAcrylic
TextChangedReason.suggestionChoosen
is now called properly
- It now uses
-
Updated
TextBox
:TextBox
colors were updated to match the Win 11 design.- Fluent Text Selection Control now make use of
Acrylic
. Its items were also updated
-
Updated pickers (#406):
- If
selected
is null, a placeholder text is shown (#306) - Added new localization messages:
hour
,minute
,AM
,PM
,month
,day
andyear
. - BREAKING Removed
.hourPlaceholder
,.minutePlaceholder
,.amText
,.pmText
fromTimePicker
. It was replaced, respectivelly, by thehour
,minute
,AM
,PM
localization messages - On
DatePicker
, it's now possible to change the order of the fields:
DatePicker( ..., fieldOrder: [ DatePickerField.day, DatePickerField.month, DatePickerField.year, ], )
The fields are ordered based on the current locale by default
- On
DatePicker
, the day and year fields are now formatted based on the current locale (getDateOrderFromLocale
)
- If
-
Update
Slider
(#405):- Added
.thumbRadius
and.trackHeight
toSliderThemeData
- The active track now isn't taller than the inactive track
- Added
[4.0.0-pre.0] - [07/06/2022] #
-
Show menu button on automatic minimal display mode (#350)
-
BREAKING
Map<ShortcutActivator, Intent>?
is now the typed used onFluentApp.shortcuts
(#351) -
TextBox
review (#352):- Added
.initialValue
,.selectionControls
,.mouseCursor
,.textDirection
,.scribbleEnabled
and.enableIMEPersonalizedLearning
toTextBox
- Added
AutoFillClient
toTextBox
- Added
UnmanagedRestorationScope
toTextFormBox
- Added
-
Added
AutoSuggestBox.form
, that usesTextFormBox
instead ofTextBox
(#353) -
Do not overflow when text is too long on
Chip
(#322) -
Add RTL support for
Chip
-
Card
updates:- Updated card's background colors
- BREAKING Removed
Card.elevation
- Added
Card.margin
, which is the margin around the card
-
Updated
Combobox
andButton
designs -
Updated
NavigationPane
behaviour. Now, if the header is null, the space it should have taken will be removed from the pane (display mode affected: minimal, open only) (#359) -
Reviewed
DatePicker
andTimePicker
(#357)- Correctly apply dimensions and positions to both pickers
- Update the picker popup style and behavior
-
Colors Update (#368):
-
Added
ResourceDictionary
, which provides default colors to be used on components -
(forms) Updated
Combobox
style. It now usesAcrylic
on the combobox popup menu -
(buttons) Updated
Button
,FilledButton
,IconButton
andTextButton
styles -
(toggleable inputs) Updated
Checkbox
,Chip
,RadioButton
,RatingBar
,ToggleButton
andToggleSwitch
-
BREAKING Updated
Slider
:SliderThemeData.thumbColor
,SliderThemeData.activeColor
andSliderThemeData.inactiveColor
now are of typeButtonState<Color?>?
, which handles the button color on different states.SliderThemeData.disabledThumbColor
,SliderThemeData.disabledActiveColor
andSliderThemeData.disabledInactiveColor
were removed- Before:
SliderThemeData( thumbColor: Colors.green, ),
- Now:
SliderThemeData( // Apply Colors.green for all button states. Instead you can use ButtonState.resolveWith to use different values according to the current state thumbColor: ButtonState.all(Colors.green), ),
-
-
(navigation) Updated
NavigationView
,PaneItem
andScaffoldPage
- Updated
TabView
and its tabs styles. AFocusBorder
is now used to display the focus highlight of the tabs - All combinations of
BorderRadius
can now be used onFocusBorder
- Updated
-
(surfaces) Updated
Card
,ContentDialog
,InfoBar
,Expander
,Flyout
and `Divider``- Added
InfoBar.isIconVisible
- Added
-
(indicators) Updated
ProgressBar
,ProgressRing
andInfoBadge
-
(other) Added helper methods for
AccentColor
:AccentColor.defaultBrushFor
,AccentColor.secondaryBrushFor
andAccentColor.tertiaryBrushFor
-
Polish translation added
-
[3.11.1] - [30/04/2022] #
-
Reworked
DropDownButton
(#297):DropDownButton
now usesFlyout
andMenuFlyout
to display the menu- Added scrolling features and style to
MenuFlyout
MenuFlyout
content height is now properly calculated (Fixes #210)DropDownButtonItem
is deprecated.MenuFlyoutItem
should be used instead- Added
DropDownButton.buttonBuilder
, which is able to style the button as you wish.DropDownButton.buttonStyle
is now deprecated
DropDownButton( items: [...], // onOpen should be called to open the flyout. If onOpen is null, it means the button // should be disabled buttonBuilder: (context, onOpen) { return Button( ..., onPressed: onOpen, ); } )
-
TextButton
now usestextButtonStyle
instead ofoutlinedButtonStyle
-
Add
TextFormBox.decoration
(#312)
[3.11.0] - Menu Flyouts - [23/04/2022] #
- Implemented
MenuFlyout
(#266)- Implemented
FlyoutPosition
, which controls where the flyout will be opened according to the child. It can beabove
,below
orside
FlyoutOpenMode.longHover
, which makes possible to open the flyout when the user performs a long hover- Added
Flyout.onOpen
andFlyout.onClose
. Some convenience callbacks that are called when the flyout is opened or closed, respectively - Implement
PopupContentSizeInfo
, which provides the information about the content size - Implemented
MenuFlyoutItem
,MenuFlyoutSeparator
andMenuFlyoutSubItem
. They are used insideMenuFlyout
to render the menu items horizontalPositionDependentBox
is now globally available for use as a top function
- Implemented
- Implemented overflow popup on
NavigationView
for top mode (#277) InfoBadge
now is correctly positioned on top mode (#296)
[3.10.3] - [15/04/2022] #
- Do not use duplicated
Scrollbar
s (#279) - Allow custom height on
NavigationPane
header. (#260) - Allow to define the minimal tab width (#282)
- Allow applying custom leading Widget to NavigationPane (#288)
TextFormBox.expands
now works properly ([#291]](https://github.com/bdlukaa/fluent_ui/pull/291))- Focus on
TextBox
is no longer duplicated (#290)
[3.10.1] - [06/04/2022] #
[3.10.0] - Localization, Indicators, CommandBar and Flyouts - [02/04/2022] #
-
Improves
icons.dart
formatting and its generation (#215) -
Use correct color on
FilledButton
when disabled (209) -
Built-in support for new languages (#216):
- English
- Spanish (reviewed by @henry2man)
- French (reviewed by @WinXaito)
- Brazilian Portuguese (reviewed by @bdlukaa)
- Russian (reviewed by @raitonoberu)
- German (reviewed by @larsb24)
- Hindi (reviewed by @alexmercerind)
- Simplified Chinese (reviewed by @zacksleo)
-
Add
useInheritedMediaQuery
property toFluentApp
(#211) -
TreeView
updates (#255):- Optional vertical scrolling by setting
shrinkWrap
tofalse
- TreeViewItem now has a custom primary key (
value
field) - Added
onSelectionChanged
callback, called when the selection is changed
- Optional vertical scrolling by setting
-
Account for enabled on pressing states (#233)
-
Implement
CommandBar
(#232)- Add
DynamicOverflow
layout widget, for one-run horizontal or vertical layout with an overflow widget - Add
HorizontalScrollView
helper widget, with mouse wheel horizontal scrolling
- Add
-
Long
content
widget no longer overflow inContentDialog
(#242) -
Content state is no longer lost when the pane display mode is changed (#250)
-
BREAKING Update indicators (#248):
-
Added
InheritedNavigationView
-
Updated sticky indicator to match the latest Win 11 UI (#173)
-
BREAKING Renamed
NavigationPane.indicatorBuilder
toNavigationPane.indicator
-
BREAKING Indicators are no longer built with functions Before:
indicatorBuilder: ({ required BuildContext context, required NavigationPane pane, required Axis axis, required Widget child, }) { if (pane.selected == null) return child; assert(debugCheckHasFluentTheme(context)); final theme = NavigationPaneTheme.of(context); final left = theme.iconPadding?.left ?? theme.labelPadding?.left ?? 0; final right = theme.labelPadding?.right ?? theme.iconPadding?.right ?? 0; return StickyNavigationIndicator( index: pane.selected!, pane: pane, child: child, color: theme.highlightColor, curve: Curves.easeIn, axis: axis, topPadding: EdgeInsets.only(left: left, right: right), ); }
Now:
indicator: StickyNavigationIndicator( color: Colors.blue.lighter, // optional ),
-
-
initiallyExpanded
property onExpander
works properly (#252) -
BREAKING Flyout changes:
- Removed
Flyout.contentWidth
and addedFlyoutContent.constraints
. Now the content will be automatically sized and layed out according to the placement - Added
Flyout.placement
which takes aFlyoutPlacement
- Added
Flyout.openMode
which takes aFlyoutOpenMode
Flyout.controller
is no longer required. If not provided, a local controller is created to handle theFlyout.openMode
settings- Breaking
FlyoutController.open
is now a function - Added
FlyoutController.isOpen
,FlyoutController.isClosed
,FlyoutController.close()
,FlyoutController.open()
andFlyoutController.toggle()
- Breaking Removed
Popup.contentHeight
- Removed
-
BREAKING Updated typography (#261):
- Renamed
Typography.standart
toTypography.fromBrightness
- Renamed
Typography
constructor toTypography.raw
- Default color for dark mode is now
const Color(0xE4000000)
- Updated default font sizes for
display
,titleLarge
,title
andsubtitle
- Renamed
-
TabWidthBehavior.sizeToContent
now works properly (#218)
[3.9.1] - Input Update - [25/02/2022] #
TextBox
updates: (#179)- Correctly apply the
style
property - Correctly apply
decoration
to the background - Added
foregroundDecoration
andhighlightColor
property. They can not be specified at the same time - BREAKING replaced
maxLengthEnforeced
withmaxLengthEnforcement
- Correctly apply the
- Expose more propertied to
TextFormBox
AutoSuggestBox
updates:- Improved fidelity of the suggestions overlay expose more customization properties (#174)
- When a suggestion is picked, the overlay is automatically closed and the text box is unfocused
- Clear button now only shows when the text box is focused
- Add directionality support (#184)
- Correctly apply elevation for
DropDownButton
overlay (#182) - Show app bar even if
NavigationPane
is not provided onNavigationView
(#187) - Ensure
NavigationAppBar.actions
are rendered on the top of the other widgets (#177) - All Form widgets now have the same height by default
- Only show one scrollbar on
ComboBox
overlay - Fix opened pane opacity
- Added
menuColor
for theme, which is now used by dropdown button, auto suggest box, tooltip and content dialog - Added
Card
andcardColor
for theme - Update fluent text controls and added support for
SelectableText
(#196)
[3.9.0] - Fidelity - [10/02/2022] #
-
BREAKING Renamed
standartCurve
tostandardCurve
-
BREAKING Completly rework
DropDownButton
-
BREAKING Removed
CheckboxThemeData.thirdStateIcon
Currently, there isn't a fluent icon that is close to the native icon. A local widget
_ThirdStateDash
is used -
Do not override material
Theme
onFluentApp
(#155) -
Slider thumb now doesn't change inner size if hovered while disabled
-
Uniform foreground color on
Checkbox
-
Updated
FilledButton
Style -
ToggleButton
andFilledButton
now share the same style -
ScaffoldPage.scrollable
andScaffoldPage.withPadding
-
Ensure we use
Typography.body
as the default text style onBaseButton
(#120) -
Update
ButtonThemeData.uncheckedInputColor
[3.8.0] - Flutter Favorite - [03/02/2022] #
-
Tests (#142)
-
Added Material Theme to Fluent Theme Builder (#133)
-
NavigationView
updates BREAKING:- Properly add item key to
PaneItem
in top mode (#143) - Items bounds and positions are fetched when the item list is scrolled as well to prevent misalignment
- Added the helper functions
NavigationIndicator.end
andNavigationIndicator.sticky
- Use
Curves.easeIn
for sticky navigation indicator by default - Use the correct accent color for navigation indicators by default
EntrancePageTransition
is now the correct page transition used when display mode is top- Apply correct press effect for
PaneItem
when display mode is top - BREAKING Removed
NavigationPane.defaultNavigationIndicator
- BREAKING Replaced
offsets
andsizes
withpane
inNavigationPane
Before:
pane: NavigationPane( indicatorBuilder: ({ required BuildContext context, /// The navigation pane corresponding to this indicator required NavigationPane pane, /// Corresponds to the current display mode. If top, Axis.vertical /// is passed, otherwise Axis.vertical Axis? axis, /// Corresponds to the pane itself as a widget. The indicator is /// rendered over the whole pane. required Widget child, }) { if (pane.selected == null) return child; assert(debugCheckHasFluentTheme(context)); final theme = NavigationPaneThemeData.of(context); axis??= Axis.horizontal; return EndNavigationIndicator( index: pane.selected, offsets: () => pane.effectiveItems.getPaneItemsOffsets (pane.paneKey), sizes: pane.effectiveItems.getPaneItemsSizes, child: child, color: theme.highlightColor, curve: theme.animationCurve ?? Curves.linear, axis: axis, ); }, ),
Now:
pane: NavigationPane( indicatorBuilder: ({ required BuildContext context, /// The navigation pane corresponding to this indicator required NavigationPane pane, /// Corresponds to the current display mode. If top, Axis.vertical /// is passed, otherwise Axis.vertical required Axis axis, /// Corresponds to the pane itself as a widget. The indicator is /// rendered over the whole pane. required Widget child, }) { if (pane.selected == null) return child; assert(debugCheckHasFluentTheme(context)); final theme = NavigationPaneThemeData.of(context); return EndNavigationIndicator( index: pane.selected, pane: pane, child: child, color: theme.highlightColor, curve: theme.animationCurve ?? Curves.linear, axis: axis, ); }, ),
- Properly add item key to
[3.7.0] - Breaking changes - [21/01/2022] #
-
AutoSuggestBox: (#130)
-
It gets opened automatically when it gets focus
-
When an item is tapped, the cursor is positioned correctly at the end of the text
-
BREAKING Now it's not possible to assign a type to
AutoSuggestBox
: Before:AutoSuggestBox<String>(...),
Now:
AutoSuggestBox(...),
-
-
Added TextFormBox witch integrates with the Form widget. It has the ability to be validated and to show an error message.
-
New FluentIcons gallery showcase in example project (#123)
-
Updated FluentIcons as per 30/12/2021
-
BREAKING Renamed
FluentIcons.close
toFluentIcons.chrome_close
-
Fixed rounded corners on the ComboBox widget
-
Fixed missing padding before close button on
TabView
(#122) -
Readded tab minimal size for
equal
andsizeToContent
tab width behaviours (#122) -
TabView
's close button now usesSmallIconButton
-
If a tab is partially off the view, it's scrolled until it's visible
-
Fix
IconButton
's icon size -
Update
OutlinedButton
,FilledButton
andTextButton
styles -
Implement lazy tree view (#139)
[3.6.0] - TabView Update - [25/12/2021] #
- Implement
TreeView
(#120) - Fix
Tooltip.useMousePosition
- Fix
Slider
andRatingBar
(#116) - Fix scroll buttons when there are too many tabs in
TabView
(#92) - Fix button style on tab in
TabView
(#90) - Added Close on middle click on tabs in
TabView
(#91) - Added
newTabLabel
,closeTabLabel
,scrollTabBackward
,scrollTabForward
toFluentLocalizations
- Fix
TabView
's text when it's too long. Now it's clipped when overflow and line doesn't break - Added
TabView.closeButtonVisibility
. Defaults toCloseButtonVisibilityMode.always
- Updated selected tab paint
- Added
TabView.tabWidthBehavior
. Defaults toTabWidthBehavior.equal
- Added
TabView.header
andTabView.footer
Slider
's mouse cursor is now [MouseCursor.defer]- Added
SmallIconButton
, which makes an [IconButton] small if wrapped. It's used byTextBox
- Added
ButtonStyle.iconSize
- BREAKING
AutoSuggestBox
updates:- Added
FluentLocalizations.noResultsFoundLabel
. "No results found" is the default text - Removed
itemBuilder
,sorter
,noResultsFound
,textBoxBuilder
,defaultNoResultsFound
anddefaultTextBoxBuilder
- Added
onChanged
,trailingIcon
,clearButtonEnabled
andplaceholder
controller
is now nullable. If null, an internal controller is creted
- Added
[3.5.2] - [17/12/2021] #
- BREAKING Removed
ThemeData.inputMouseCursor
- BREAKING Removed
cursor
fromDatePicker
,TimePicker
,ButtonStyle
,CheckboxThemeData
,RadioButtonThemeData
,SliderThemeData
,ToggleSwitchThemeData
,NavigationPaneThemeData
- Scrollbar is not longer shown if
PaneDisplayMode
istop
- If open the compact pane, it's not always a overlay
- Added
triggerMode
andenableFeedback
toTooltip
. - Added
Tooltip.dismissAllToolTips
[3.5.1] - [15/12/2021] #
- Update inputs colors
Expander
now properly disposes its resources- Add the
borderRadius
andshape
attributes to theMica
widget - Implement
DropDownButton
(#85)
[3.5.0] - Flutter 2.8 - [09/12/2021] #
[3.4.1] - [08/11/2021] #
ContentDialog
constraints can now be customizable (#86)- Add possibility to disable acrylic by wrapping it in a
DisableAcrylic
(#89) - Fix
onReaorder null exception
(#88) - Implement
InfoBadge
- Implement
Expander
(#85) - Default
inputMouseCursor
is nowMouseCursor.defer
NavigationView.contentShape
is now rendered at the foreground
[3.4.0] - Flexibility - [22/10/2021] #
ProgressRing
now spins on the correct direction (#83)- Added the
backwards
property toProgressRing
FluentApp.builder
now works as expected (#84)- Implemented
NavigationPane.customPane
, which now gives you the ability to create custom panes forNavigationView
- BREAKING
sizes
,offsets
andindex
parameters fromNavigationIndicatorBuilder
were replaced bypane
[3.3.0] - [12/10/2021] #
[3.2.0] - Flutter 2.5.0 - [15/09/2021] #
- Added missing parameters in
_FluentTextSelectionControls
methods (#67) - Min Flutter version is now 2.5.0
- EXAMPLE APP Updated the url strategy on web.
- EXAMPLE APP Upgraded dependencies
- Format code according to flutter_lints
[3.1.0] - Texts and Fixes - [25/08/2021] #
- Updated Typography:
- BREAKING Renamed
header
->display
- BREAKING Renamed
subHeader
->titleLarge
- BREAKING Renamed
base
->bodyStrong
- Added
bodyLarge
- Updated font size and weight for most of the text styles
- BREAKING Renamed
- Update
SplitButton
design - Update
IconButton
design - Fixed
ToggleSwitch
not showing expanded thumb mode when dragging - BREAKING Remove
CheckboxListTile
,RadioListTile
andSwitchListTile
. Use the respective widget with thecontent
property
[3.0.0] - Windows 11 - [24/08/2021] #
- Update
ToggleButton
design. - Update
Button
design. - Update
RadioButton
design. - Update
ContentDialog
design. - Update
NavigationView
design:- BREAKING: Acryic is not used anymore. Consequently,
useAcrylic
method was removed.
- BREAKING: Acryic is not used anymore. Consequently,
- Implemented
Mica
, used by the newNavigationView
- Added support for horizontal tooltips. Set
Tooltip.displayHorizontally
to true to enable it. - Updated Acrylic to support the web
- Update
Checkbox
design - Update
ToggleSwitch
design - Update
Scrollbar
design - Update
Slider
design - Update
InfoBar
design - Update pickers design (
Combobox
,DatePicker
andTimePicker
)
[2.2.1] - [26/06/2021] #
[2.2.0] - BREAKING CHANGES - [25/06/2021] #
- BREAKING: Material
Icons
are not used anymore. UseFluentIcons
instead. - BREAKING: Reworked the
Acrylic
widget implementation (#47) - BREAKING: Removed the
useAcrylic
property fromNavigationView
. Acrylic is now used by default. PaneDisplayMode.compact
has now a width of 40, not 50.- Removed
SizeTransition
fromTabView
.
[2.1.1] - [03/06/2021] #
- Option to set a default font family on the theme data (
ThemeData.fontFamily
) indicatorBuilder
is correctly applied to the automatic display mode inNavigationView
- An overlay is open when the toggle button is pressed on the compact display mode (#43)
[2.1.0] - Mobile Update - [01/06/2021] #
- Implemented
BottomNavigation
- Implemented
BottomSheet
- Implemented
Chip
- Implemented
Snackbar
- Implemented
PillButtonBar
- New buttons variations:
FillButton
OutlinedButton
TextButton
PaneItem
s'build
method is now overridable. You can know customize how the items inNavigationView
should look like by overriding the method.- Fixed bug that navigation indicator was not showing on the first frame
- Fixed minimal tooltip not updating when closed the overlay
- EXAMPLE APP: Navigation indicator is now configurable on the
Settings
page
[2.0.3] - [28/05/2021] #
- Correctly apply items positions to pane indicators, regardless of external factors, such as navigation view app bar (#41)
- Improved
NavigationIndicator
s performance
[2.0.2] - [23/05/2021] #
-
BREAKING CHANGES: Reworked the theme api (#39):
-
Removed the theme extension (
context.theme
). UseFluentTheme.of(context)
instead -
ButtonState
is now a class that can receive a value. It now allows lerping between values, makingAnimatedFluentTheme
possible.Here's an example of how to migrate your code:
Before:
cursor: (_) => SystemMouseCursors.click,
Now:cursor: ButtonState.all(SystemMouseCursors.click),
-
All theme datas and
AccentColor
have now a lerp method, in order to makeAnimatedFluentTheme
possible. -
Implemented
AnimatedFluentTheme
, in order to replaceAnimateContainer
s all around the library -
Dedicated theme for each theme data (#37):
- IconTheme
- ButtonTheme
- RadioButtonTheme
- CheckboxTheme
- FocusTheme
- SplitButtonTheme
- ToggleButtonTheme
- ToggleSwitchTheme
- NavigationPaneTheme
- InfoBarTheme
- TooltipTheme
- DividerTheme
- ScrollbarTheme
-
DividerThemeData
now hasverticalMargin
andhorizontalMargin
instead of an axis callback. -
Updated button colors.
-
Removed
animationDuration
andanimationCurve
from theme datas (except fromNavigationPaneThemeData
). -
Renamed
copyWith
tomerge
on theme datas (except fromThemeData
) -
Fixed typo
standart
->standard
-
Implement
AnimatedAcrylic
-
[2.0.1] - [21/05/2021] #
- Minimal flutter version is now 2.2
- Implement
FluentScrollBehavior
, that automatically adds a scrollbar into listviews (#35) - Reworked the inputs api (#38):
- A input can have multiple states. Now, if the widget is focused and pressed at the same time, it doesn't lose its focused border.
- Now, the focus is not requested twice when the button is pressed, only once. This fixes a bug introduced in a previous version that combo boxes items we're not being focused.
- Semantics (acessibility) is now applied on all inputs
[2.0.0] - [20/05/2021] #
- New way to disable the acrylic blur effect. Just wrap the acrylic widget in a
NoAcrylicBlurEffect
to have it disabled. - Reworked the Navigation Panel from scratch (#31):
- The legacy
NavigationPanel
andScaffold
were removed. UseNavigationView
andScaffoldPage
instead - Implemented open, compact, top and minimal display modes.
- Custom Selected Indicators
- The legacy
- Implemented fluent localizations (#30)
[1.10.1] - [05/05/2021] #
- FIX Reworked the combo box widget to improve fidelity. (#25)
- FIX Improved
HoverButton
focus management. - FIX Reworked the tooltip widget. Now, if any mouse is connected, the tooltip is displaying according to the pointer position, not to the child's. (#26)
- FIX TabView is now scrollable if the size of the tabs overflow the width
[1.10.0] - #
- BREAKING
InfoHeader
was renamed toInfoLabel
. You can now set if the label will be rendered above the child or on the side of it. - FIX Fixed
RadioButton
inner color overlaping the border. - NEW
ThemeData.inputMouseCursor
- FIDELITY Switch thumb is now draggable. (Fixes #22)
- EXAMPLE Reworked the example app inputs page
[1.9.4] - [02/05/2021] #
- FIX
CheckboxListTile
,SwitchListTile
andRadioListTile
now doesn't focus its leading widget. - FIX
TabView
is now not scrollable - FIX Fixed
Acrylic
blur effect being disabled by default. - FIDELITY Improved
ContentDialog
transition fidelity - FIX Fixed
FocusBorder
for some widgets. It was affecting layout when it shouldn't - FIX
RatingBar
andSlider
weren't working due toFocusBorder
- NEW | FIDELITY New
Slider
thumb
[1.9.3] - [01/05/2021] #
- NEW
FocusBorder.renderOutside
. With this property, you can control if the FocusBorder will be rendered over the widget or outside of it. - FIX Fixed
RadioButton
s border when focused - FIX
Color.resolve
now doesn't throw a stack overflow error. - BREAKING Removed
Color.resolveFromBrightness
. This is only available onAccentColor
- EXAMPLE APP Hability to change the app accent color
- NEW
darkest
andlightest
colors variants inAccentColor
- FIX Fixed
InfoBar
's error icon. It now usesIcons.cancel_outlined
instead ofIcons.close
- NEW
NavigationPanel
now has aScrollbar
and thebottom
property is now properly styled if selected
[1.9.2] - [30/04/2021] #
- FIX
TabView
tabs can now be reordered (Fixes #10) - FIDELITY If a new
Tab
is added, its now animated - FIX
FocusBorder
now doesn't change the size of the widgets - BREAKING
buttonCursor
,uncheckedInputColor
andcheckedInputColor
are now moved toButtonThemeData
as static functions.
[1.9.1] - [29/04/2021] #
- FIX Fixed diagnostic tree. (Fixes #17)
- FIX | FIDELITY
TappableListTile
now changes its color when focused instead of having a border - FIDELITY Improved
Acrylic
's blur effect fidelity - FIX
Acrylic
's elevation was being applying margin - NEW
ThemeData.shadowColor
, which is now used byAcrylic
- NEW You can now globally disable the acrylic blur effect by changing
Acrylic.acrylicEnabled
[1.9.0] - #
The whole theme implementation was reworked on this change.
- BREAKING Renamed
Theme
toFluentTheme
- BREAKING All the properties in
FluentTheme
now can't be null - BREAKING Renamed all the
Style
occurrences toThemeData
- BREAKING
ThemeData.accentColor
is now anAccentColor
- FIX When providing a custom style to a tooltip, it's now correctly applied to
ThemeData.tooltipStyle
- FIX
debugCheckHasFluentTheme
has now a better error message - FIX
FluentApp
now doesn't throw an error if notheme
is provided - FIX Reworked
Scrollbar
to improve fidelity. - NEW Color extension methods:
Color.toAccentColor
andColor.basedOnLuminance
- NEW
Button.builder
[1.8.1] - [16/04/2021] #
- NEW In
TabView
, it's now possible use the following shortcuts ifTabView.shortcutsEnabled
istrue
(Follows this):Ctrl + F4
orCtrl + W
to close the current tabCtrl + T
to create a new tab1-8
to navigate to a tab with the pressed number9
to navigate to the last tab and navigate to the last tab
- NEW
IconButton.autofocus
,ToggleButton.autofocus
- BREAKING Renamed all the
semanticsLabel
tosemanticLabel
[1.8.0] - Color Update - [14/04/2021] #
- NEW Web version hosted at https://bdlukaa.github.io/fluent_ui
- NEW Colors showcase page in example app
- NEW Info Colors:
Colors.warningPrimaryColor
Colors.warningSecondaryColor
Colors.errorPrimaryColor
Colors.errorSecondaryColor
Colors.successPrimaryColor
Colors.successSecondaryColor
- FIX Reworked all the accent colors (
Colors.accentColors
) withdarkest
,dark
,normal
,light
andlighter
- BREAKING
Colors.blue
is now anAccentColor
[1.7.6] - [13/04/2021] #
- NEW
Checkbox.autofocus
- BREAKING
Button
refactor:- Removed
Button.icon
andButton.trailingIcon
- Renamed
Button.text
toButton.child
- Removed
- You can now disable the acrylic backdrop effect by setting
enabled
to false - NEW
NavigationPanelBody.animationCurve
andNavigationPanelBody.animationDuration
[1.7.5] - [13/04/2021] #
- NEW
Scrollbar
andScrollbarStyle
- Reworked
FluentApp
to not depend of material anymore.
[1.7.4] - [10/04/2021] #
- FIX Updated
Icon
widget to use Flutter's default icon widget - NEW Documentation
[1.7.3] - [07/04/2021] #
- FIX Improved
ListTile
sizing (#Spacing) - NEW
FocusStyle
and support for glow focus - NEW
RatingBar.starSpacing
[1.7.2] - [06/04/2021] #
- FIX Animation when using
NavigationPanelBody
now works as expected - NEW
CheckboxListTile
,SwitchListTile
andRadioListTile
- FIX It's now not possible to focus a disabled
TextBox
[1.7.1] - [06/04/2021] #
- FIX The mouse cursor in a disabled input is now
basic
instead offorbidden
- FIX
NavigationPanelBody
now doesn't use aIndexedStack
under the hood because it was interfering in the focus scope - FIX The color of the focus now is the
Style.inactiveColor
- FIX
RadioButton
's cursor was not being applied correctly - NEW
Button.toggle
- FIX The state provided by
HoverButton
was beingfocused
when it shouldn't be - FIX TimePicker showing wrong minute count. It should start from 00 and end in 59
- NEW
TimePicker.minuteIncrement
[1.7.0] - Focus Update - [05/04/2021] #
- FIXED Fixed the possibility to give a elevation lower than 0 in
Acrylic
- NEW It's now possible to change the rating of
RatingBar
using the keyboard arrows - NEW Now it's possible to navigate using the keyboard with all focusable widgets
[1.6.0] - BREAKING CHANGES - [03/04/2021] #
-
Added the missing
Diagnostics
-
Updated all the screenshots
-
BREAKING CHANGE Uses the material icon library now
DEVELOPER NOTE This was a hard choice, but the material icon library is a robust, bigger library. It contains all the icons the previous library has, and a few many more.
[1.5.0] - [02/04/2021] #
-
Added
Diagnostics
to many widgets -
NEW
AutoSuggestBox
(Follows this) -
NEW
Flyout
andFlyoutContent
(Folllows this) -
FIXED Popup was being shown off-screen.
DEVELOPER NOTE The solution for this was to make it act like a tooltip: only show the popup above or under the
child
. This was a hard choice, but the only viable option that would work on small screens/devices. This also madeFlyout
easier to implement. This should be changed when multi-window support is available. -
FIXED
DatePicker
incorrectly changing hour -
NEW
Colors.accentColors
-
Documentation about system_theme
-
BREAKING Removed
Pivot
because it's deprecated
[1.4.1] - Pickers Update - [30/03/2021] #
[1.4.0] - [28/03/2021] #
- NEW
InfoHeader
- NEW
ComboBox
(Follows this) - NEW
TappableListTile
- BREAKING Removed
DropdownButton
andButton.dropdown
[1.3.4] - [28/03/2021] #
- NEW Vertical Slider
[1.3.3] - [25/03/2021] #
- NEW Indeterminate
ProgressRing
(@raitonoberu) - NEW
ListTile
- DIAGNOSTICS Provide
Diagnostics
support to:Style
NavigationPanelStyle
TooltipStyle
[1.3.2] - Accessibility update - [24/03/2021] #
This version provides the fix for #5
Theme.of
can't be null anymore. UseTheme.maybeOf
for such- NEW
Style.inactiveBackgroundColor
- BREAKING Replaced
color
,border
,borderRadius
fromIconButtonStyle
todecoration
- DIAGNOSTICS Provide
Diagnostics
support to the following classes:- ButtonStyle
- Checkbox
- CheckboxStyle
- IconButtonStyle
- RadioButtonStyle
- RatingBar
- SplitButtonStyle
- ToggleButton
- ToggleButtonStyle
- ToggleSwitch
- ToggleSwitchStyle
- Slider
- SliderStyle
- Typography
- Divider
- DividerStyle
- Provide accessibility support to the following widgets:
- Button
- Checkbox
- IconButton
- RadioButton
- RatingBar
- Slider
- ToggleButton
- ToggleSwitch
- TabView
[1.3.1] - [23/03/2021] #
- FIX
IconButtonStyle
'siconStyle
now works properly - Improved
TabView
icon styling - NEW Indeterminate
ProgressBar
(@raitonoberu)
[1.2.5] - [21/03/2021] #
- FIX Fixed
InfoBar
's overflow
[1.2.4] - [21/03/2021] #
- BREAKING
RadioButton
'sselected
property was renamed tochecked
to match a single pattern between all the other widgets.
[1.2.3] - [19/03/2021] #
- NEW | EXAMPLE APP
Settings
screen - Improved theme changing
- FIX
FluentApp
doesn't lose its state anymore, possibiliting hot relaod. - NEW
showDialog
rework:showDialog
now can return data. (Fixes #2)showDialog.transitionBuilder
showDialog.useRootNavigator
showDialog.routeSettings
- It's no longer necessary to have the fluent theme to display dialogs using this function.
[1.2.2] - [17/03/2021] #
- BREAKING Removed
_regular
from the name of the icons. - NEW
InfoBar
(Follows this)
[1.2.1] - [16/03/2021] #
- NEW
Divider
[1.2.0] - Timing and easing - Page transitioning - [15/03/2021] #
- FIDELITY Improved
ToggleButton
fidelity - NEW
NavigationPanelBody
- NEW Page transitions
EntrancePageTransition
(#PageRefresh)DrillInPageTransition
(#Drill)HorizontalSlidePageTransition
(#HorizontalSlide)SuppressPageTransition
(#Supress)
- Add timing and easing to style. (Follows this)
- NEW
Style.fastAnimationDuration
(Defaults to 150ms) - NEW
Style.mediumAnimationDuration
(Defaults to 300ms) - NEW
Style.slowAnimationDuration
(Defaults to 500ms) - Default
animationCurve
is nowCurves.easeInOut
(standard) instead ofCurves.linear
- BREAKING Removed
Style.animationDuration
- NEW
- Refactored Navigation Panel
[1.1.0] - Fidelity update - [14/03/2021] #
[1.0.2] - Typography update - [11/03/2021] #
- NEW Typography
- Migrated all the widgets to use typography
- NEW Tooltip
- NEW Dark theme
- FIX Disabled button press effect if disabled
- FIX Grey color resulting in green color
[1.0.1+1] - [09/03/2021] #
- NEW Screenshots
[1.0.1] - [07/03/2021] #
- FIX
NavigationPanel
navigation index - FIX
Slider
's inactive color - FIDELITY Scale animation of button press
- FIDELITY Improved
Slider
label fidelity - NEW Split Button
[1.0.0] - [05/03/2021] #
- NEW Null-safety
- NEW New Icons Library
- NEW
NavigationPanelSectionHeader
andNavigationPanelTileSeparator
- BREAKING Removed
Snackbar
[0.0.9] - [03/03/2021] #
- Export the icons library
- NEW
TextBox
[0.0.8] - [01/03/2021] #
- NEW
ContentDialog
🎉 - NEW
RatingControl
🎉 - NEW
NavigationPanel
🎉 - Improved
Button
fidelity
[0.0.7] - [28/02/2021] #
- NEW
Slider
🎉 - Use physical model for elevation instead of box shadows
- Improved TODO
[0.0.6] - [27/02/2021] #
- FIXED Button now detect pressing
- FIXED
ToggleSwitch
default thumb is now animated - FIXED Improved
ToggleSwitch
fidelity FIXED Darker color for button press. - NEW THEMING
Style.activeColor
Style.inactiveColor
Style.disabledColor
Style.animationDuration
Style.animationCurve
[0.0.5] - [27/02/2021] #
[0.0.4] - [22/02/2021] #
- New fluent icons library: fluentui_icons
- Re-made checkbox with more fidelity
- Refactored the following widgets to follow the theme accent color:
Checkbox
ToggleSwitch
RadioButton
- Added accent colors to widget. Use this as a base
[0.0.3] - Theming update - [21/02/2021] #
- HIGHLIGHT A whole new documentation
- Scaffold now works as expected.
- Improved theming checking
- NEW
null
(thirdstate) design onCheckbox
. (Follows this)- Now you can use the
Decoration
to style the inputs
- BREAKING:
- Removed
Button.action
- Removed
Button.compound
- Removed
Button.primary
- Removed
Button.contextual
- Removed
AppBar
- Now the default theme uses accent color instead of a predefined color (Follows this)
- Removed
- FIXED:
ToggleSwitch
can NOT receive null values
[0.0.2] - [18/02/2021] #
- The whole library was rewritten following this
- Tooltip's background color is now opaque (Follows this)
- Dropdown button now works as expected
- FIXED:
- Snackbar now is dismissed even if pressing or hovering
- Margin is no longer used as part of the clickable button
- BREAKING:
- Renamed
Toggle
toToggleSwitch
(Follows this) - Removed
BottomNavigationBar
. It's recommended to use top navigation (pivots) - Removed
IconButton.menu
- Renamed
- NEW:
[0.0.1] #
- Initial release