teratail
回答率
85.47%
質問するログイン新規登録
トップFirebaseに関する質問Firebase authでのログイン状態の保持を実装したいです。

編集履歴

質問編集履歴

2

参考サイト修正、画像追加

2023/02/06 01:16

投稿

kj0221
kj0221

スコア0

test CHANGED
File without changes
test CHANGED
@@ -3,13 +3,13 @@
3
3
  ログイン済みの場合はログイン後の画面(signed_in_screen)、ログインしていない場合はログイン前の画面(community _screen)の画面を表示したいのですがコーディングを教えてください。
4
4
 
5
5
  main.dart
6
- ```ここに言語を入力
6
+ ```
7
7
  import 'package:firebase_core/firebase_core.dart';
8
8
  import 'package:flutter/material.dart';
9
9
  import 'package:kaisupo/screens/home_screen.dart';
10
10
  import 'package:kaisupo/firebase_options.dart';
11
11
 
12
- void main() async {
12
+ Future<void> main() async {
13
13
  //main関数を非同期処理にするときに必ず必要になる
14
14
  WidgetsFlutterBinding.ensureInitialized();
15
15
  //Firebase初期化
@@ -32,11 +32,12 @@
32
32
  );
33
33
  }
34
34
  }
35
+
35
36
  ```
36
37
 
37
38
 
38
39
  kaisupo/screens/community_screen.dart
39
- ```ここに言語を入力
40
+ ```
40
41
  import 'package:firebase_auth/firebase_auth.dart';
41
42
  import 'package:kaisupo/screens/signed_in_screen.dart';
42
43
  import 'package:flutter/material.dart';
@@ -44,6 +45,8 @@
44
45
  import 'package:kaisupo/parts/bottom_navigation_bar.dart';
45
46
  import 'package:kaisupo/parts/title_text.dart';
46
47
 
48
+ //介護士コミュニティ
49
+
47
50
  class CommunityScreen extends StatefulWidget {
48
51
  @override
49
52
  _CommunityScreenState createState() => _CommunityScreenState();
@@ -62,80 +65,102 @@
62
65
  }
63
66
 
64
67
  @override
65
- Widget build(BuildContext context) {
68
+ Widget build(BuildContext context) => MaterialApp(
66
- return Scaffold(
69
+ home: Scaffold(
67
- appBar: PreferredSize(
70
+ appBar: PreferredSize(
68
- preferredSize: const Size.fromHeight(60.0),
71
+ preferredSize: const Size.fromHeight(60.0),
69
- child: AppBar(
72
+ child: AppBar(
70
- title: TitleTextCreate(
73
+ title: TitleTextCreate(
71
- title: "***",
74
+ title: "介護士コミュニティ",
72
- size: 30,
75
+ size: 30,
73
- color: Colors.white,
76
+ color: Colors.white,
74
- radius: 18,
77
+ radius: 18,
75
- shadow: Colors.indigo),
78
+ shadow: Colors.indigo),
76
- centerTitle: true,
79
+ centerTitle: true,
77
- backgroundColor: Colors.lightGreen.shade400,
80
+ backgroundColor: Colors.lightGreen.shade400,
78
- ),
79
- ),
80
- //BottomNavigationBarセット
81
- bottomNavigationBar: BottomNavigationBarSet(
82
- currentTab: _currentTab,
83
- onSelectedTab: _selectedTab,
84
- ),
85
- body: Form(
86
- key: _formKey,
87
- child: Stack(children: [
88
- //背景グラデーション
89
- BackGroundDecoration(
90
- first: Colors.deepOrangeAccent.shade200,
91
- second: Colors.amber.shade300,
92
- third: Colors.yellow.shade200),
93
- Column(mainAxisAlignment: MainAxisAlignment.center, children: [
94
- TextFormField(
95
- controller: _emailController,
96
- decoration: InputDecoration(labelText: 'メールアドレス'),
97
- keyboardType: TextInputType.emailAddress,
98
- validator: (String? value) {
99
- if (value?.isEmpty == true) {
100
- return 'メールアドレスを入力して下さい';
101
- }
102
- return null;
103
- },
104
81
  ),
82
+ ),
83
+ //BottomNavigationBarセット
84
+ bottomNavigationBar: BottomNavigationBarSet(
85
+ currentTab: _currentTab,
105
- SizedBox(height: 8),
86
+ onSelectedTab: _selectedTab,
87
+ ),
88
+ body: SafeArea(
106
- TextFormField(
89
+ key: _formKey,
90
+ child: Stack(children: [
91
+ //背景グラデーション
92
+ BackGroundDecoration(
93
+ first: Colors.deepOrangeAccent.shade200,
107
- controller: _passwordController,
94
+ second: Colors.amber.shade300,
108
- decoration: InputDecoration(labelText: 'パスワード'),
95
+ third: Colors.yellow.shade200),
96
+ StreamBuilder<User?>(
109
- keyboardType: TextInputType.visiblePassword,
97
+ stream: FirebaseAuth.instance.authStateChanges(),
110
- obscureText: true,
111
- validator: (String? value) {
98
+ builder: (context, snapshot) {
112
- if (value?.isEmpty == true) {
99
+ if (snapshot.connectionState == ConnectionState.waiting) {
113
- return 'パスワードを入力して下さい';
100
+ // スプラッシュ画面などに書き換えても良い
101
+ return const SizedBox();
114
- }
102
+ }
103
+ if (snapshot.hasData) {
104
+ // User が null でなない、つまりサインイン済みのホーム画面へ
105
+ return CommunityScreen();
106
+ }
107
+ // User が null である、つまり未サインインのサインイン画面へ
115
- return null;
108
+ return SignedInScreen();
116
- },
109
+ },
117
- ),
118
- SizedBox(height: 16),
119
- SizedBox(
120
- width: double.infinity,
121
- child: ElevatedButton(
122
- onPressed: () => _onSignIn(),
123
- child: Text('ログイン'),
124
110
  ),
111
+ SingleChildScrollView(
112
+ child: Container(
113
+ width: MediaQuery.of(context).size.width,
114
+ child: Column(
115
+ mainAxisAlignment: MainAxisAlignment.center,
116
+ children: [
117
+ TextFormField(
118
+ controller: _emailController,
119
+ decoration: InputDecoration(labelText: 'メールアドレス'),
120
+ keyboardType: TextInputType.emailAddress,
121
+ validator: (String? value) {
122
+ if (value?.isEmpty == true) {
123
+ return 'メールアドレスを入力して下さい';
124
+ }
125
+ return null;
126
+ },
125
- ),
127
+ ),
126
- SizedBox(height: 8),
128
+ SizedBox(height: 8),
129
+ TextFormField(
130
+ controller: _passwordController,
131
+ decoration: InputDecoration(labelText: 'パスワード'),
132
+ keyboardType: TextInputType.visiblePassword,
133
+ obscureText: true,
134
+ validator: (String? value) {
135
+ if (value?.isEmpty == true) {
136
+ return 'パスワードを入力して下さい';
137
+ }
138
+ return null;
139
+ },
140
+ ),
141
+ SizedBox(height: 16),
127
- SizedBox(
142
+ SizedBox(
128
- width: double.infinity,
143
+ width: double.infinity,
129
- child: ElevatedButton(
144
+ child: ElevatedButton(
145
+ onPressed: () => _onSignIn(),
146
+ child: Text('ログイン'),
147
+ ),
148
+ ),
149
+ SizedBox(height: 8),
150
+ SizedBox(
151
+ width: double.infinity,
152
+ child: ElevatedButton(
130
- onPressed: () => _onSignUp(),
153
+ onPressed: () => _onSignUp(),
131
- child: Text('新規登録'),
154
+ child: Text('新規登録'),
155
+ ),
156
+ ),
157
+ ]),
158
+ ),
132
159
  ),
160
+ ]),
133
- ),
161
+ ),
134
- ]),
135
- ]),
136
- ),
162
+ ),
137
- );
163
+ );
138
- }
139
164
 
140
165
  Future<void> _onSignIn() async {
141
166
  try {
@@ -225,7 +250,7 @@
225
250
  preferredSize: const Size.fromHeight(60.0),
226
251
  child: AppBar(
227
252
  title: TitleTextCreate(
228
- title: "***",
253
+ title: "介護士コミュニティ",
229
254
  size: 30,
230
255
  color: Colors.white,
231
256
  radius: 18,
@@ -264,6 +289,9 @@
264
289
  }
265
290
  ```
