質問編集履歴

1

ご指摘をいただき、コードをフルで載せました。もともとのコードでは正しく動作するのですが、該当のコードではグルグル画面のままで遷移しません。文字数の関係で多少コードは削除してます

2022/12/26 07:19

投稿

matsudesuyo
matsudesuyo

スコア4

test CHANGED
File without changes
test CHANGED
@@ -3,8 +3,6 @@
3
3
  flutterのproviderをriverpodで置き換えようと思ったが、
4
4
  CircularProgressIndicatorのグルグル画面のままで遷移しなくなった。
5
5
 
6
-
7
-
8
6
  ### 実現したいこと
9
7
 
10
8
  このグルグルから遷移しない状態を解消してリスト表示に遷移したいが、どの記述を直せばいいのかわからないので教えて欲しいです。
@@ -12,8 +10,37 @@
12
10
 
13
11
  ### 該当のソースコード
14
12
 
15
- ```dart
13
+ ```forth_page.dart
14
+
15
+ class ForthPage extends StatelessWidget {
16
+ ForthPage({Key? key}) : super(key: key);
17
+ //更新をsnackbarに通知したい時に必要
18
+ final GlobalKey<ScaffoldMessengerState> _scaffoldKey =
19
+ GlobalKey<ScaffoldMessengerState>();
20
+
21
+ @override
22
+ Widget build(BuildContext context) {
23
+ return ScaffoldMessenger(
24
+ key: _scaffoldKey,
25
+ child: Scaffold(
26
+ appBar: AppBar(
27
+ backgroundColor: Color.fromARGB(255, 236, 124, 5),
28
+ title: const Text(
29
+ 'Forth',
30
+ style: TextStyle(
31
+ fontWeight: FontWeight.bold,
32
+ ),
33
+ ),
34
+ actions: [
35
+ Icon(Icons.laptop_chromebook),
36
+ SizedBox(width: 24),
37
+ Icon(Icons.search),
38
+ SizedBox(width: 24),
39
+ Icon(Icons.menu),
40
+ SizedBox(width: 24),
41
+ ],
42
+ ),
16
- body: Center(
43
+ body: Center(
17
44
  child: Consumer(builder: (context, ref, child) {
18
45
  final ForthpageModel forthpageModel = ref.watch(forthpageProvider);
19
46
  final List<Book>? books = forthpageModel.books;
@@ -29,11 +56,131 @@
29
56
  title: Text(book.title),
30
57
  subtitle: Text(book.author),
31
58
  ),
59
+ endActionPane: ActionPane(
60
+ motion: ScrollMotion(),
61
+ children: [
62
+ SlidableAction(
63
+ // An action can be bigger than the others.
64
+ label: '編集',
65
+ flex: 1,
66
+ onPressed: (BuildContext context) async {
67
+ final bool? added = await Navigator.push(
68
+ context,
69
+ MaterialPageRoute(
70
+ builder: (context) => EditBookPage(book),
71
+ //編集画面でタイトルと著者を最初から残したいから引数book
72
+ ),
73
+ );
74
+ if (added != null && added) {
75
+ final snackBar = SnackBar(
76
+ backgroundColor:
77
+ Color.fromARGB(255, 93, 246, 111),
78
+ content: Text('本を更新しました'),
79
+ );
80
+ _scaffoldKey.currentState?.showSnackBar(snackBar);
81
+ }
82
+ },
83
+ backgroundColor: Color.fromARGB(255, 126, 126, 126),
84
+ foregroundColor: Colors.white,
85
+ icon: Icons.edit,
86
+ ),
87
+ SlidableAction(
88
+ label: '削除',
89
+ onPressed: (BuildContext context) async {
90
+ await showMyDialog(context, book, forthpageModel);
91
+ },
92
+ backgroundColor: Color.fromARGB(255, 211, 63, 63),
93
+ foregroundColor: Colors.white,
94
+ icon: Icons.delete,
95
+ ),
96
+ ],
97
+ ),
98
+ ),
99
+ )
100
+ .toList();
101
+ return ListView(
102
+ children: widgets,
103
+ );
104
+ }),
105
+ ),
106
+ ),
107
+ );
108
+ }
109
+
110
+ ```
111
+ ```forth_model.dart
112
+
113
+ final forthpageProvider = ChangeNotifierProvider(
114
+ (ref) => ForthpageModel()
115
+ );
116
+
117
+
118
+ //firebaseの値をとってくるページ
119
+ class ForthpageModel extends ChangeNotifier {
120
+ User? currentUser = null;
121
+
122
+ void setCurrentUser() {
123
+ currentUser = FirebaseAuth.instance.currentUser;
124
+ notifyListeners();
125
+ }
126
+
127
+ final Stream<QuerySnapshot> _usersStream =
128
+ FirebaseFirestore.instance.collection('books').snapshots();
129
+
130
+ List<Book>? books;
131
+
132
+ void fetchBooklist() {
133
+ _usersStream.listen((QuerySnapshot snapshot) {
134
+ final List<Book> books = snapshot.docs.map((DocumentSnapshot document) {
135
+ Map<String, dynamic> data = document.data()! as Map<String, dynamic>;
136
+ final String id = document.id; //idはランダムに割り振っているのでこれが必要
137
+ final String title = data['title'];
138
+ final String author = data['author'];
139
+ final String? imgURL = data['imgURL'];
140
+
141
+ return Book(id, title, author, imgURL);
142
+ }).toList();
143
+
144
+ this.books = books;
145
+ notifyListeners();
146
+ });
147
+ }
32
148
 
33
149
  ```
34
150
  ### もともとのコード
35
- ```dart
151
+ ```forth_page.dart
152
+
153
+ class ForthPage extends StatelessWidget {
154
+ ForthPage({Key? key}) : super(key: key);
155
+ //更新をsnackbarに通知したい時に必要
156
+ final GlobalKey<ScaffoldMessengerState> _scaffoldKey =
157
+ GlobalKey<ScaffoldMessengerState>();
158
+
159
+ @override
160
+ Widget build(BuildContext context) {
161
+ return ChangeNotifierProvider<ForthpageModel>(
162
+ create: (_) => ForthpageModel()..fetchBooklist(),
163
+ child: ScaffoldMessenger(
164
+ key: _scaffoldKey,
165
+ child: Scaffold(
166
+ appBar: AppBar(
167
+ backgroundColor: Color.fromARGB(255, 236, 124, 5),
168
+ title: const Text(
169
+ 'Forth',
170
+ style: TextStyle(
171
+ fontWeight: FontWeight.bold,
172
+ ),
173
+ ),
174
+ actions: [
175
+ Icon(Icons.laptop_chromebook),
176
+ SizedBox(width: 24),
177
+ Icon(Icons.search),
178
+ SizedBox(width: 24),
179
+ Icon(Icons.menu),
180
+ SizedBox(width: 24),
181
+ ],
182
+ ),
36
- body: Center(
183
+ body: Center(
37
184
  child: Consumer<ForthpageModel>(builder: (context, model, child) {
38
185
  final List<Book>? books = model.books;
39
186
 
@@ -48,9 +195,78 @@
48
195
  title: Text(book.title),
49
196
  subtitle: Text(book.author),
50
197
  ),
198
+ endActionPane: ActionPane(
199
+ motion: ScrollMotion(),
200
+ children: [
201
+ SlidableAction(
202
+ // An action can be bigger than the others.
203
+ label: '編集',
204
+ flex: 1,
205
+ onPressed: (BuildContext context) async {
206
+ final bool? added = await Navigator.push(
207
+ context,
208
+ MaterialPageRoute(
209
+ builder: (context) => EditBookPage(book),
210
+ //編集画面でタイトルと著者を最初から残したいから引数book
211
+ ),
212
+ );
213
+ if (added != null && added) {
214
+ final snackBar = SnackBar(
215
+ backgroundColor:
216
+ Color.fromARGB(255, 93, 246, 111),
217
+ content: Text('本を更新しました'),
218
+ );
219
+ _scaffoldKey.currentState
220
+ ?.showSnackBar(snackBar);
221
+ }
222
+ },
223
+ backgroundColor: Color.fromARGB(255, 126, 126, 126),
224
+ foregroundColor: Colors.white,
225
+ icon: Icons.edit,
226
+ ),
227
+ SlidableAction(
228
+ label: '削除',
229
+ onPressed: (BuildContext context) async {
230
+ await showMyDialog(context, book, model);
231
+ },
232
+ backgroundColor: Color.fromARGB(255, 211, 63, 63),
233
+ foregroundColor: Colors.white,
234
+ icon: Icons.delete,
235
+ ),
236
+ ],
237
+ ),
238
+ ),
239
+ )
240
+ .toList();
241
+ return ListView(
242
+ children: widgets,
243
+ );
244
+ }),
245
+ ),
246
+ ),
247
+ );
248
+ }
51
- ```
249
+ ```
52
-
250
+ ```forth_model.dart
251
+
53
-
252
+ class ForthpageModel extends ChangeNotifier {
54
-
253
+ final Stream<QuerySnapshot> _usersStream =
55
-
254
+ FirebaseFirestore.instance.collection('books').snapshots();
255
+
56
-
256
+ List<Book>? books;
257
+
258
+ void fetchBooklist() {
259
+ _usersStream.listen((QuerySnapshot snapshot) {
260
+ final List<Book> books = snapshot.docs.map((DocumentSnapshot document) {
261
+ Map<String, dynamic> data = document.data()! as Map<String, dynamic>;
262
+ final String id = document.id; //idはランダムに割り振っているのでこれが必要
263
+ final String title = data['title'];
264
+ final String author = data['author'];
265
+ return Book(id, title, author);
266
+ }).toList();
267
+
268
+ this.books = books;
269
+ notifyListeners();
270
+ });
271
+ }
272
+ ```