How to have same page destination between multiple buttons using hero - dart

I am trying to make a flutter app. Recently, I have learned how to use hero with two different buttons which all have the same destination. So, I tried to use hero with infinitely creatable containers. This is what I came up with:
import 'package:flutter/material.dart';
void main() => runApp(MainPage());
class MainPage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.white,
body: Column(children: <Widget>[
Body(),
])));
}
}
class Body extends StatefulWidget {
#override
_BodyState createState() => _BodyState();
}
class _BodyState extends State<Body> {
final String open1 = 'open';
int count = 1;
#override
Widget build(BuildContext context) {
print(count);
List cards = List.generate(count, (int i) => RCard(count));
return Expanded(
child: Container(
child: NotificationListener<OverscrollIndicatorNotification>(
onNotification: (OverscrollIndicatorNotification overscroll) {
overscroll.disallowGlow();
},
child: PageView.builder(
reverse: true,
pageSnapping: false,
controller: PageController(viewportFraction: 0.85),
itemCount: count,
itemBuilder: (context, i) {
if (i == 0) {
return GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Page(
open: open1,
)),
);
count++;
},
child: Hero(
tag: open1,
child: Padding(
padding: EdgeInsets.only(
left:
MediaQuery.of(context).size.height *
0.015,
right:
MediaQuery.of(context).size.height *
0.015,
top: MediaQuery.of(context).size.width *
0.08,
bottom:
MediaQuery.of(context).size.width *
0.15),
child: Material(
borderRadius:
BorderRadius.circular(40.0),
color: Colors.white,
elevation: 8.0,
child: InkWell(
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.add,
size: 30.0,
color: Colors.black,
)
]),
)))));
} else {
return cards[i];
}
}))));
}
}
class RCard extends StatefulWidget {
final int count;
RCard(this.count);
#override
RCardState createState() => RCardState();
}
class RCardState extends State<RCard> {
int count;
String open2;
#override
void initState() {
super.initState();
count = widget.count;
open2 = 'open$count';
}
#override
Widget build(BuildContext context) {
return Hero(
tag: open2,
child: GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Page(
open: open2,
)),
);
},
child: Padding(
padding: EdgeInsets.only(
left: MediaQuery.of(context).size.height * 0.015,
right: MediaQuery.of(context).size.height * 0.015,
top: MediaQuery.of(context).size.width * 0.08,
bottom: MediaQuery.of(context).size.width * 0.15),
child: Material(
borderRadius: BorderRadius.circular(40.0),
color: Colors.white,
elevation: 8.0,
child: Padding(
padding:
EdgeInsets.all(MediaQuery.of(context).size.width * 0.15),
)),
)),
);
}
}
class Page extends StatelessWidget {
final String open;
Page({this.open});
#override
Widget build(BuildContext context) {
return GestureDetector(
child: Hero(
tag: open,
child: Material(
child: Center(child: Text('New page')),
)),
onTap: () {
Navigator.pop(context);
},
);
}
}
But, when I create a second container and press on it, It will give a black screen and get an error message in my debug console saying:
flutter: ══╡ EXCEPTION CAUGHT BY SCHEDULER LIBRARY ╞═════════════════════════════════════════════════════════
flutter: The following assertion was thrown during a scheduler callback:
flutter: There are multiple heroes that share the same tag within a subtree.
flutter: Within each subtree for which heroes are to be animated (typically a PageRoute subtree), each Hero
flutter: must have a unique non-null tag.
flutter: In this case, multiple heroes had the following tag: opennull
flutter: Here is the subtree for one of the offending heroes:
flutter: # Hero(tag: opennull, state: _HeroState#f299c)
flutter: # └KeyedSubtree-[GlobalKey#45266]
flutter: # └GestureDetector
flutter: # └RawGestureDetector(state: RawGestureDetectorState#98814(gestures: [tap]))
flutter: # └_GestureSemantics(renderObject: RenderSemanticsGestureHandler#59110)
flutter: # └Listener(listeners: [down], behavior: deferToChild, renderObject: RenderPointerListener#5cfa6)
flutter: # └Padding(padding: EdgeInsets(13.4, 33.1, 13.4, 62.1), renderObject: RenderPadding#ab11d)
flutter: # └Material(type: canvas, elevation: 8.0, color: Color(0xffffffff), borderRadius: circular(40.0), state: _MaterialState#a511a)
flutter: # └_MaterialInterior(duration: 200ms, shape: RoundedRectangleBorder(BorderSide(Color(0xff000000), 0.0, BorderStyle.none), BorderRadius.circular(40.0)), elevation: 8.0, color: Color(0xffffffff), shadowColor: Color(0xff000000), state: _MaterialInteriorState#6412f(ticker inactive))
flutter: # └PhysicalShape(clipper: ShapeBorderClipper, elevation: 8.0, color: Color(0xffffffff), shadowColor: Color(0xff000000), renderObject: RenderPhysicalShape#1b504)
flutter: # └_ShapeBorderPaint
flutter: # └CustomPaint(renderObject: RenderCustomPaint#94831)
flutter: # └NotificationListener<LayoutChangedNotification>
flutter: # └_InkFeatures-[GlobalKey#8ef37 ink renderer](renderObject: _RenderInkFeatures#670e3)
flutter: # └AnimatedDefaultTextStyle(duration: 200ms, debugLabel: (englishLike body1 2014).merge(blackCupertino body1), inherit: false, color: Color(0xdd000000), family: .SF UI Text, size: 14.0, weight: 400, baseline: alphabetic, decoration: TextDecoration.none, softWrap: wrapping at box width, overflow: clip, state: _AnimatedDefaultTextStyleState#9cb8b(ticker inactive))
flutter: # └DefaultTextStyle(debugLabel: (englishLike body1 2014).merge(blackCupertino body1), inherit: false, color: Color(0xdd000000), family: .SF UI Text, size: 14.0, weight: 400, baseline: alphabetic, decoration: TextDecoration.none, softWrap: wrapping at box width, overflow: clip)
flutter: # └Padding(padding: EdgeInsets.all(62.1), renderObject: RenderPadding#0a02b)
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0 Hero._allHeroesFor.visitor.<anonymous closure>
package:flutter/…/widgets/heroes.dart:210
flutter: #1 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:220
flutter: #2 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #3 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #4 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #5 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #6 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #7 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #8 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #9 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #10 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #11 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #12 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #13 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #14 List.forEach (dart:core/runtime/libgrowable_array.dart:278:8)
flutter: #15 SliverMultiBoxAdaptorElement.visitChildren
package:flutter/…/widgets/sliver.dart:1175
flutter: #16 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #17 MultiChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4948
flutter: #18 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #19 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #20 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #21 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #22 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #23 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #24 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #25 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #26 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #27 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #28 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #29 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #30 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #31 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #32 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #33 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #34 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #35 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #36 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #37 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #38 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #39 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #40 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #41 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #42 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #43 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #44 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #45 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #46 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #47 MultiChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4948
flutter: #48 Hero._allHeroesFor.visitor
flutter: #49 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #50 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #51 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #52 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #53 MultiChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4948
flutter: #54 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #55 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #56 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #57 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #58 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #59 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #60 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #61 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #62 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #63 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #64 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #65 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #66 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #67 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #68 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #69 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #70 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #71 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #72 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #73 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #74 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #75 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #76 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #77 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #78 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #79 ComponentElement.visitChildren
package:flutter/…/widgets/framework.dart:3755
flutter: #80 Hero._allHeroesFor.visitor
package:flutter/…/widgets/heroes.dart:225
flutter: #81 SingleChildRenderObjectElement.visitChildren
package:flutter/…/widgets/framework.dart:4848
flutter: #82 Element.visitChildElements
package:flutter/…/widgets/framework.dart:2686
flutter: #83 Hero._allHeroesFor
package:flutter/…/widgets/heroes.dart:227
flutter: #84 HeroController._startHeroTransition
package:flutter/…/widgets/heroes.dart:655
flutter: #85 HeroController._maybeStartHeroTransition.<anonymous closure>
package:flutter/…/widgets/heroes.dart:630
flutter: #86 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback
package:flutter/…/scheduler/binding.dart:990
flutter: #87 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame
package:flutter/…/scheduler/binding.dart:938
flutter: #88 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame
package:flutter/…/scheduler/binding.dart:842
flutter: #89 _invoke (dart:ui/hooks.dart:154:13)
flutter: #90 _drawFrame (dart:ui/hooks.dart:143:3)
flutter: ════════════════════════════════════════════════════════════════════════════════════════════════════
How anyone please help???

