現在つぶやき一覧画面を作っています。
「みんな」と「キャストスタッフ」の2つにタブ分けをしています。
右上の「新規投稿」を押すと別の画面に飛んで、そこからつぶやきを作成でき、投稿ボタンを押したらNavigator.pop(context)で再度この画面に戻ってくるのですが、つぶやき一覧が古いままなのでリロードさせたいのが今回の目的です。
以下のコードが、つぶやき一覧画面です。
appbarは別クラスで作っています。
▼アプリバーの新規投稿ボタン
dart
1FlatButton( 2 child: Text('新規投稿', style: TextStyle(color: Colors.white)), 3 onPressed: () async { 4 await Navigator.push( 5 context, MaterialPageRoute(builder: (context) => NewTweet())); 6 final tweetTop = widget.bodyKey as AllTweetState; 7 if (tweetTop != null) tweetTop.updateTweetList(); 8 }, 9 )
▼アプリバーより下のコンテンツ
class TweetTop extends StatefulWidget { TweetTop({Key key}) : super(key: key); @override TweetTopState createState() => TweetTopState(); } class TweetTopState extends State<TweetTop> with SingleTickerProviderStateMixin { bool _alreadyDisposed = false; List<Tab> tabList = List(); TabController _tabController; @override void initState() { super.initState(); tabList.add(Tab( text: 'みんなのつぶやき', )); tabList.add(Tab( text: 'キャストのつぶやき', )); _tabController = TabController(vsync: this, length: tabList.length); } @override void didChangeDependencies() { super.didChangeDependencies(); } @override void setState(Function fn) { if (_alreadyDisposed) return; super.setState(fn); } @override void dispose() { _alreadyDisposed = true; super.dispose(); } @override Widget build(BuildContext context) { final bodyHeight = MediaQuery.of(context).size.height - Settings().appBarHeight() - 50; return Column( children: [ Container( height: 50, child: Container( decoration: BoxDecoration(color: Theme.of(context).primaryColor), child: TabBar( controller: _tabController, indicatorColor: Colors.pink, indicatorSize: TabBarIndicatorSize.tab, labelStyle: TextStyle(fontSize: 12), tabs: tabList), ), ), Container( height: bodyHeight - kToolbarHeight, color: Colors.grey[300], child: TabBarView( controller: _tabController, children: tabList.map((Tab tab) { return _getPage(tab); }).toList(), ), ) ], ); } //タブを生成 Widget _getPage(Tab tab) { switch (tab.text) { case 'みんなのつぶやき': return AllTweet(); case 'キャストのつぶやき': return AllTweet(); //いまは同じクラスを呼び出し default: return Container(); } } } //============================= //みんなのつぶやき //============================= class AllTweet extends StatefulWidget { AllTweet({Key key}) : super(key: key); @override AllTweetState createState() => AllTweetState(); } class AllTweetState extends State<AllTweet> with SingleTickerProviderStateMixin { bool _alreadyDisposed = false; final _tweetListItems = List<TweetInfo>(); final _tweetInfoMap = Map<int, TweetInfo>(); String _today; @override void initState() { super.initState(); final today = DateTime.now(); _today = '${today.year.toString()}-${today.month.toString().padLeft(2, "0")}-${today.day.toString().padLeft(2, "0")}'; updateTweetList(); } @override void didChangeDependencies() { super.didChangeDependencies(); } @override void setState(Function fn) { if (_alreadyDisposed) return; super.setState(fn); } @override void dispose() { _alreadyDisposed = true; super.dispose(); } @override Widget build(BuildContext context) { return Scaffold( body: RefreshIndicator( onRefresh: () async { await updateTweetList(); }, child: Scrollbar( child: (_tweetListItems != null && _tweetListItems.length > 0) ? ListView.builder( physics: AlwaysScrollableScrollPhysics(), itemCount: _tweetListItems.length, itemBuilder: (context, index) { return TweetItem( _tweetListItems[index], // () => _updateOnlyLikeIt(), _tweetListItems[index].likedCount, _tweetListItems[index] .myLiked .contains(Settings().myId())); }) : Container()))); } Future<void> updateTweetList() async { final completer = Completer<void>(); await _getTweet().then((result) { print("result!"); print(_tweetListItems[0].id); }); completer.complete(); return completer.future; } Future<Map<String, dynamic>> _getTweet() { print("_getTweetスタート!"); final completer = Completer<Map<String, dynamic>>(); final firestore = fb.firestore(Settings().app); final colRef = firestore.collection('tweets/').orderBy('updated_at', 'desc'); final onSnapshot = colRef.onSnapshot; TweetList tweetList; List<dynamic> list = []; // TweetInfo map; onSnapshot.listen((querySnapshot) { print(querySnapshot.docChanges()); print(tweetList); querySnapshot.docChanges().forEach((docChange) { final data = docChange.doc.data(); list.add(data); }); tweetList = TweetList.fromJson(_today, list); _tweetListItems.clear(); _tweetInfoMap.clear(); tweetList.list.forEach((row) { _tweetListItems.add(row); _tweetInfoMap[row.id] = row; if ((row.iconUrl ?? "") != "") { PhotoStorage.getStorageUrl(row.iconUrl).then((url) { setState(() => row.iconUrl = url); }); } if ((row.contentsImgURL ?? "") != "") { PhotoStorage.getStorageUrl(row.contentsImgURL).then((url2) { setState(() => row.contentsImgUrl = url2); }); } }); }); colRef.get().then((snapshot) { if (snapshot.docs.length == 0) { completer.complete(null); } else { completer.complete(snapshot.docs.first.data()); } }).catchError((e) { debugPrint("Error getting document: $e"); completer.complete(null); }); return completer.future; } } //キャスト専用のつぶやきクラスは未作成
そして以下がつぶやき投稿画面の投稿ボタンです。
▼新規投稿画面の「投稿ボタン」
dart
1RaisedButton( 2 child: Center( 3 child: Text("投稿する", 4 style: TextStyle( 5 fontSize: 15.0, 6 color: Colors.white, 7 ))), 8 color: myTheme.accentColor, 9 onPressed: () async { 10 final result = await _sendNewTweet(context); //データ送信です。ここは成功を確認しています。 11 if (result ?? false) Navigator.pop(context); 12 }) 13
ざっくりまとめますと、↓のアプリバーの「新規投稿ボタン」から、
dart
1FlatButton( 2 child: Text('新規投稿', style: TextStyle(color: Colors.white)), 3 onPressed: () async { 4 await Navigator.push( 5 context, MaterialPageRoute(builder: (context) => NewTweet())); 6 final tweetTop = widget.bodyKey as AllTweetState; 7 if (tweetTop != null) tweetTop.updateTweetList(); 8 }, 9 )
新規等画面へ遷移し、その中にある↓の投稿ボタンを押してNavigator.popして、
dart
1onPressed: () async { 2 final result = await _sendNewTweet(context); 3 if (result ?? false) Navigator.pop(context); 4}))
元の画面に戻ります。こちらの想定では戻ったら、アプリバーの「新規投稿」のボタン挙動にある↓のコードの通り
dart
1onPressed: () async { 2 await Navigator.push( 3 context, MaterialPageRoute(builder: (context) => NewTweet())); 4 final tweetTop = widget.bodyKey as AllTweetState; 5 if (tweetTop != null) tweetTop.updateTweetList(); 6 },
updateTweetListを予約作動させてリロードできるかな?と思ったのですが、ダメでした。タブ分けしているのが特殊なケースだから?か読み込んでくれません。
この場合、どのように画面をリロードできるでしょうか?ヒントだけでもご教授いただければ嬉しいです。
よろしくお願いします。
あなたの回答
tips
プレビュー