我是flutter的新手,只是学习了如何从firestore中检索数据并做了一些UI。现在我有两个问题;
1-这是一个设置页面,其中CustomScrollView
包含ScrollController
用于控制器。
控制器与此代码配合正常
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,
),
),
],
),
),
),
],
),
),
],
),
),
],
),
],
),
);
},
);
}
}
但是发生了此错误
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-经过对该错误的研究,我在connectionState
内添加了StreamBuilder
条件,解决了上述问题
这是新代码,我将Scaffold
放入了活动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')
],
),
);
}
},
);
}
}
我意识到,当我滚动时,connectionState将变为等待状态,并且ScrollController在此状态下无法正常工作,如下图所示
ScrollController: page keep flashing when try to scroll
我想使用ScrollController
的原因是因为我想在FloatingActionButton
内添加Positioned
,当到达某个位置时它将滚动并消失,这就是图像with FloatingActionButton