Instead of doing - List.generate in build. Simply Pass RCard directly in PageView.builder
working Code:
import 'package:flutter/material.dart';
void main() => runApp(MainPage());
class MainPage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.white,
body: Column(children: <Widget>[
Body(),
])));
}
}
class Body extends StatefulWidget {
#override
_BodyState createState() => _BodyState();
}
class _BodyState extends State<Body> {
final String open1 = 'open';
int count = 1;
#override
Widget build(BuildContext context) {
print(count);
return Expanded(
child: Container(
child: NotificationListener<OverscrollIndicatorNotification>(
onNotification: (OverscrollIndicatorNotification overscroll) {
overscroll.disallowGlow();
},
child: PageView.builder(
reverse: true,
pageSnapping: false,
controller: PageController(viewportFraction: 0.85),
itemCount: count,
itemBuilder: (context, i) {
if (i == 0) {
return GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Page(
open: open1,
)),
);
count++;
},
child: Hero(
tag: open1,
child: Padding(
padding: EdgeInsets.only(
left:
MediaQuery.of(context).size.height *
0.015,
right:
MediaQuery.of(context).size.height *
0.015,
top: MediaQuery.of(context).size.width *
0.08,
bottom:
MediaQuery.of(context).size.width *
0.15),
child: Material(
borderRadius:
BorderRadius.circular(40.0),
color: Colors.white,
elevation: 8.0,
child: InkWell(
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.add,
size: 30.0,
color: Colors.black,
)
]),
)))));
} else {
return RCard(i);
}
}))));
}
}
class RCard extends StatefulWidget {
final int count;
RCard(this.count);
#override
RCardState createState() => RCardState();
}
class RCardState extends State<RCard> {
int count;
String open2;
#override
void initState() {
super.initState();
count = widget.count;
open2 = 'open$count';
}
#override
Widget build(BuildContext context) {
return Hero(
tag: open2,
child: GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Page(
open: open2,
)),
);
},
child: Padding(
padding: EdgeInsets.only(
left: MediaQuery.of(context).size.height * 0.015,
right: MediaQuery.of(context).size.height * 0.015,
top: MediaQuery.of(context).size.width * 0.08,
bottom: MediaQuery.of(context).size.width * 0.15),
child: Material(
borderRadius: BorderRadius.circular(40.0),
color: Colors.white,
elevation: 8.0,
child: Padding(
padding:
EdgeInsets.all(MediaQuery.of(context).size.width * 0.15),
)),
)),
);
}
}
class Page extends StatelessWidget {
final String open;
Page({this.open});
#override
Widget build(BuildContext context) {
return GestureDetector(
child: Hero(
tag: open,
child: Material(
child: Center(child: Text('New page')),
)),
onTap: () {
Navigator.pop(context);
},
);
}
}

Related

TabBarView in TabBar to take up the remaining space