266
291
 
292
+ 変更
267
293
  試したこと
268
- [参考サイト](https://github.com/RaajeevChandran/Firebase-Authentication-in-Flutter-with-Provider/blob/main/lib/main.dart)を参考に、実装しようとしましたがうまくできず。
294
+ [参考サイト]https://qiita.com/KosukeSaigusa/items/b19ec19379c5a2e4ceb2を参考に、実装しようと試みましたが、デバッグした後、RUNすることは出来たものの、community screeの画面が幾重にも重なる現象がおきました。その後、調べてはみたものの修正方法がわからず、お聞きしたく。
295
+
269
-
296
+ ![UI](https://ddjkaamml8q8x.cloudfront.net/questions/2023-02-06/c791fe13-0cb8-4cbd-8479-281e6671ecf8.png)
297
+
FirebaseFlutterFirebase Authentication

1

試したこと

2023/02/02 04:23

投稿

kj0221
kj0221

スコア0

test CHANGED
File without changes
test CHANGED
@@ -264,4 +264,6 @@
264
264
  }
265
265
  ```
266
266
 
267
-
267
+ 試したこと
268
+ [参考サイト](https://github.com/RaajeevChandran/Firebase-Authentication-in-Flutter-with-Provider/blob/main/lib/main.dart)を参考に、実装しようとしましたがうまくできず。
269
+
FirebaseFlutterFirebase Authentication