I make a application in flutter.
It's simple. In the principal layout exist an stack. In the first level are a background (what its a simple gradient), and in the second lever are the "body" of the application.
In this body of application i have a column (To put one item below another). this column are divided by separate widgets. One is for the "tile", and other is for a ListView, this ListView will show information from a database, but in this moment i only create 10 items for an example.
The code is this:
//This for a homepage
#override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: Stack(
children: [
Background(),
HomeBody(),
],
),
);
The background (are in another file, in the homepage are imported):
#override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: [0.2, 0.8],
colors: [
Color(0xff2E305F),
Color(0xff202333),
],
)),
);
And this is the "body":
#override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
children: [
PageTitle(),
Changes(),
],
),
);
}
}
class PageTitle extends StatelessWidget {
const PageTitle({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 20),
child: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
height: 25,
),
Text(
'Biggest Title',
style: TextStyle(
color: Colors.white,
fontSize: 55.0,
fontWeight: FontWeight.bold,
),
),
SizedBox(
//height: 1,
),
Text(
'low subtitle',
style: TextStyle(
color: Colors.white,
fontSize: 14.0,
fontWeight: FontWeight.w300,
),
),
],
),
),
);
}
}
class Changes extends StatelessWidget {
const Changes({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return ListView(
children: [
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
],
);
}
}
The error is:
═══════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during performResize():
Vertical viewport was given unbounded height.
Viewports expand in the scrolling direction to fill their container. In this case, a vertical viewport was given an unlimited amount of vertical space in which to expand. This situation typically happens when a scrollable widget is nested inside another scrollable widget.
If this widget is always nested in a scrollable widget there is no need to use a viewport because there will always be enough vertical space for the children. In this case, consider using a Column instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size the height of the viewport to the sum of the heights of its children.
The relevant error-causing widget was
ListView
lib/widgets/home_body_screen.dart:64
When the exception was thrown, this was the stack
#0 RenderViewport.computeDryLayout.<anonymous closure>
package:flutter/…/rendering/viewport.dart:1369
#1 RenderViewport.computeDryLayout
package:flutter/…/rendering/viewport.dart:1430
#2 RenderBox.performResize
package:flutter/…/rendering/box.dart:2332
#3 RenderObject.layout
package:flutter/…/rendering/object.dart:1758
#4 RenderProxyBoxMixin.performLayout
package:flutter/…/rendering/proxy_box.dart:116
...
The following RenderObject was being processed when the exception was fired: RenderViewport#33c99 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
RenderObject: RenderViewport#33c99 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
offset: ScrollPositionWithSingleContext#b9cb0(offset: 0.0, range: null..null, viewport: null, ScrollableState, AlwaysScrollableScrollPhysics -> ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#03740, ScrollDirection.idle)
anchor: 0.0
center child: RenderSliverPadding#e0507 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: paintOffset=Offset(0.0, 0.0)
constraints: MISSING
geometry: null
padding: EdgeInsets.zero
textDirection: ltr
child: RenderSliverList#2982b NEEDS-LAYOUT NEEDS-PAINT
parentData: paintOffset=Offset(0.0, 0.0)
constraints: MISSING
geometry: null
no children current live
RenderBox was not laid out: RenderViewport#33c99 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'
The relevant error-causing widget was
ListView
lib/widgets/home_body_screen.dart:64
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderViewport#33c99 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'
The relevant error-causing widget was
ListView
lib/widgets/home_body_screen.dart:64
I'm a newest in flutter, i understand some things, but not all.
My opinion is: "this error is caused by her possition, yeah, its scrollable but he does not know where ends". Sorry if i wrong.
thanks all!
To use ListView inner SingleChildScrollView, you need to disable scrolling property of ListView.
ListView(
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
primary: false,
children: []
)
Related
I have the following FutureBuilder and I am trying to display a loading spinner when the connection state is in waiting status but am getting alot of exception regarding size. Not sure where to include the size since my spinner already has a size.
return Scaffold(
backgroundColor: Colors.grey[100],
appBar: AppBar(
backgroundColor: Colors.grey[100],
elevation: 0,
brightness: Brightness.light,
leading: Icon(null),
actions: <Widget>[
IconButton(
onPressed: () {},
icon: Icon(
Icons.shopping_basket,
color: Colors.grey[800],
),
)
],
),
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(horizontal: 20.0),
child: FutureBuilder(
future: _screenFuture,
// ignore: missing_return
builder: (context, snap) {
if (snap.error != null &&
!snap.error
.toString()
.contains('NoSuchMethodError')) {
return Center(child: Text('Something went wrong!'));
} else if (snap.hasData) {
var categoriesData = Provider.of<Categories>(context);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
FadeAnimation(
1,
Text(
'Food Delivery',
style: TextStyle(
color: Colors.grey[80],
fontWeight: FontWeight.bold,
fontSize: 30),
)),
SizedBox(
height: 20,
),
Container(
height: 50,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: categoriesData.items.length,
itemBuilder: (ctx, i) => FadeAnimation(
1,
makeCategory(
isActive: true,
title: categoriesData.items
.toList()[i]
.title)))),
SizedBox(
height: 10,
),
],
);
} else if (snap.connectionState ==
ConnectionState.waiting) {
return Center(child: Loading());
}
})),
SizedBox(
height: 30,
)
],
),
),
);
Loading spinner class
class Loading extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container(
color: Colors.white,
child: SpinKitFadingCircle(
color: Colors.black,
size: 30,
)
);
}
}
Exceptions I am getting: I see that it is pointing to line 7 of my loading spinner but I am honestly not sure what to make of it.
════════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during performResize():
'package:flutter/src/widgets/overlay.dart': Failed assertion: line 720 pos 12: 'constraints.biggest.isFinite': is not true.
2
Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
https://github.com/flutter/flutter/issues/new?template=2_bug.md
The relevant error-causing widget was
MaterialApp
lib\widgets\loading.dart:7
When the exception was thrown, this was the stack
#2 _RenderTheatre.computeDryLayout
package:flutter/…/widgets/overlay.dart:720
#3 RenderBox.performResize
package:flutter/…/rendering/box.dart:2332
#4 RenderObject.layout
package:flutter/…/rendering/object.dart:1758
#5 RenderProxyBoxMixin.performLayout
package:flutter/…/rendering/proxy_box.dart:116
#6 RenderObject.layout
package:flutter/…/rendering/object.dart:1779
...
The following RenderObject was being processed when the exception was fired: _RenderTheatre#d0b0d NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
RenderObject: _RenderTheatre#d0b0d NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
arentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=320.0, 0.0<=h<=Infinity)
size: MISSING
skipCount: 0
textDirection: ltr
onstage 1: RenderIgnorePointer#7e525 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: not positioned; offset=Offset(0.0, 0.0)
constraints: MISSING
size: MISSING
ignoring: false
ignoringSemantics: implicitly false
child: RenderBlockSemantics#115dd NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
blocks semantics of earlier render objects below the common boundary
size: MISSING
blocking: true
child: RenderExcludeSemantics#791f1 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
excluding: true
child: RenderSemanticsGestureHandler#fab4a NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
behavior: opaque
gestures: tap
onstage 2: RenderSemanticsAnnotations#e679a NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: not positioned; offset=Offset(0.0, 0.0)
constraints: MISSING
size: MISSING
child: RenderOffstage#31df1 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
offstage: false
child: RenderSemanticsAnnotations#12c91 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: <none>
constraints: MISSING
size: MISSING
child: RenderRepaintBoundary#93c1c NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
needs compositing
parentData: <none>
constraints: MISSING
size: MISSING
usefulness ratio: no metrics collected yet (never painted)
no offstage children
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
BoxConstraints forces an infinite height.
The relevant error-causing widget was
MaterialApp
lib\widgets\loading.dart:7
════════════════════════════════════════════════════════════════════════════════
After removing materialApp in loading spinner, I am now getting this exception:
════════ Exception caught by widgets library ═══════════════════════════════════
The following assertion was thrown building SpinKitFadingCircle(state: _SpinKitFadingCircleState#75158(ticker active)):
No Directionality widget found.
Stack widgets require a Directionality widget ancestor to resolve the 'alignment' argument.
The default value for 'alignment' is AlignmentDirectional.topStart, which requires a text direction.
The specific widget that could not find a Directionality ancestor was: Stack
alignment: AlignmentDirectional.topStart
fit: loose
dirty
The ownership chain for the affected widget is: "Stack ← SizedBox ← Center ← SpinKitFadingCircle ← ColoredBox ← Container ← Loading ← Center ← MyApp ← [root]"
Typically, the Directionality widget is introduced by the MaterialApp or WidgetsApp widget at the top of your application widget tree. It determines the ambient reading direction and is used, for example, to determine how to lay out text, how to interpret "start" and "end" values, and to resolve EdgeInsetsDirectional, AlignmentDirectional, and other *Directional objects.
Instead of providing a Directionality widget, another solution would be passing a non-directional 'alignment', or an explicit 'textDirection', to the Stack.
from the error message, I guess if you wrapped SpinKitFadingCircle inside a Directionality it might work! if it didn't, we need more info about the SpinKitFadingCircle widget.
class Loading extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container(
color: Colors.white,
child: Directionality(
textDirection: TextDirection.rtl,
child: SpinKitFadingCircle(
color: Colors.black,
size: 30,
),
),
);
}
}
I have a SingleChildScrollView with a Column as child with a lots of children, two of them are a TabBar and a TabBarView. The TabBar renders ok but when I add a TabBarView I got the error:
======== Exception caught by rendering library =====================================================
The following assertion was thrown during performResize():
Horizontal viewport was given unbounded height.
Viewports expand in the cross axis to fill their container and constrain their children to match their extent in the cross axis. In this case, a horizontal viewport was given an unlimited amount of vertical space in which to expand.
The relevant error-causing widget was:
TabBarView file:///C:/Users/user/Documents/FlutterProjects/singlechildscrollview/lib/main.dart:83:13
When the exception was thrown, this was the stack:
#0 RenderViewport.computeDryLayout.<anonymous closure> (package:flutter/src/rendering/viewport.dart:1418:15)
#1 RenderViewport.computeDryLayout (package:flutter/src/rendering/viewport.dart:1430:6)
#2 RenderBox.performResize (package:flutter/src/rendering/box.dart:2332:12)
#3 RenderObject.layout (package:flutter/src/rendering/object.dart:1758:9)
#4 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:116:14)
...
The following RenderObject was being processed when the exception was fired: RenderViewport#4db57 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... needs compositing
... parentData: <none> (can use size)
... constraints: BoxConstraints(0.0<=w<=568.0, 0.0<=h<=Infinity)
... size: MISSING
... axisDirection: right
... crossAxisDirection: down
... offset: _PagePosition#05511(range: null..null, viewport: null, ScrollableState, _ForceImplicitScrollPhysics -> PageScrollPhysics -> PageScrollPhysics -> ClampingScrollPhysics -> ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#083c3, ScrollDirection.idle)
... anchor: 0.0
RenderObject: RenderViewport#4db57 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=568.0, 0.0<=h<=Infinity)
size: MISSING
axisDirection: right
crossAxisDirection: down
offset: _PagePosition#05511(range: null..null, viewport: null, ScrollableState, _ForceImplicitScrollPhysics -> PageScrollPhysics -> PageScrollPhysics -> ClampingScrollPhysics -> ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#083c3, ScrollDirection.idle)
anchor: 0.0
... center child: _RenderSliverFractionalPadding#c51bd NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: paintOffset=Offset(0.0, 0.0)
... constraints: MISSING
... geometry: null
... child: RenderSliverFillViewport#29be2 NEEDS-LAYOUT NEEDS-PAINT
... parentData: paintOffset=Offset(0.0, 0.0)
... constraints: MISSING
... geometry: null
... no children current live
====================================================================================================
======== Exception caught by rendering library =====================================================
The following assertion was thrown during performLayout():
RenderBox was not laid out: RenderViewport#4db57 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'
I know that this error is related to the TabBarView doesn't have a height, I cannot set a specific height since the content from each tab will be dynamic or use any other ScrollView, I already tried to wrap it into a Flexible with fit: FlexFit.loose and set to all Column's mainAxisSize: MainAxisSize.min but it still doesn't work.
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin{
late TabController tabController;
#override
void initState() {
super.initState();
tabController = TabController(length: 2, vsync: this);
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
child: Column(
children: [
/// Other widgets here...then
TabBar(
controller: tabController,
tabs: [
Tab(
child: Text(
"Tab 1",
style: TextStyle(
color: Colors.black
),
),
),
Tab(
child: Text(
"Tab 1",
style: TextStyle(
color: Colors.black
),
),
),
],
),
TabBarView(
controller: tabController,
children: [
/// Each content from each tab will have a dynamic height
Container(),
Container()
],
)
],
),
),
);
}
}
You can use this sample app as example. In short, I'm nesting both TabBar and TabBarView within a NestedScrollView that take full size of the screen. This way you can have a dynamic body within the TabBarView
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(home: MyHomePage()));
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
late TabController tabController;
#override
void initState() {
super.initState();
tabController = TabController(length: 2, vsync: this);
}
#override
void dispose() {
tabController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: NestedScrollView(
headerSliverBuilder: (context, value) {
return [
SliverToBoxAdapter(
child: TabBar(
controller: tabController,
labelColor: Colors.redAccent,
isScrollable: true,
tabs: [
Tab(
child: Text(
"Tab 1",
style: TextStyle(color: Colors.black),
),
),
Tab(
child: Text(
"Tab 1",
style: TextStyle(color: Colors.black),
),
),
],
),
),
];
},
body: Container(
child: TabBarView(
controller: tabController,
children: [
/// Each content from each tab will have a dynamic height
Container(),
Container()
],
),
),
),
);
}
}
I want to write the available devices under the image that is shown like this:
If I remove the image part I get only available devices but i need to add image as well above the BLE devices.
But I am getting an error if I run my code:
Performing hot reload...
Syncing files to device Redmi Note 8 Pro...
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
The following assertion was thrown during performResize():
Vertical viewport was given unbounded height.
Viewports expand in the scrolling direction to fill their container. In this case, a vertical viewport was given an unlimited amount of vertical space in which to expand. This situation typically happens when a scrollable widget is nested inside another scrollable widget.
If this widget is always nested in a scrollable widget there is no need to use a viewport because there will always be enough vertical space for the children. In this case, consider using a Column instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size the height of the viewport to the sum of the heights of its children.
The relevant error-causing widget was:
ListView file:///F:/epicare/lib/BluetoothScanningDevices.dart:113:12
When the exception was thrown, this was the stack:
#0 RenderViewport.computeDryLayout.<anonymous closure> (package:flutter/src/rendering/viewport.dart:1365:15)
#1 RenderViewport.computeDryLayout (package:flutter/src/rendering/viewport.dart:1426:6)
#2 RenderBox.performResize (package:flutter/src/rendering/box.dart:2342:12)
#3 RenderObject.layout (package:flutter/src/rendering/object.dart:1763:9)
#4 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:118:14)
...
The following RenderObject was being processed when the exception was fired: RenderViewport#6aa27 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... needs compositing
... parentData: <none> (can use size)
... constraints: BoxConstraints(0.0<=w<=392.7, 0.0<=h<=Infinity)
... size: MISSING
... axisDirection: down
... crossAxisDirection: right
... offset: ScrollPositionWithSingleContext#5f4da(offset: 0.0, range: null..null, viewport: null, ScrollableState, AlwaysScrollableScrollPhysics -> ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#9b3a7, ScrollDirection.idle)
... anchor: 0.0
RenderObject: RenderViewport#6aa27 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=392.7, 0.0<=h<=Infinity)
size: MISSING
axisDirection: down
crossAxisDirection: right
offset: ScrollPositionWithSingleContext#5f4da(offset: 0.0, range: null..null, viewport: null, ScrollableState, AlwaysScrollableScrollPhysics -> ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#9b3a7, ScrollDirection.idle)
anchor: 0.0
... center child: RenderSliverPadding#47e11 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: paintOffset=Offset(0.0, 0.0)
... constraints: MISSING
... geometry: null
... padding: EdgeInsets.all(8.0)
... textDirection: ltr
... child: RenderSliverList#673c8 NEEDS-LAYOUT NEEDS-PAINT
... parentData: paintOffset=Offset(0.0, 0.0)
... constraints: MISSING
... geometry: null
... no children current live
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderViewport#6aa27 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1940 pos 12: 'hasSize'
The relevant error-causing widget was:
ListView file:///F:/epicare/lib/BluetoothScanningDevices.dart:113:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderViewport#6aa27 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1940 pos 12: 'hasSize'
The relevant error-causing widget was:
ListView file:///F:/epicare/lib/BluetoothScanningDevices.dart:113:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderIgnorePointer#d974c relayoutBoundary=up20 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1940 pos 12: 'hasSize'
The relevant error-causing widget was:
ListView file:///F:/epicare/lib/BluetoothScanningDevices.dart:113:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#6e459 relayoutBoundary=up19 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1940 pos 12: 'hasSize'
The relevant error-causing widget was:
ListView file:///F:/epicare/lib/BluetoothScanningDevices.dart:113:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderPointerListener#0c15f relayoutBoundary=up18 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1940 pos 12: 'hasSize'
The relevant error-causing widget was:
ListView file:///F:/epicare/lib/BluetoothScanningDevices.dart:113:12
═════════════════════════════════════════════════════════════════════════════════════════════════
My code is:
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'BluetoothConnectBand.dart';
import 'BluetoothConnectedSuccess.dart';
import 'package:flutter_blue/flutter_blue.dart';
class BluetoothScanningDevices extends StatefulWidget {
#override
_BluetoothScanningDevicesState createState() => _BluetoothScanningDevicesState();
}
class _BluetoothScanningDevicesState extends State<BluetoothScanningDevices> {
FlutterBlue flutterBlueInstance = FlutterBlue.instance;
final List<BluetoothDevice> devicesList = new List<BluetoothDevice>();
_addDeviceTolist(final BluetoothDevice device) {
if (!devicesList.contains(device)) {
setState(() {
devicesList.add(device);
});
}
}
#override
void initState() {
super.initState();
FlutterBlue.instance.connectedDevices
.asStream()
.listen((List<BluetoothDevice> devices) {
for (BluetoothDevice device in devices) {
_addDeviceTolist(device);
}
});
FlutterBlue.instance.scanResults.listen((List<ScanResult> results) {
for (ScanResult result in results) {
_addDeviceTolist(result.device);
}
});
FlutterBlue.instance.startScan();
}
ListView _buildListViewOfDevices() {
Size size = MediaQuery.of(context).size;
List<Container> containers = new List<Container>();
for (BluetoothDevice device in devicesList) {
containers.add(
Container(
width: size.width,
child: RaisedButton(
padding: EdgeInsets.symmetric(vertical:10.0, horizontal: 15.0),
elevation: 5.0,
color: Colors.white,
onPressed: (){
Navigator.push(
context,
MaterialPageRoute(
builder: (context){
return BluetoothConnectedSuccess();
},
),
);
},
child:Column(
children: [
Align(
alignment: Alignment.centerLeft,
child: Text(
device.name == '' ? '(Unknown Device)' : device.name,
style: TextStyle(
fontSize: 15.0,
color: Colors.black,
fontWeight: FontWeight.w600,
fontFamily: 'Montserrat',
),
),
),
Align(
alignment: Alignment.centerLeft,
child: Text(
device.id.toString(),
style: TextStyle(
fontSize: 13.0,
color: Colors.black,
fontWeight: FontWeight.w500,
fontFamily: 'Montserrat',
)
),
),
],
),
),
),
);
}
return ListView(
padding: const EdgeInsets.all(8),
children: <Widget>[
...containers,
],
);
}
#override
Widget build(BuildContext context) {
Size size = MediaQuery.of(context).size;
return Scaffold(
appBar: AppBar(
backgroundColor: const Color(0xffE5E0A1),
elevation: 0,
centerTitle: true,
title: Text("Connect Band",
style: TextStyle(
fontSize: 15.0,
color: Colors.black,
fontFamily: 'Montserrat',
fontWeight: FontWeight.normal,
),
) ,
leading: IconButton(icon: Icon(Icons.arrow_back,color: Colors.black,),onPressed: (){
Navigator.push(
context,
MaterialPageRoute(builder: (context){
return BluetoothConnectBand();
},
),
);
},
),
actions: [
Padding(
padding: EdgeInsets.only(right: 5.0),
child: FlatButton(
onPressed: () {
},
child: Text(
"Search",
style: TextStyle(
fontSize: 15.0,
color: Colors.black,
fontWeight: FontWeight.normal,
fontFamily: 'Montserrat',
),
),
),
)
],
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
height: size.height*0.4,
width: size.width,
color: const Color(0xffE5E0A1),
child: Image.asset('assets/images/bluetooth.png',)
),
Container(
width: size.width,
padding: EdgeInsets.symmetric(vertical: 20),
child: Text(
"Scanning Available Devices...",
style: TextStyle(
fontSize: 15.0,
color: Colors.black,
fontWeight: FontWeight.w400,
fontFamily: 'Montserrat',
),
textAlign: TextAlign.center,
),
),
SingleChildScrollView(
child: _buildListViewOfDevices(),
)
],
),
);
}
}
Please help me out by telling me how can I write the available BLE devices under the image as shown in the picture attached
P.S: I am new to Flutter
As the logs show, the error is on line 113. I’m guessing this is caused by the ListView from _buildListViewOfDevices.
First, there is no need to wrap this ListView with SingleChildScrollView, the list view is scrollable already.
Second, instead, wrap the ListView with Expanded. This is tells the ListView to simply take up all remaining screen space in your Column widget.
Set shrinkWrap property of your ListView in _buildListViewOfDevices() function to true. This might work.
You can also remove SingleChildScrollView before the ListView. There is no need for it, ListView is already scrollable.
I have this page I'm trying to design in XD :
and when I ran the application to render in , the bottom side with content containing the tab did not display and I get these errors but I don't know what they exactly mean :
I/flutter (22774): The following RenderObject was being processed when the exception was fired: RenderViewport#cc2f4 NEEDS-LAYOUT
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE: I/flutter (22774): needs
compositing I/flutter (22774): creator: Viewport ←
IgnorePointer-[GlobalKey#1f28b] ← Semantics ← _PointerListener ←
Listener ← I/flutter (22774): _GestureSemantics ←
RawGestureDetector-[LabeledGlobalKey#0f747] ←
I/flutter (22774): _PointerListener ← Listener ← _ScrollableScope
← _ScrollSemantics-[GlobalKey#03bee] ← I/flutter (22774):
RepaintBoundary ← ⋯ I/flutter (22774): parentData: (can use
size) I/flutter (22774): constraints: BoxConstraints(0.0<=w<=360.0,
0.0<=h<=Infinity) I/flutter (22774): size: MISSING I/flutter (22774): axisDirection: left I/flutter (22774):
crossAxisDirection: down I/flutter (22774): offset:
_PagePosition#dd846(offset: null, range: null..null, viewport: null, ScrollableState, I/flutter (22774): _ForceImplicitScrollPhysics ->
PageScrollPhysics -> PageScrollPhysics -> ClampingScrollPhysics ->
I/flutter (22774): ClampingScrollPhysics ->
RangeMaintainingScrollPhysics, IdleScrollActivity#2467d, I/flutter
(22774): ScrollDirection.idle) I/flutter (22774): anchor: 0.0
I/flutter (22774): This RenderObject had the following descendants
(showing up to depth 5): I/flutter (22774): center child:
_RenderSliverFractionalPadding#2da9f NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): child:
RenderSliverFillViewport#a0715 NEEDS-LAYOUT NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774):
════════════════════════════════════════════════════════════════════════════════════════════════════
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: RenderViewport#cc2f4 NEEDS-LAYOUT NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATEI/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderViewport#cc2f4 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderIgnorePointer#d6f43
relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: RenderSemanticsAnnotations#55aed relayoutBoundary=up9
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another
exception was thrown: RenderBox was not laid out:
RenderPointerListener#891d5 relayoutBoundary=up8 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out:
RenderSemanticsGestureHandler#40649 relayoutBoundary=up7 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderPointerListener#0e00a
relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: _RenderScrollSemantics#61006 relayoutBoundary=up5
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another
exception was thrown: RenderBox was not laid out:
RenderRepaintBoundary#782fb relayoutBoundary=up4 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderCustomPaint#3bc15
relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: RenderRepaintBoundary#e1816 relayoutBoundary=up2 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderFlex#20580
relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: NoSuchMethodError:
The method '>' was called on null.
my code is : paybills.dart file (main widget displaying both tabs)
import 'package:flutter/material.dart';
import '../../constans/constants.dart';
import 'first_tab.dart';
import 'second_tab.dart';
class PayBills extends StatefulWidget {
#override
_PayBillsState createState() => _PayBillsState();
}
class _PayBillsState extends State<PayBills>
with SingleTickerProviderStateMixin {
TabController _controller;
#override
void initState() {
super.initState();
_controller = TabController(vsync: this, length: 2);
}
#override
void dispose() {
_controller.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white,
centerTitle: true,
elevation: 0,
title: Text(
'تسديد فاتورة',
style: TextStyle(
color: leaderLogo,
fontSize: 24,
fontFamily: 'Calibri',
),
),
),
body: Container(
child: Column(children: [
Container(
height: 93,
width: 378,
child: Align(
alignment: Alignment.topCenter,
child: TabBar(
controller: _controller,
tabs: [
Tab(
child: Center(
child: Text(
'فواتير مستحقة',
style: TextStyle(
color: Colors.black,
),
),
),
),
Tab(
child: Center(
child: Text(
'فواتير مدفوعة',
style: TextStyle(
color: Colors.black,
),
),
),
),
],
),
),
),
TabBarView(
controller: _controller,
children: [
PayBillsList(),
SecondTab(),
],
),
]),
),
);
}
}
and this is firsttab.dart file displaying the first tab :
import 'package:flutter/material.dart';
import '../../constans/constants.dart';
class BillDetails extends StatelessWidget {
final String billName;
final String billImage;
final String billDate;
const BillDetails({Key key, this.billName, this.billImage, this.billDate})
: super(key: key);
#override
Widget build(BuildContext context) {
return Card(
child: ListTile(
leading: Container(
width: 40,
height: 40,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(billImage),
fit: BoxFit.fill,
)),
),
title: Text(
billName,
style: TextStyle(
fontFamily: 'Calibri',
fontSize: 16,
color: Colors.black,
),
),
subtitle: Text(
billDate,
style: TextStyle(
fontFamily: 'Calibri',
fontSize: 12,
color: Colors.black,
),
),
trailing: PayButton(),
),
);
}
}
class PayBillsList extends StatelessWidget {
final List<BillDetails> billsList = [
BillDetails(
billName: 'فاتورة كهرباء',
billImage: 'assets/images/electricity.png',
billDate: '30 / 4 / 2020',
),
BillDetails(
billName: 'فاتورة مياه',
billImage: 'assets/images/water.png',
billDate: '30 / 4 / 2020',
),
];
#override
Widget build(BuildContext context) {
return Container(
width: 378,
height: 93,
decoration: BoxDecoration(
border: Border.all(
width: 1,
color: Colors.grey,
),
shape: BoxShape.circle,
),
child: ListView.builder(
itemBuilder: (context, index) {
return BillDetails(
billName: billsList.elementAt(index).billName,
billImage: billsList.elementAt(index).billImage,
billDate: billsList.elementAt(index).billDate,
);
},
shrinkWrap: true,
itemCount: billsList.length,
scrollDirection: Axis.vertical,
),
);
}
}
class PayButton extends StatelessWidget {
const PayButton({
Key key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return ButtonTheme(
minWidth: 80,
height: 40,
child: RaisedButton(
onPressed: () {},
color: raisedButtonColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0),
),
child: Center(
child: Text(
//Login button text properties
'دفع',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontFamily: 'Calibri',
)),
),
),
);
}
}
When I running the code I find this error in the DEBUG Console as the below shown error:
Restarted application in 2,804ms.
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
[38;5;244mThe following assertion was thrown during performLayout():[39;49m
Leading widget consumes entire tile width. Please use a sized widget.
'package:flutter/src/material/list_tile.dart':
Failed assertion: line 1353 pos 7: 'tileWidth != leadingSize.width'
[38;5;248mEither the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
https://github.com/flutter/flutter/issues/new?template=BUG.md
[39;49m
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;244mWhen the exception was thrown, this was the stack[39;49m
[38;5;244m#2 _RenderListTile.performLayout[39;49m
[38;5;244m#3 RenderObject.layout[39;49m
[38;5;244m#4 RenderPadding.performLayout[39;49m
[38;5;244m#5 RenderObject.layout[39;49m
[38;5;244m#6 RenderProxyBoxMixin.performLayout[39;49m
[38;5;244m...[39;49m
[38;5;244mThe following RenderObject was being processed when the exception was fired: _RenderListTile#a7a4d relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mRenderObject: _RenderListTile#a7a4d relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: offset=Offset(0.0, 0.0) (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=Infinity)[39;49m
[38;5;244msize: MISSING[39;49m
[38;5;244mtitle: RenderParagraph#47706 NEEDS-LAYOUT NEEDS-PAINT[39;49m
[38;5;244mparentData: offset=Offset(0.0, 0.0)[39;49m
[38;5;244mconstraints: MISSING[39;49m
[38;5;244msize: MISSING[39;49m
[38;5;244mtextAlign: left[39;49m
[38;5;244mtextDirection: ltr[39;49m
[38;5;244msoftWrap: wrapping at box width[39;49m
[38;5;244moverflow: clip[39;49m
[38;5;244mlocale: en_US[39;49m
[38;5;244mmaxLines: unlimited[39;49m
[38;5;244mtext: TextSpan[39;49m
[38;5;244mdebugLabel: (((englishLike subhead 2014).merge(blackCupertino subtitle1)).copyWith).merge(unknown)[39;49m
[38;5;244minherit: false[39;49m
[38;5;244mcolor: MaterialColor(primary value: Color(0xff03a9f4))[39;49m
[38;5;244mfamily: WorkSans[39;49m
[38;5;244msize: 16.0[39;49m
[38;5;244mweight: 600[39;49m
[38;5;244mbaseline: alphabetic[39;49m
[38;5;244mdecoration: TextDecoration.none[39;49m
[38;5;244m"Sign Out"[39;49m
[38;5;244mtrailing: RenderSemanticsAnnotations#705a3 relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: offset=Offset(0.0, 0.0) (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=56.0)[39;49m
[38;5;244msize: Size(0.0, 24.0)[39;49m
[38;5;244mchild: RenderExcludeSemantics#60a3d relayoutBoundary=up11 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: <none> (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=56.0)[39;49m
[38;5;244msize: Size(0.0, 24.0)[39;49m
[38;5;244mexcluding: true[39;49m
[38;5;244mchild: RenderConstrainedBox#bc3b1 relayoutBoundary=up12 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: <none> (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=56.0)[39;49m
[38;5;244msize: Size(0.0, 24.0)[39;49m
[38;5;244madditionalConstraints: BoxConstraints(w=24.0, h=24.0)[39;49m
[38;5;244mchild: RenderPositionedBox#c7d80 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: <none> (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=0.0, h=24.0)[39;49m
[38;5;244msize: Size(0.0, 24.0)[39;49m
[38;5;244malignment: center[39;49m
[38;5;244mtextDirection: ltr[39;49m
[38;5;244mwidthFactor: expand[39;49m
[38;5;244mheightFactor: expand[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: _RenderListTile#a7a4d relayoutBoundary=up9 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderPadding#0b562 relayoutBoundary=up8 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsAnnotations#7c546 relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderPointerListener#6507d relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsGestureHandler#d89dc relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderMouseRegion#b5666 relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsAnnotations#ace43 relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mColumn[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderFlex#4e86c relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mContainer[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: _RenderColoredBox#3fe26 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mColumn[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderFlex#48686 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
[38;5;248mScaffold[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
and this is my full code:
import 'package:flutter/rendering.dart';
import '../providers/properties.dart';
import '../providers/cities.dart';
import '../providers/property.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../widgets/properties_grid.dart';
import '../app_theme.dart';
class MyHomePage extends StatefulWidget {
const MyHomePage({Key key}) : super(key: key);
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
int currentTab = 0;
ScrollController _scrollController = ScrollController();
bool _showBottomBar = true;
_scrollListener() {
if (_scrollController.position.userScrollDirection ==
ScrollDirection.reverse) {
setState(() {
_showBottomBar = false;
});
} else if (_scrollController.position.userScrollDirection ==
ScrollDirection.forward) {
setState(() {
_showBottomBar = true;
});
}
}
var _showOnlyFavorites = false;
AnimationController animationController;
bool multiple = true;
#override
void initState() {
animationController = AnimationController(
duration: const Duration(milliseconds: 2000), vsync: this);
_scrollController.addListener(_scrollListener);
super.initState();
}
Future<bool> getData() async {
await Future<dynamic>.delayed(const Duration(milliseconds: 0));
return true;
}
#override
void dispose() {
animationController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
// final properties = Provider.of<Properties>(context, listen: false);
return Scaffold(
resizeToAvoidBottomPadding: false,
extendBody: true,
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {},
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
bottomNavigationBar: AnimatedContainer(
duration: Duration(milliseconds: 500),
child: _showBottomBar
? BottomAppBar(
elevation: 0,
shape: CircularNotchedRectangle(),
notchMargin: 10,
child: Container(
height: 60,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
MaterialButton(
padding: EdgeInsets.all(0),
minWidth: 155,
onPressed: () {
setState(() {
// currentScreen =
// Chat(); // if user taps on this dashboard tab will be active
currentTab = 1;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.home,
color: currentTab == 1
? Colors.blue
: Colors.grey,
),
Text(
'Home',
style: TextStyle(
color: currentTab == 1
? Colors.blue
: Colors.grey,
),
),
],
),
)
],
),
// Right Tab bar icons
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
MaterialButton(
padding: EdgeInsets.all(0),
minWidth: 60,
onPressed: () {
setState(() {
// currentScreen =
// Settings(); // if user taps on this dashboard tab will be active
currentTab = 3;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.view_list,
color: currentTab == 3
? Colors.blue
: Colors.grey,
),
Text(
'Property List',
style: TextStyle(
color: currentTab == 3
? Colors.blue
: Colors.grey,
),
),
],
),
),
MaterialButton(
padding: EdgeInsets.all(0),
minWidth: 77,
onPressed: () {
setState(() {
// currentScreen =
// Settings(); // if user taps on this dashboard tab will be active
currentTab = 4;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.location_searching,
color: currentTab == 4
? Colors.blue
: Colors.grey,
),
Text(
'Map',
style: TextStyle(
color: currentTab == 4
? Colors.blue
: Colors.grey,
),
),
],
),
),
],
)
],
),
),
)
: Container(
color: Colors.white,
width: MediaQuery.of(context).size.width,
),
),
backgroundColor: AppTheme.white,
body: Stack(
children: <Widget>[
FutureBuilder<bool>(
future: getData(),
builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
if (!snapshot.hasData) {
return const SizedBox();
} else {
return Padding(
padding:
EdgeInsets.only(top: MediaQuery.of(context).padding.top),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
appBar(),
Expanded(
child: FutureBuilder<bool>(
future: getData(),
builder: (BuildContext context,
AsyncSnapshot<bool> snapshot) {
if (!snapshot.hasData) {
return const SizedBox();
} else {
return ChangeNotifierProvider(
create: (context) => Properties(),
child: PropertiesGrid(_showOnlyFavorites),
);
}
},
),
),
],
),
);
}
},
),
],
),
);
}
Widget appBar() {
return SizedBox(
height: AppBar().preferredSize.height,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(top: 8, left: 8),
child: Container(
width: AppBar().preferredSize.height - 8,
height: AppBar().preferredSize.height - 8,
),
),
Expanded(
child: Center(
child: Padding(
padding: const EdgeInsets.only(top: 4),
child:
Image.asset('assets/images/logo.png', fit: BoxFit.contain),
),
),
),
Padding(
padding: const EdgeInsets.only(top: 8, right: 8),
child: Container(
width: AppBar().preferredSize.height - 8,
height: AppBar().preferredSize.height - 8,
color: Colors.white,
child: Material(
color: Colors.transparent,
child: InkWell(
borderRadius:
BorderRadius.circular(AppBar().preferredSize.height),
child: Icon(
Icons.location_on,
color: AppTheme.dark_grey,
),
onTap: () {
setState(() {
multiple = !multiple;
});
},
),
),
),
),
],
),
);
}
}
I hope some one could figure with me this problem and how to solve it :)...
May be I think that there's a problem with the height of the SizedBox as in this question Flutter: RenderBox was not laid out, but I tried to add the height I found the same problem...
It looks like you put your appBar() in a column. That should be in the appBar property of the Scaffold widget.
You need to use the AppBar() Widget in the Scaffold.
Scaffold(
appBar: AppBar(
title: Text('Put Screen title here'),
actions: <Widget>[IconButton(
icon: Icons.location_on,
onPressed: () {
setState(() {
multiple = !multiple;
});
}),
],
),
),
You are setting height and width of the appBar manually but you are fighting the Flutter framework by doing so.