I have been using TabBar() in my flutter app, and it was working unless I found it my TabBarView() messes up when the screen size changes.
After following this question I have found out the solution to my problem is Expanded() for TabBarView(). I have tried my level best but all I'm getting is a lot of error regarding rendering my data.
⡿flutter: ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
flutter: The following assertion was thrown during performLayout():
flutter: RenderFlex children have non-zero flex but incoming height constraints are unbounded.
⣟flutter: When a column is in a parent that does not provide a finite height constraint, for example if it is
flutter: in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a
flutter: flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining
flutter: space in the vertical direction.
flutter: These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child
flutter: cannot simultaneously expand to fit its parent.
flutter: Consider setting mainAxisSize to MainAxisSize.min and using FlexFit.loose fits for the flexible
flutter: children (using Flexible rather than Expanded). This will allow the flexible children to size
flutter: themselves to less than the infinite remaining space they would otherwise be forced to take, and
flutter: then will cause the RenderFlex to shrink-wrap the children rather than expanding to fit the maximum
flutter: constraints provided by the parent.
flutter: If this message did not help you determine the problem, consider using debugDumpRenderTree():
flutter: https://flutter.dev/debugging/#rendering-layer
flutter: http://docs.flutter.io/flutter/rendering/debugDumpRenderTree.html
flutter: The affected RenderFlex is:
flutter: RenderFlex#bc077 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT(creator: Column ← TabWidget ← Column ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ← AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ← _InkFeatures-[GlobalKey#4f100 ink renderer] ← NotificationListener<LayoutChangedNotification> ← PhysicalModel ← ⋯, parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size), constraints: BoxConstraints(w=375.0, 0.0<=h<=Infinity), size: MISSING, direction: vertical, mainAxisAlignment: start, mainAxisSize: min, crossAxisAlignment: start, textDirection: ltr, verticalDirection: down)
flutter: The creator information is set to:
flutter: Column ← TabWidget ← Column ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ←
flutter: CustomMultiChildLayout ← AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ←
flutter: _InkFeatures-[GlobalKey#4f100 ink renderer] ← NotificationListener<LayoutChangedNotification> ←
flutter: PhysicalModel ← ⋯
flutter: The nearest ancestor providing an unbounded width constraint is: RenderFlex#0807f relayoutBoundary=up1 NEEDS-LAYOUT NEEDS-PAINT:
flutter: creator: Column ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ←
flutter: AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ← _InkFeatures-[GlobalKey#4f100 ink
flutter: renderer] ← NotificationListener<LayoutChangedNotification> ← PhysicalModel ←
flutter: AnimatedPhysicalModel ← Material ← ⋯
flutter: parentData: offset=Offset(0.0, 0.0); id=_ScaffoldSlot.body (can use size)
flutter: constraints: BoxConstraints(0.0<=w<=375.0, 0.0<=h<=591.0)
flutter: size: MISSING
flutter: direction: vertical
flutter: mainAxisAlignment: start
flutter: mainAxisSize: min
flutter: crossAxisAlignment: stretch
flutter: verticalDirection: down
flutter: See also: https://flutter.dev/layout/
flutter: If none of the above helps enough to fix this problem, please don't hesitate to file a bug:
flutter: https://github.com/flutter/flutter/issues/new?template=BUG.md
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0 RenderFlex.performLayout.<anonymous closure> (package:flutter/src/rendering/flex.dart:691:11)
flutter: #1 RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:717:10)
flutter: #2 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #3 RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:743:15)
flutter: #4 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #5 MultiChildLayoutDelegate.layoutChild (package:flutter/src/rendering/custom_layout.dart:142:11)
flutter: #6 _ScaffoldLayout.performLayout (package:flutter/src/material/scaffold.dart:443:7)
flutter: #7 MultiChildLayoutDelegate._callPerformLayout (package:flutter/src/rendering/custom_layout.dart:212:7)
flutter: #8 RenderCustomMultiChildLayoutBox.performLayout (package:flutter/src/rendering/custom_layout.dart:356:14)
flutter: #9 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #10 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #11 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #12 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #13 _RenderCustomClip.performLayout (package:flutter/src/rendering/proxy_box.dart:1214:11)
flutter: #14 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #15 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #16 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #17 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #18 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #19 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #20 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #21 RenderStack.performLayout (package:flutter/src/rendering/stack.dart:510:15)
flutter: #22 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #23 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #24 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #25 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #26 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #27 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #28 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #29 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #30 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #31 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #32 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #33 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #34 RenderOffstage.performLayout (package:flutter/src/rendering/proxy_box.dart:3067:13)
flutter: #35 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #36 RenderStack.performLayout (package:flutter/src/rendering/stack.dart:510:15)
flutter: #37 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #38 __RenderTheatre&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #39 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #40 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #41 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #42 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #43 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #44 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #45 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #46 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #47 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #48 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
flutter: #49 RenderObject.layout (package:flutter/src/rendering/object.dart:1620:7)
flutter: #50 RenderView.performLayout (package:flutter/src/rendering/view.dart:151:13)
flutter: #51 RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:1497:7)
flutter: #52 PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:766:18)
flutter: #53 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:346:19)
flutter: #54 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:701:13)
flutter: #55 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:285:5)
flutter: #56 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1012:15)
flutter: #57 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:952:9)
flutter: #58 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:773:7)
flutter: #60 _Timer._runTimers (dart:isolate-patch/timer_impl.dart:382:19)
flutter: #61 _Timer._handleMessage (dart:isolate-patch/timer_impl.dart:416:5)
flutter: #62 _RawReceivePortImpl._handleMessage (dart:isolate-patch/isolate_patch.dart:171:12)
flutter: (elided one frame from package dart:async-patch)
flutter:
flutter: The following RenderObject was being processed when the exception was fired: RenderFlex#bc077 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT:
flutter: creator: Column ← TabWidget ← Column ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ←
flutter: CustomMultiChildLayout ← AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ←
flutter: _InkFeatures-[GlobalKey#4f100 ink renderer] ← NotificationListener<LayoutChangedNotification> ←
flutter: PhysicalModel ← ⋯
⣯flutter: parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size)
flutter: constraints: BoxConstraints(w=375.0, 0.0<=h<=Infinity)
flutter: size: MISSING
flutter: direction: vertical
flutter: mainAxisAlignment: start
flutter: mainAxisSize: min
flutter: crossAxisAlignment: start
flutter: textDirection: ltr
flutter: verticalDirection: down
flutter: This This RenderObject had the following descendants (showing up to depth 5):
flutter: child 1: RenderPadding#ec776 relayoutBoundary=up3 NEEDS-PAINT
flutter: child: RenderDecoratedBox#82c7d relayoutBoundary=up4 NEEDS-PAINT
flutter: child: RenderPadding#47def relayoutBoundary=up5 NEEDS-PAINT
flutter: child: RenderCustomPaint#d3174 relayoutBoundary=up6 NEEDS-PAINT
flutter: child: _TabLabelBarRenderer#1dbbb relayoutBoundary=up7 NEEDS-PAINT
flutter: child 2: _RenderScrollSemantics#ab273 NEEDS-LAYOUT NEEDS-PAINT
flutter: child: RenderPointerListener#85f41 NEEDS-LAYOUT NEEDS-PAINT
flutter: child: RenderSemanticsGestureHandler#dfb17 NEEDS-LAYOUT NEEDS-PAINT
flutter: child: RenderPointerListener#36472 NEEDS-LAYOUT NEEDS-PAINT
flutter: child: RenderSemanticsAnnotations#0d0f0 NEEDS-LAYOUT NEEDS-PAINT
flutter: ════════════════════════════════════════════════════════════════════════════════════════════════════
flutter: Another exception was thrown: RenderBox was not laid out: RenderFlex#bc077 relayoutBoundary=up2 NEEDS-PAINT
flutter: Another exception was thrown: RenderBox was not laid out: RenderFlex#0807f relayoutBoundary=up1 NEEDS-PAINT
flutter: Another exception was thrown: NoSuchMethodError: The method '>' was called on null.
Now to give you an insight of what I have been doing is that, I have a widget class in which I have defined my TabBar and I'm using this in different places.
This is my widget for TabBar class:
#override
Widget build(BuildContext context) {
return Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.only(left: 16.0, right: 16.0),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.0),
border: Border(bottom: BorderSide(color: Colors.grey, width: 0.5))),
child: TabBar(
unselectedLabelColor: Colors.grey,
unselectedLabelStyle: TextStyle().copyWith(fontSize: 16.0, fontWeight: FontWeight.normal),
labelColor: Color.fromRGBO(253, 92, 99, 1),
labelStyle: TextStyle().copyWith(fontSize: 16.0, fontWeight: FontWeight.bold),
indicatorColor: Color.fromRGBO(253, 92, 99, 1),
indicatorWeight: widget.indicatorWeight,
controller: _controller,
tabs: [
new Tab(
child: Padding(
padding: EdgeInsets.only(top: 18.0),
child: Text(widget.childOneHeader, style: TextStyle(fontSize: 15.0)),
)
),
new Tab(
child: Padding(
padding: EdgeInsets.only(top: 18.0),
child: Text(widget.childTwoHeader, style: TextStyle(fontSize: 15.0)),
)
),
new Tab(
child: Padding(
padding: EdgeInsets.only(top: 18.0),
child: Text(widget.childThreeHeader, style: TextStyle(fontSize: 15.0)),
)
)
]
)
),
Expanded(
//height: widget.layoutHeight,
child: new TabBarView(
controller: _controller,
children: <Widget>[
widget.childOne,
widget.childTwo,
widget.childThree
],
)
)
]
);
The data with widget. is coming from it's constructor.
Now I have been using this in my page which has ListView() for my TabBarView() children, so I'm passing it from them only.
Class Using TabBar Code:
body: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Text('Heading'),
Container(),
TabWidget(
indicatorWeight: 1.0,
childOneHeader: 'Title 1',
childTwoHeader: 'Title 2',
childThreeHeader: 'Title 3',
childOne: ListView(
shrinkWrap: true,
scrollDirection: Axis.vertical,
children: this.isDataNull ?
[Container(
child: errorWidget,
)]
: this.getOffersWidgets()
),
childTwo: ListView(
shrinkWrap: true,
scrollDirection: Axis.vertical,
children: this.isDataNull ?
[Container(
child: errorWidget,
)]
: this.getBarWidgets()
),
childThree: ListView(
shrinkWrap: true,
scrollDirection: Axis.vertical,
children: this.isDataNull ?
[Container(
child: errorWidget,
)]
: this.getEventWidget()
)
)
]
);
I have tried my level best couldn't get it to work. All I'm getting is a blank page nothing else. Please help me with this. Thanks :)
SOLUTION:
Since I have found a way out, so I think my friends who will see this question in the future will get benefited from the question as well.
This is the link to the answer by the way if you want to take a peek of that : Solution to my problem
In the class using tabbarcode, wrap the TabWidget inside Expanded() and rest will be the same, and your job is done.
body: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Text('Heading'),
Container(),
Expanded(
child: TabWidget(//your content goes here)
)
Special thanks to MFARKAN.
Please note, never ever uses Expanded() or Flexible() inside the ListView() or any scrollable widget, cos they require a finite height. use it inside the content but not for Expanded()
Thanks Guys! :)
Reiterating the solution to close the thread. As mentioned in this issue ticket posted on GitHub, TabBarView requires a finite height to be rendered. This can be achieved by using Expanded widget as suggested in the error logs posted and on the solution posted in this GitHub thread
Here's a minimal repro that you can try out
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Expanded(
child: TabWidget(),
),
);
}
}
class TabWidget extends StatefulWidget {
#override
_TabWidgetState createState() => _TabWidgetState();
}
class _TabWidgetState extends State<TabWidget>
with SingleTickerProviderStateMixin {
TabController _controller;
#override
void initState() {
super.initState();
_controller = TabController(length: 3, vsync: this);
}
#override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 10.0),
child: Column(
children: <Widget>[
TabBar(
labelColor: Colors.black,
indicatorColor: Colors.blue,
controller: _controller,
tabs: <Widget>[
Tab(
text: 'Tab 1',
),
Tab(
text: 'Tab 2',
),
Tab(
text: 'Tab 3',
),
],
),
Expanded(
child: TabBarView(
controller: _controller,
children: <Widget>[
Center(
child: Text('Tab View 1'),
),
Center(
child: Text('Tab View 2'),
),
Center(
child: Text('Tab View 3'),
),
],
),
)
],
),
);
}
}
How the app looks

