import 'package:flutter/material.dart';
import 'package:flutter_expandable_fab/flutter_expandable_fab.dart';
void main() {
runApp(const MyApp());
}
final scaffoldKey = GlobalKey<ScaffoldMessengerState>();
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(useMaterial3: true, colorSchemeSeed: Colors.blue),
scaffoldMessengerKey: scaffoldKey,
home: const FirstPage(),
);
}
}
class CounterWidget extends StatelessWidget {
final _counter = ValueNotifier(0);
CounterWidget({super.key});
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text('You have pushed the button this many times:'),
ValueListenableBuilder(
valueListenable: _counter,
builder: (context, counter, _) {
return Text(
'$counter',
style: Theme.of(context).textTheme.displayMedium,
);
},
),
ElevatedButton.icon(
icon: const Icon(Icons.add),
label: const Text('add'),
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
behavior: SnackBarBehavior.floating,
content: Text("HELLO WORLD"),
),
);
_counter.value++;
},
),
],
),
);
}
}
class FirstPage extends StatefulWidget {
const FirstPage({Key? key}) : super(key: key);
@override
State<FirstPage> createState() => _FirstPageState();
}
class _FirstPageState extends State<FirstPage> {
final _key = GlobalKey<ExpandableFabState>();
@override
Widget build(BuildContext context) {
return Scaffold(
body: CounterWidget(),
floatingActionButtonLocation: ExpandableFab.location,
floatingActionButton: ExpandableFab(
key: _key,
// margin: const EdgeInsets.all(100),
// duration: const Duration(milliseconds: 500),
// distance: 200.0,
// type: ExpandableFabType.up,
// pos: ExpandableFabPos.left,
// childrenOffset: const Offset(0, 20),
// childrenAnimation: ExpandableFabAnimation.none,
// fanAngle: 40,
// openButtonBuilder: RotateFloatingActionButtonBuilder(
// child: const Icon(Icons.abc),
// fabSize: ExpandableFabSize.large,
// foregroundColor: Colors.amber,
// backgroundColor: Colors.green,
// shape: const CircleBorder(),
// angle: 3.14 * 2,
// elevation: 5,
// ),
// closeButtonBuilder: FloatingActionButtonBuilder(
// size: 56,
// builder: (BuildContext context, void Function()? onPressed,
// Animation<double> progress) {
// return IconButton(
// onPressed: onPressed,
// icon: const Icon(
// Icons.check_circle_outline,
// size: 40,
// ),
// );
// },
// ),
overlayStyle: ExpandableFabOverlayStyle(
color: Colors.black.withValues(alpha: 0.5),
blur: 5,
),
onOpen: () {
debugPrint('onOpen');
},
afterOpen: () {
debugPrint('afterOpen');
},
onClose: () {
debugPrint('onClose');
},
afterClose: () {
debugPrint('afterClose');
},
children: [
FloatingActionButton.small(
// shape: const CircleBorder(),
heroTag: null,
child: const Icon(Icons.edit),
onPressed: () {
const SnackBar snackBar = SnackBar(content: Text("SnackBar"));
scaffoldKey.currentState?.showSnackBar(snackBar);
},
),
FloatingActionButton.small(
// shape: const CircleBorder(),
heroTag: null,
child: const Icon(Icons.search),
onPressed: () {
Navigator.of(context).push(
MaterialPageRoute(builder: ((context) => const NextPage())),
);
},
),
FloatingActionButton.small(
// shape: const CircleBorder(),
heroTag: null,
child: const Icon(Icons.share),
onPressed: () {
final state = _key.currentState;
if (state != null) {
debugPrint('isOpen:${state.isOpen}');
state.toggle();
}
},
),
],
),
);
}
}
class NextPage extends StatelessWidget {
const NextPage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('next')),
body: const Center(child: Text('next')),
);
}
}
Restarted application in 279ms.
════════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during performLayout():
Floating SnackBar presented off screen.
A SnackBar with behavior property set to SnackBarBehavior.floating is fully or partially off screen because some or all the widgets provided to Scaffold.floatingActionButton, Scaffold.persistentFooterButtons and Scaffold.bottomNavigationBar take up too much vertical space.
Consider constraining the size of these widgets to allow room for the SnackBar to be visible.
The relevant error-causing widget was:
Scaffold Scaffold:file:///Users/laeeqfaiz/Desktop/Practice/Github%20tickets/fab_snackbar_issue/lib/main.dart:76:12
When the exception was thrown, this was the stack:
#0 _ScaffoldLayout.performLayout.<anonymous closure> (package:flutter/src/material/scaffold.dart:1263:13)
#1 _ScaffoldLayout.performLayout (package:flutter/src/material/scaffold.dart:1278:8)
#2 MultiChildLayoutDelegate._callPerformLayout (package:flutter/src/rendering/custom_layout.dart:249:7)
#3 RenderCustomMultiChildLayoutBox.performLayout (package:flutter/src/rendering/custom_layout.dart:419:14)
#4 RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:2614:7)
#5 PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:1160:18)
#6 PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:1173:15)
#7 RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:629:23)
#8 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:1242:13)
#9 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:495:5)
#10 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1438:15)
#11 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1351:9)
#12 SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:1204:5)
#13 _invoke (dart:ui/hooks.dart:331:13)
#14 PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:444:5)
#15 _drawFrame (dart:ui/hooks.dart:303:31)
The following RenderObject was being processed when the exception was fired: RenderCustomMultiChildLayoutBox#402c1 NEEDS-LAYOUT NEEDS-PAINT
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, h=956.0)
size: Size(440.0, 956.0)
child 1: RenderPositionedBox#9fa31 relayoutBoundary=up1 NEEDS-PAINT
parentData: offset=Offset(0.0, 0.0); id=_ScaffoldSlot.body (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(440.0, 956.0)
alignment: Alignment.center
textDirection: ltr
widthFactor: expand
heightFactor: expand
child: RenderFlex#ad90a relayoutBoundary=up2 NEEDS-PAINT
parentData: offset=Offset(66.5, 0.0) (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(307.0, 956.0)
direction: vertical
mainAxisAlignment: center
mainAxisSize: max
crossAxisAlignment: center
verticalDirection: down
spacing: 0.0
child 1: RenderParagraph#77892 relayoutBoundary=up3
parentData: offset=Offset(0.0, 418.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
semantics node: SemanticsNode#4
Rect.fromLTRB(66.5, 418.0, 373.5, 438.0)
label: "You have pushed the button this many times:"
textDirection: ltr
size: Size(307.0, 20.0)
textAlign: start
textDirection: ltr
softWrap: wrapping at box width
overflow: clip
locale: en_US
maxLines: unlimited
text: TextSpan
debugLabel: (englishLike bodyMedium 2021).merge((blackCupertino bodyMedium).apply)
inherit: false
color: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB)
family: CupertinoSystemText
size: 14.0
weight: 400
letterSpacing: 0.3
baseline: alphabetic
height: 1.4x
leadingDistribution: even
decoration: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB) TextDecoration.none
"You have pushed the button this many times:"
child 2: RenderParagraph#009c2 relayoutBoundary=up3
parentData: offset=Offset(143.5, 438.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
semantics node: SemanticsNode#5
Rect.fromLTRB(210.0, 438.0, 230.0, 490.0)
label: "1"
textDirection: ltr
size: Size(20.0, 52.0)
textAlign: start
textDirection: ltr
softWrap: wrapping at box width
overflow: clip
locale: en_US
maxLines: unlimited
text: TextSpan
debugLabel: (englishLike displayMedium 2021).merge((blackCupertino displayMedium).apply)
inherit: false
color: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB)
family: CupertinoSystemDisplay
size: 45.0
weight: 400
letterSpacing: 0.0
baseline: alphabetic
height: 1.2x
leadingDistribution: even
decoration: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB) TextDecoration.none
"1"
child 3: RenderSemanticsAnnotations#70ee8 relayoutBoundary=up3 NEEDS-PAINT
parentData: offset=Offset(107.6, 490.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
semantics node: SemanticsNode#6
Rect.fromLTRB(174.1, 490.0, 265.9, 538.0)
actions: tap
flags: isButton, hasEnabledState, isEnabled, isFocusable
label: "add"
textDirection: ltr
thickness: 1.0
semantic boundary
size: Size(91.8, 48.0)
child: _RenderInputPadding#fe1bc relayoutBoundary=up4 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
size: Size(91.8, 48.0)
child 2: RenderConstrainedBox#ab617 relayoutBoundary=up1 NEEDS-PAINT
parentData: offset=Offset(0.0, -1.9); id=_ScaffoldSlot.snackBar (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
additionalConstraints: BoxConstraints(unconstrained)
child: RenderOffstage#50221 relayoutBoundary=up2 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
offstage: false
child: RenderClipRect#65c63 relayoutBoundary=up3 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
child: RenderAnimatedOpacity#53824 relayoutBoundary=up4 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
opacity: AnimationController#ceee8(▶ 0.200; for SnackBar)➩Interval(0.4⋯0.6)➩Cubic(0.60, 0.04, 0.98, 0.34)
child 3: RenderStack#a769d relayoutBoundary=up1
needs compositing
parentData: offset=Offset(0.0, -0.0); id=_ScaffoldSlot.floatingActionButton (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(440.0, 956.0)
alignment: Alignment.centerRight
textDirection: ltr
fit: loose
child 1: RenderTransform#87574 relayoutBoundary=up2
needs compositing
parentData: not positioned; offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(440.0, 956.0)
transform matrix: [0] 1.0,0.0,0.0,0.0
[1] 0.0,1.0,0.0,0.0
[2] 0.0,0.0,1.0,0.0
[3] 0.0,0.0,0.0,1.0
origin: null
alignment: Alignment.center
textDirection: ltr
transformHitTests: true
child: RenderTransform#95dab relayoutBoundary=up3
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
layer: TransformLayer#05525
engine layer: TransformEngineLayer#7e11a
handles: 2
offset: Offset(0.0, 0.0)
transform: [0] 1.0,0.0,0.0,-0.0
[1] -0.0,1.0,0.0,0.0
[2] 0.0,0.0,1.0,0.0
[3] 0.0,0.0,0.0,1.0
size: Size(440.0, 956.0)
transform matrix: [0] 1.0,0.0,0.0,0.0
[1] -0.0,1.0,0.0,0.0
[2] 0.0,0.0,1.0,0.0
[3] 0.0,0.0,0.0,1.0
origin: null
alignment: Alignment.center
textDirection: ltr
transformHitTests: true
child: RenderOpacity#2318a relayoutBoundary=up4
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
layer: OpacityLayer#38368
engine layer: OffsetEngineLayer#1507b
handles: 2
offset: Offset(0.0, 0.0)
alpha: 255
size: Size(440.0, 956.0)
opacity: 1.0
child 4: RenderPointerListener#5922f
parentData: offset=Offset(0.0, 0.0); id=_ScaffoldSlot.statusBar (can use size)
constraints: BoxConstraints(w=440.0, h=62.0)
size: Size(440.0, 62.0)
behavior: opaque
listeners: down, panZoomStart
RenderObject: RenderCustomMultiChildLayoutBox#402c1 NEEDS-LAYOUT NEEDS-PAINT
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, h=956.0)
size: Size(440.0, 956.0)
child 1: RenderPositionedBox#9fa31 relayoutBoundary=up1 NEEDS-PAINT
parentData: offset=Offset(0.0, 0.0); id=_ScaffoldSlot.body (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(440.0, 956.0)
alignment: Alignment.center
textDirection: ltr
widthFactor: expand
heightFactor: expand
child: RenderFlex#ad90a relayoutBoundary=up2 NEEDS-PAINT
parentData: offset=Offset(66.5, 0.0) (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(307.0, 956.0)
direction: vertical
mainAxisAlignment: center
mainAxisSize: max
crossAxisAlignment: center
verticalDirection: down
spacing: 0.0
child 1: RenderParagraph#77892 relayoutBoundary=up3
parentData: offset=Offset(0.0, 418.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
semantics node: SemanticsNode#4
Rect.fromLTRB(66.5, 418.0, 373.5, 438.0)
label: "You have pushed the button this many times:"
textDirection: ltr
size: Size(307.0, 20.0)
textAlign: start
textDirection: ltr
softWrap: wrapping at box width
overflow: clip
locale: en_US
maxLines: unlimited
text: TextSpan
debugLabel: (englishLike bodyMedium 2021).merge((blackCupertino bodyMedium).apply)
inherit: false
color: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB)
family: CupertinoSystemText
size: 14.0
weight: 400
letterSpacing: 0.3
baseline: alphabetic
height: 1.4x
leadingDistribution: even
decoration: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB) TextDecoration.none
"You have pushed the button this many times:"
child 2: RenderParagraph#009c2 relayoutBoundary=up3
parentData: offset=Offset(143.5, 438.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
semantics node: SemanticsNode#5
Rect.fromLTRB(210.0, 438.0, 230.0, 490.0)
label: "1"
textDirection: ltr
size: Size(20.0, 52.0)
textAlign: start
textDirection: ltr
softWrap: wrapping at box width
overflow: clip
locale: en_US
maxLines: unlimited
text: TextSpan
debugLabel: (englishLike displayMedium 2021).merge((blackCupertino displayMedium).apply)
inherit: false
color: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB)
family: CupertinoSystemDisplay
size: 45.0
weight: 400
letterSpacing: 0.0
baseline: alphabetic
height: 1.2x
leadingDistribution: even
decoration: Color(alpha: 1.0000, red: 0.0980, green: 0.1098, blue: 0.1255, colorSpace: ColorSpace.sRGB) TextDecoration.none
"1"
child 3: RenderSemanticsAnnotations#70ee8 relayoutBoundary=up3 NEEDS-PAINT
parentData: offset=Offset(107.6, 490.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
semantics node: SemanticsNode#6
Rect.fromLTRB(174.1, 490.0, 265.9, 538.0)
actions: tap
flags: isButton, hasEnabledState, isEnabled, isFocusable
label: "add"
textDirection: ltr
thickness: 1.0
semantic boundary
size: Size(91.8, 48.0)
child: _RenderInputPadding#fe1bc relayoutBoundary=up4 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=Infinity)
size: Size(91.8, 48.0)
child 2: RenderConstrainedBox#ab617 relayoutBoundary=up1 NEEDS-PAINT
parentData: offset=Offset(0.0, -1.9); id=_ScaffoldSlot.snackBar (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
additionalConstraints: BoxConstraints(unconstrained)
child: RenderOffstage#50221 relayoutBoundary=up2 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
offstage: false
child: RenderClipRect#65c63 relayoutBoundary=up3 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
child: RenderAnimatedOpacity#53824 relayoutBoundary=up4 NEEDS-PAINT
parentData: <none> (can use size)
constraints: BoxConstraints(w=440.0, 0.0<=h<=956.0)
size: Size(440.0, 1.9)
opacity: AnimationController#ceee8(▶ 0.200; for SnackBar)➩Interval(0.4⋯0.6)➩Cubic(0.60, 0.04, 0.98, 0.34)
child 3: RenderStack#a769d relayoutBoundary=up1
needs compositing
parentData: offset=Offset(0.0, -0.0); id=_ScaffoldSlot.floatingActionButton (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(440.0, 956.0)
alignment: Alignment.centerRight
textDirection: ltr
fit: loose
child 1: RenderTransform#87574 relayoutBoundary=up2
needs compositing
parentData: not positioned; offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
size: Size(440.0, 956.0)
transform matrix: [0] 1.0,0.0,0.0,0.0
[1] 0.0,1.0,0.0,0.0
[2] 0.0,0.0,1.0,0.0
[3] 0.0,0.0,0.0,1.0
origin: null
alignment: Alignment.center
textDirection: ltr
transformHitTests: true
child: RenderTransform#95dab relayoutBoundary=up3
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
layer: TransformLayer#05525
engine layer: TransformEngineLayer#7e11a
handles: 2
offset: Offset(0.0, 0.0)
transform: [0] 1.0,0.0,0.0,-0.0
[1] -0.0,1.0,0.0,0.0
[2] 0.0,0.0,1.0,0.0
[3] 0.0,0.0,0.0,1.0
size: Size(440.0, 956.0)
transform matrix: [0] 1.0,0.0,0.0,0.0
[1] -0.0,1.0,0.0,0.0
[2] 0.0,0.0,1.0,0.0
[3] 0.0,0.0,0.0,1.0
origin: null
alignment: Alignment.center
textDirection: ltr
transformHitTests: true
child: RenderOpacity#2318a relayoutBoundary=up4
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=440.0, 0.0<=h<=956.0)
layer: OpacityLayer#38368
engine layer: OffsetEngineLayer#1507b
handles: 2
offset: Offset(0.0, 0.0)
alpha: 255
size: Size(440.0, 956.0)
opacity: 1.0
child 4: RenderPointerListener#5922f
parentData: offset=Offset(0.0, 0.0); id=_ScaffoldSlot.statusBar (can use size)
constraints: BoxConstraints(w=440.0, h=62.0)
size: Size(440.0, 62.0)
behavior: opaque
listeners: down, panZoomStart
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Floating SnackBar presented off screen.
The relevant error-causing widget was:
Scaffold Scaffold:file:///Users/laeeqfaiz/Desktop/Practice/Github%20tickets/fab_snackbar_issue/lib/main.dart:76:12
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Floating SnackBar presented off screen.
The relevant error-causing widget was:
Scaffold Scaffold:file:///Users/laeeqfaiz/Desktop/Practice/Github%20tickets/fab_snackbar_issue/lib/main.dart:76:12
════════════════════════════════════════════════════════════════════════════════
Can we safely use floating snackbar with this package?
causes following error