質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

Q&A

解決済

1回答

2496閲覧

setStateで更新されない問題の解消

yshags

総合スコア3

Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

0グッド

0クリップ

投稿2022/09/27 15:42

前提

一番上のTextFieldで入力したものをElevatedButtonを押した時にListViewで表示したいです。
setStateの上までは作動していることが確認できているのでsetStateがおかしいのだと思いますが解決方法がわかりません。。

実現したいこと

ここに実現したいことを箇条書きで書いてください。

  • setStateを動作させてリストを作成できるようにする

該当のソースコード

Flutter

1import 'package:flutter/material.dart'; 2 3class MyScreen extends StatelessWidget { 4 const MyScreen({Key? key}) : super(key: key); 5 6 @override 7 Widget build(BuildContext context) { 8 return Scaffold( 9 floatingActionButton: FloatingActionButton( 10 onPressed: () { 11 Navigator.push( 12 context, 13 MaterialPageRoute(builder: (context) => AddList()), 14 ); 15 }, 16 child: Icon(Icons.add)), 17 ); 18 } 19} 20 21class AddList extends StatefulWidget { 22 const AddList({Key? key}) : super(key: key); 23 24 @override 25 State<AddList> createState() => _AddListState(); 26} 27 28class _AddListState extends State<AddList> { 29 Widget build(BuildContext context) { 30 String subsubjectName = ""; 31 String subQuestion = ""; 32 String subAnswer = ""; 33 List<String> subjectName = []; 34 List<String> Question = []; 35 List<String> Answer = []; 36 37 return Scaffold( 38 appBar: AppBar(), 39 body: ListView( 40 children: [ 41 TextField( 42 maxLines: 1, 43 decoration: InputDecoration( 44 icon: Icon(Icons.book_sharp), 45 labelText: 'First', 46 ), 47 onSubmitted: (text) { 48 subsubjectName = text; 49 }, 50 ), 51 TextField( 52 decoration: InputDecoration( 53 icon: Icon(Icons.edit), 54 labelText: 'Second', 55 ), 56 onSubmitted: (text) { 57 subQuestion = text; 58 }, 59 ), 60 TextField( 61 decoration: InputDecoration( 62 icon: Icon(Icons.task_alt), 63 labelText: 'third', 64 ), 65 onSubmitted: (text) { 66 subAnswer = text; 67 }, 68 ), 69 ElevatedButton( 70 child: Text('登録'), 71 onPressed: () { 72 Navigator.of(context).pop(); 73 subjectName.add(subsubjectName); 74 Answer.add(subAnswer); 75 Question.add(subQuestion); 76 setState(() { 77 ListView.builder( 78 itemCount: subjectName.length, 79 itemBuilder: (BuildContext context, int index3) { 80 return Column( 81 children: [ 82 ListTile( 83 leading: Icon(Icons.edit), 84 title: Text(subjectName[index3]), 85 ), 86 ], 87 ); 88 }); 89 }); 90 }, 91 ), 92 ], 93 ), 94 ); 95 } 96}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

まず、どのようなウィジェット(UI)構成にしたいのかまとめたほうが良いです。
ソースコードを見る限りこんな感じなのかな。

  1. MyScreen-Scaffold-FloatingActionButton(ここを押されたら2のページに遷移)
  2. AddList-Scaffold-AppBar/ListView-TextField*3/ElevatedButton(ここを押されたら1のページに戻るとともに3を作ってる)
  3. ListView

更新対象としたいのは3のListView何だと思う。
ただこのListViewは単独で存在しかつルートに紐づけされていないようなので、単純に作っただけという状態。
またその前にNavigator.of(context).pop();で1のページに戻そうとしている。

多分以下の様な構成にしたいのかな?(以下からは想像)

  1. MyScreen-Scaffold-ListView(*)/FloatingActionButton(ここを押されたら2のページに遷移)
  2. AddList-Scaffold-AppBar/ListView-TextField*3/ElevatedButton(ここを押されたら1のページに戻るとともに3を作ってる)

前の3のListViewは本当は1のbodyあたりに配置したかったのかもと想像。(*を付けたListView)
2のページで設定した情報をそのListViewに表示したいという感じなんだろうか。

そうすると以下の様な実装ん変更になるのだろうか。

  1. MyScreen側にListViewに表示するための変数を用意する。
  2. AddList側のpopで追加する情報をMyScreenに渡すためのAPIを使う。
  3. AddListから戻ったら、渡された情報を変数に渡しsetStateする。

ページ間でのデータ受け渡しに関しては、以下のページを参考にしたらどうでしょうか。

https://docs.flutter.dev/cookbook/navigation/returning-data

投稿2022/09/27 23:42

ta.fu

総合スコア1664

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問