How to use DropDownButton inside a Row?

I trying to add a Drop down inside a Row.
When I do this
Row(
children: <Widget>[
Expanded(child:TextField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'Terms',
hintText: '%'
),
)),
Expanded(child:DropdownButton<String>(
items:_currencies.map((String value){
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
value : 'Rupee',
)),
],
)
Im getting a error
erforming hot reload...
Syncing files to device iPhone XR...
flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
flutter: The following assertion was thrown building SIForm(dirty, state: _SIFormState#da46e):
flutter: 'package:flutter/src/material/dropdown.dart': Failed assertion: line 560 pos 15: 'items == null ||
flutter: items.isEmpty || value == null || items.where((DropdownMenuItem<T> item) => item.value ==
flutter: value).length == 1': is not true.
flutter:
flutter: Either the assertion indicates an error in the framework itself, or we should provide substantially
flutter: more information in this error message to help you determine and fix the underlying cause.
flutter: In either case, please report this assertion by filing a bug on GitHub:
flutter: https://github.com/flutter/flutter/issues/new?template=BUG.md
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #2 new DropdownButton (package:flutter/src/material/dropdown.dart:560:15)
flutter: #3 _SIFormState.build (package:simple_cal/main.dart:65:31)
flutter: #4 StatefulElement.build (package:flutter/src/widgets/framework.dart:3825:27)
flutter: #5 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3736:15)
flutter: #6 Element.rebuild (package:flutter/src/widgets/framework.dart:3559:5)
flutter: #7 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2273:33)
flutter: #8 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:700:20)
flutter: #9 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:268:5)
flutter: #10 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:988:15)
flutter: #11 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:928:9)
flutter: #12 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:749:7)
flutter: #14 _Timer._runTimers (dart:isolate/runtime/libtimer_impl.dart:382:19)
flutter: #15 _Timer._handleMessage (dart:isolate/runtime/libtimer_impl.dart:416:5)
flutter: #16 _RawReceivePortImpl._handleMessage (dart:isolate/runtime/libisolate_patch.dart:171:12)
flutter: (elided 3 frames from class _AssertionError and package dart:async)
flutter: ════════════════════════════════════════════════════════════════════════════════════════════════════
Reloaded 1 of 432 libraries in 736ms.
Here is my full main.dart file
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
Widget MyApp() {
return MaterialApp(
title: 'Simple Intrest app',
home: SIForm (),
);
}
class SIForm extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return _SIFormState ();
}
}
class _SIFormState extends State<SIForm>{
var _currencies = ["Rupees","USD","CAD"];
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title:Text("Simple Interest Calc"),
),
body: Container(
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.only(top : 5.0,bottom : 5.0),
child: TextField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'principle',
hintText: 'Enter the principle amout'
),
)),
Padding(
padding: EdgeInsets.only(top : 5.00*2,bottom : 5.00*2),
child : TextField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'Rate of Interest',
hintText: '%'
),
)),
Row(
children: <Widget>[
Expanded(child:TextField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'Terms',
hintText: '%'
),
)),
Expanded(child:DropdownButton<String>(
items:_currencies.map((String value){
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
value : 'Rupee',
)),
],
)
],
),
),
);
}
}
documentation of DropdownButton says
value: 'Rupees'
not
value: 'Rupee'
because
var _currencies = ["Rupees","USD","CAD"];
and you have to add
onChanged: (str){},
Change from value to "Rupees" and add onChanged function
DropdownButton<String>(
items:_currencies.map((String value){
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
value : 'Rupees',
onChanged: (val){},),

Flutter ScrollController not working under StreamBuilder with ConnectionState condition

I'm new with flutter & just learned how to retrieve data from firestore & did some UI. Right now I have 2 problems;
1- This is a Setting Page which has CustomScrollView contains ScrollController for the controller.
SettingsPage
The controller working fine with this code
class _SettingsPageState extends State<SettingsPage> {
ScrollController _scrollController;
#override
void initState() {
super.initState();
_scrollController = new ScrollController();
_scrollController.addListener(() => setState(() {}));
}
#override
void dispose() {
_scrollController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return StreamBuilder(
stream: Shared.firestore.collection('client').document(Shared.firebaseUser.uid).snapshots(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
return Scaffold(
backgroundColor: Colors.grey[50],
body: Stack(
children: <Widget>[
CustomScrollView(
controller: _scrollController,
slivers: <Widget>[
SliverAppBar(
expandedHeight: 140.0,
pinned: true,
),
SliverFillRemaining(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Expanded(
flex: 8,
child: Column(
children: <Widget>[
Container(
decoration: BoxDecoration(
color: Colors.white,
),
child: Padding(
padding: EdgeInsets.only(
left: 18.0,
top: 18.0,
),
child: Row(
children: <Widget>[
Text(
"Account",
style: TextStyle(
color: Colors.blue[700],
fontSize: 15,
fontWeight: FontWeight.w500,
),
),
],
),
),
),
Container(
decoration: BoxDecoration(
color: Colors.white,
),
child: ListTile(
onTap: () {},
contentPadding: EdgeInsets.only(left: 18.0),
title: Text(
"+${snapshot.data['countryCode']} ${snapshot.data['phoneNumber']}",
style: TextStyle(fontSize: 16),
),
subtitle: Row(
children: <Widget>[
Text(
"Phone Number",
style: TextStyle(
fontSize: 12,
),
),
],
),
),
),
],
),
),
],
),
),
],
),
],
),
);
},
);
}
}
but this error happened
I/flutter ( 8691): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter ( 8691): The following NoSuchMethodError was thrown building StreamBuilder<DocumentSnapshot>(dirty, state:
I/flutter ( 8691): _StreamBuilderBaseState<DocumentSnapshot, AsyncSnapshot<DocumentSnapshot>>#7db43):
I/flutter ( 8691): The method '[]' was called on null.
I/flutter ( 8691): Receiver: null
I/flutter ( 8691): Tried calling: []("countryCode")
I/flutter ( 8691):
I/flutter ( 8691): When the exception was thrown, this was the stack:
I/flutter ( 8691): #0 Object.noSuchMethod (dart:core/runtime/libobject_patch.dart:50:5)
I/flutter ( 8691): #1 _SettingsPageState.build.<anonymous closure> (package:silkwallet/page/settings.dart:81:54)
I/flutter ( 8691): #2 StreamBuilder.build (package:flutter/src/widgets/async.dart:423:74)
I/flutter ( 8691): #3 _StreamBuilderBaseState.build (package:flutter/src/widgets/async.dart:125:48)
I/flutter ( 8691): #4 StatefulElement.build (package:flutter/src/widgets/framework.dart:3809:27)
I/flutter ( 8691): #5 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3721:15)
I/flutter ( 8691): #6 Element.rebuild (package:flutter/src/widgets/framework.dart:3547:5)
I/flutter ( 8691): #7 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3701:5)
I/flutter ( 8691): #8 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3848:11)
I/flutter ( 8691): #9 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3696:5)
I/flutter ( 8691): #10 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2950:14)
I/flutter ( 8691): #11 Element.updateChild (package:flutter/src/widgets/framework.dart:2753:12)
I/flutter ( 8691): #12 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3732:16)
I/flutter ( 8691): #13 Element.rebuild (package:flutter/src/widgets/framework.dart:3547:5)
I/flutter ( 8691): #14 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3701:5)
I/flutter ( 8691): #15 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3848:11)
I/flutter ( 8691): #16 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3696:5)
I/flutter ( 8691): #17 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2950:14)
I/flutter ( 8691): #18 Element.updateChild (package:flutter/src/widgets/framework.dart:2753:12)
I/flutter ( 8691): #19 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4860:14)
I/flutter ( 8691): #20 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2950:14)
I/flutter ( 8691): #21 Element.updateChild (package:flutter/src/widgets/framework.dart:2753:12)
I/flutter ( 8691): #22 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3732:16)
I/flutter ( 8691): #23 Element.rebuild (package:flutter/src/widgets/framework.dart:3547:5)
I/flutter ( 8691): #24 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3701:5)
I/flutter ( 8691): #25 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3696:5)
I/flutter ( 8691): #26 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2950:14)
I/flutter ( 8691): #27 Element.updateChild (package:flutter/src/widgets/framework.dart:2753:12)
.
.
.
I/flutter ( 8691): #135 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:219:5)
I/flutter ( 8691): #136 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)
I/flutter ( 8691): #137 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)
I/flutter ( 8691): #138 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:842:5)
I/flutter ( 8691): #139 _invoke (dart:ui/hooks.dart:154:13)
I/flutter ( 8691): #140 _drawFrame (dart:ui/hooks.dart:143:3)
2- After some research for this error, I add connectionState condition inside StreamBuilder which solved above problem
this is the new code, i put the Scaffold inside active connectionState
class _SettingsPageState extends State<SettingsPage> {
ScrollController _scrollController;
#override
void initState() {
super.initState();
_scrollController = new ScrollController();
_scrollController.addListener(() => setState(() {}));
}
#override
void dispose() {
_scrollController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return StreamBuilder(
stream: Shared.firestore.collection('client').document(Shared.firebaseUser.uid).snapshots(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.connectionState == ConnectionState.active) {
return Scaffold(
backgroundColor: Colors.grey[50],
body: Stack(
.
.
.
),
);
} else if (snapshot.connectionState == ConnectionState.waiting) {
return Container(child: Center(child: CircularProgressIndicator()));
} else {
return Container(
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Icon(Icons.warning),
),
Text('Error in loadind data')
],
),
);
}
},
);
}
}
and I realized that when I scrolled the connectionState will change to waiting and the ScrollController not working under this state as shown in the image below
ScrollController: page keep flashing when try to scroll
The reason I want to use the ScrollController because I want to add FloatingActionButton inside Positioned which will scroll along & disappear when reach certain position, here's the image with FloatingActionButton
NoSuchMethodError the method was called on null errors are usually thrown when the method that you're trying to call from the object is yet to be initialized. The error seems to be coming from snapshot.data['countryCode']. What you can do here is add a null-check on snapshot before displaying the data.
if (snapshot != null && snapshot.hasData) {
// Display data
} else {
// Display circular progress...
}

Flutter widget test of a custom widget fails

I am trying to test a custom widget GoogleSignInButton.
Here is the implementation of the widget:
import 'package:flutter/material.dart';
class GoogleSignInButton extends StatelessWidget {
GoogleSignInButton({this.onPressed});
final Function onPressed;
#override
Widget build(BuildContext context) {
Image _buildLogo() {
return Image.asset(
"assets/g-logo.png",
height: 18.0,
width: 18.0,
);
}
Opacity _buildText() {
return Opacity(
opacity: 0.54,
child: Text(
"Sign in with Google",
style: TextStyle(
fontFamily: 'Roboto-Medium',
color: Colors.black,
),
),
);
}
return MaterialButton(
height: 40.0,
onPressed: this.onPressed,
color: Colors.white,
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
_buildLogo(),
SizedBox(width: 24.0),
_buildText(),
],
),
);
}
}
I am trying to test the onPressed function callback by the test that follows.
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import '../lib/ui/widgets/google_sign_in_button.dart';
void main() {
testWidgets('my first widget test', (WidgetTester tester) async {
var pressed = false;
var widget = GoogleSignInButton(
onPressed: () => () {
pressed = true;
},
);
await tester.pumpWidget(
StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return MaterialApp(
home: Material(
child: Center(
child: widget,
),
),
);
},
),
);
await tester.press(find.byWidget(widget));
expect(pressed, equals(true));
});
}
Unfortunately, the test fails.
I am executing my widget test on the command line by flutter test test/widget_test.dart and here is the result of the test:
══╡ EXCEPTION CAUGHT BY FLUTTER TEST FRAMEWORK ╞════════════════════════════════════════════════════
The following TestFailure object was thrown running a test:
Expected: <true>
Actual: <false>
When the exception was thrown, this was the stack:
#4 main.<anonymous closure> (file:///home/hans/Development/flutter/recipes_app/test/widget_test.dart:30:5)
<asynchronous suspension>
#5 testWidgets.<anonymous closure>.<anonymous closure> (package:flutter_test/src/widget_tester.dart:72:23)
#6 TestWidgetsFlutterBinding._runTestBody (package:flutter_test/src/binding.dart:566:19)
<asynchronous suspension>
#9 TestWidgetsFlutterBinding._runTest (package:flutter_test/src/binding.dart:550:14)
#10 AutomatedTestWidgetsFlutterBinding.runTest.<anonymous closure> (package:flutter_test/src/binding.dart:893:24)
#16 AutomatedTestWidgetsFlutterBinding.runTest (package:flutter_test/src/binding.dart:890:15)
#17 testWidgets.<anonymous closure> (package:flutter_test/src/widget_tester.dart:71:22)
#18 Declarer.test.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:test_api/src/backend/declarer.dart:168:27)
<asynchronous suspension>
#19 Invoker.waitForOutstandingCallbacks.<anonymous closure> (package:test_api/src/backend/invoker.dart:249:15)
<asynchronous suspension>
#24 Invoker.waitForOutstandingCallbacks (package:test_api/src/backend/invoker.dart:246:5)
#25 Declarer.test.<anonymous closure>.<anonymous closure> (package:test_api/src/backend/declarer.dart:166:33)
#30 Declarer.test.<anonymous closure> (package:test_api/src/backend/declarer.dart:165:13)
<asynchronous suspension>
#31 Invoker._onRun.<anonymous closure>.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:test_api/src/backend/invoker.dart:399:25)
<asynchronous suspension>
#45 _Timer._runTimers (dart:isolate/runtime/libtimer_impl.dart:382:19)
#46 _Timer._handleMessage (dart:isolate/runtime/libtimer_impl.dart:416:5)
#47 _RawReceivePortImpl._handleMessage (dart:isolate/runtime/libisolate_patch.dart:171:12)
(elided 28 frames from class _FakeAsync, package dart:async, and package stack_trace)
This was caught by the test expectation on the following line:
file:///home/hans/Development/flutter/recipes_app/test/widget_test.dart line 30
The test description was:
my first widget test
════════════════════════════════════════════════════════════════════════════════════════════════════
00:01 +0 -1: my first widget test [E]
Test failed. See exception logs above.
The test description was: my first widget test
00:02 +0 -1: Some tests failed.
Any ideas why the test fails?
Your closure is wrong:
() => () {
pressed = true;
},
You need to write it either like that
() {
pressed = true;
},
Or like that
() => ( pressed = true )
And you need to trigger the tester.tap method.
That's my working code:
var pressed = false;
var widget = GoogleSignInButton(
onPressed: () {
pressed = true;
debugPrint("Pressed!");
},
);
await tester.pumpWidget(
StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return MaterialApp(
home: Material(
child: Center(
child: widget,
),
),
);
},
),
);
expect(find.byWidget(widget), findsOneWidget);
await tester.tap(find.byWidget(widget));
expect(pressed, isTrue);
And I've supposed that when you run your project your Widget renders well and does not throw any errors.
HINT: make a flutter clean after any change in your test_file.dart change.

How to properly set value of DropdownButton using Bloc in Flutter?

I'm new in Bloc programming pattern and I'm having an issue when using it in with Dropdown
That's in my bloc class:
final _dropDown = BehaviorSubject<String>();
Stream<String> get dropDownStream => _dropDown.stream;
Sink<String> get dropDownSink => _dropDown.sink;
final _dropdownValues = BehaviorSubject<List<String>>(seedValue: [
'One',
'Two',
'Three',
'Four',
].toList());
Stream<List<String>> get dropdownValuesStream => _dropdownValues.stream;
In my widget page I added the following dropdown widget so that everything is handled by the Bloc class:
StreamBuilder<List<String>>(
stream: _exampleBloc.dropdownValuesStream,
builder: (BuildContext contextValues, AsyncSnapshot snapshotValues) {
return StreamBuilder<String>(
stream: _exampleBloc.dropDownStream,
builder: (BuildContext context, AsyncSnapshot snapshot) {
return InputDecorator(
decoration: InputDecoration(
icon: const Icon(Icons.color_lens),
labelText: 'DropDown',
),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
value: snapshot.data,
onChanged: (String newValue) => _exampleBloc.dropDownSink.add(newValue),
items: snapshotValues.data != null ? snapshotValues.data.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList() : <String>[''].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
),
),
);
},
);
},
),
But doing like that, I get this error when setting the value (value: snapshot.data) of the DropdownButton:
I/flutter ( 5565): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter ( 5565): The following assertion was thrown building StreamBuilder<String>(dirty, state:
I/flutter ( 5565): _StreamBuilderBaseState<String, AsyncSnapshot<String>>#70482):
I/flutter ( 5565): 'package:flutter/src/material/dropdown.dart': Failed assertion: line 514 pos 15: 'items == null ||
I/flutter ( 5565): value == null || items.where((DropdownMenuItem<T> item) => item.value == value).length == 1': is not
I/flutter ( 5565): true.
I/flutter ( 5565):
I/flutter ( 5565): Either the assertion indicates an error in the framework itself, or we should provide substantially
I/flutter ( 5565): more information in this error message to help you determine and fix the underlying cause.
I/flutter ( 5565): In either case, please report this assertion by filing a bug on GitHub:
I/flutter ( 5565): https://github.com/flutter/flutter/issues/new?template=BUG.md
I/flutter ( 5565):
I/flutter ( 5565): When the exception was thrown, this was the stack:
I/flutter ( 5565): #2 new DropdownButton (package:flutter/src/material/dropdown.dart:514:15)
I/flutter ( 5565): #3 _ExamplePageState.build.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:financeiro_mobile/src/ui/exemple/example_page.dart:129:42)
I/flutter ( 5565): #4 StreamBuilder.build (package:flutter/src/widgets/async.dart:423:74)
I/flutter ( 5565): #5 _StreamBuilderBaseState.build (package:flutter/src/widgets/async.dart:125:48)
I/flutter ( 5565): #6 StatefulElement.build (package:flutter/src/widgets/framework.dart:3809:27)
I/flutter ( 5565): #7 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3721:15)
I/flutter ( 5565): #8 Element.rebuild (package:flutter/src/widgets/framework.dart:3547:5)
I/flutter ( 5565): #9 StatefulElement.update (package:flutter/src/widgets/framework.dart:3878:5)
I/flutter ( 5565): #10 Element.updateChild (package:flutter/src/widgets/framework.dart:2742:15)
I/flutter ( 5565): #11 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3732:16)
I/flutter ( 5565): #12 Element.rebuild (package:flutter/src/widgets/framework.dart:3547:5)
I/flutter ( 5565): #13 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2286:33)
I/flutter ( 5565): #14 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:676:20)
I/flutter ( 5565): #15 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:219:5)
I/flutter ( 5565): #16 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)
I/flutter ( 5565): #17 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)
I/flutter ( 5565): #18 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:842:5)
I/flutter ( 5565): #19 _invoke (dart:ui/hooks.dart:154:13)
I/flutter ( 5565): #20 _drawFrame (dart:ui/hooks.dart:143:3)
I/flutter ( 5565): (elided 2 frames from class _AssertionError)
I tried a lot of ideas like checking if snapshotValues.data is not null when setting. I know that the value has to be something from the list or null. But no logic that I put there makes this error go away.
If I set the value to null, it works, but then the selected value doesn't show.
Am I doing this wrong? Is there a better way that works? How can I solve this issue?
Thanks!
I solved it using two stream in the bloc, one for the list of elemtns and the other for the value. So in ther build, you need two chained StreamBuilders and when u got both snapshots with data, you load the build. Like that:
Widget _holdingDropDown() {
return StreamBuilder(
stream: bloc.holding,
builder: (BuildContext context, AsyncSnapshot<Holding> snapshot) {
return Container(
child: Center(
child: snapshot.hasData
? StreamBuilder(
stream: bloc.obsHoldingList,
builder: (BuildContext context,
AsyncSnapshot<List<Holding>> holdingListSnapshot) {
return holdingListSnapshot.hasData ?
DropdownButton<Holding>(
value: snapshot.data,
items: _listDropDownHoldings,
onChanged: (Holding h) {
_changeDropDownItemHolding(h);
},
): CircularProgressIndicator();
},
)
: CircularProgressIndicator(),
),
);
});
}
I use the circular progress indicator to return if I don't have the snapshot with data.
I hope I have been helpful.
That's because you are using a StreamBuilder, so at the first time your snapshot is empty, you have to do a validation :
return snapshot.hasData ?
InputDecorator(
decoration: InputDecoration(
icon: const Icon(Icons.color_lens),
labelText: 'DropDown',
),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
value: snapshot.data,
onChanged: (String newValue) => _exampleBloc.dropDownSink.add(newValue),
items: snapshotValues.data != null ? snapshotValues.data.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList() : SizedBox(height: 0.0)
),
) : SizedBox(height: 0.0);
Display an empty widget SizedBox(height: 0.0) or a CircleProgressIndicator
I use just Bloc for setting and changing Dropdown values, without using stream (in example I use two dropdowns with different values). Below part of real script from my app:
class LangsInput extends StatelessWidget {
const LangsInput({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return BlocBuilder<WordGroupFormBloc, WordGroupFormState>(
buildWhen: (previous, current) => previous != current,
builder: (context, state) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
DropdownButton<String>(
value: state.langStudy.value,
icon: const Icon(Icons.arrow_drop_down),
elevation: 16,
onChanged: (String? newValue) {
context.read<WordGroupFormBloc>().add(LangStudyChanged(langStudy: newValue as String));
},
items: getLanguageList(),
),
DropdownButton<String>(
value: state.langTransl.value,
icon: const Icon(Icons.arrow_drop_down),
elevation: 16,
onChanged: (String? newValue) {
context.read<WordGroupFormBloc>().add(LangTranslChanged(langTransl: newValue as String));
},
items: getLanguageList(),
),
]
);
}
);
}
}
and part of script example from bloc:
void _onLangStudyChanged(LangStudyChanged event, Emitter<WordGroupFormState> emit) {
final langStudy = LangStudy.dirty(event.langStudy);
emit(state.copyWith(
langStudy: langStudy.valid ? langStudy : LangStudy.pure(event.langStudy),
status: Formz.validate([langStudy]),
));
}

Resources