feat: 로그인 화면 구현 및 api 연결 완료 #17
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,175 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:ongi/core/app_colors.dart'; | ||
| import 'package:shared_preferences/shared_preferences.dart'; | ||
| import 'package:ongi/services/login_service.dart'; | ||
| import 'package:ongi/screens/login/login_ready_screen.dart'; | ||
|
|
||
| class LoginPwScreen extends StatefulWidget { | ||
| const LoginPwScreen({super.key}); | ||
|
|
||
| @override | ||
| State<LoginPwScreen> createState() => _LoginPwScreenState(); | ||
| } | ||
|
|
||
| class _LoginPwScreenState extends State<LoginPwScreen> { | ||
| final TextEditingController _passwordCtrl = TextEditingController(); | ||
| final LoginService _loginService = LoginService(); | ||
| bool _isLoading = false; | ||
|
|
||
| void _showErrorSnackBar(String message) { | ||
| ScaffoldMessenger.of(context).showSnackBar( | ||
| SnackBar( | ||
| content: Text( | ||
| message, | ||
| style: const TextStyle(color: AppColors.ongiOrange), | ||
| ), | ||
| backgroundColor: Colors.white, | ||
| behavior: SnackBarBehavior.floating, | ||
| shape: RoundedRectangleBorder( | ||
| borderRadius: BorderRadius.circular(20), | ||
| ), | ||
| duration: const Duration(seconds: 2), | ||
| ), | ||
| ); | ||
| } | ||
|
|
||
| @override | ||
| Widget build(BuildContext context) { | ||
| return Scaffold( | ||
| backgroundColor: Colors.white, | ||
| body: SingleChildScrollView( | ||
| child: Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Padding( | ||
| padding: const EdgeInsets.only(left: 30, right: 30, top: 150), | ||
| child: Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: const [ | ||
| const Text( | ||
| '비밀번호를', | ||
| style: TextStyle( | ||
| fontSize: 60, | ||
| fontWeight: FontWeight.w800, | ||
| height: 1.2, | ||
| color: AppColors.ongiOrange, | ||
| ), | ||
| ), | ||
| const Text( | ||
| '입력해주세요', | ||
| style: TextStyle( | ||
| fontSize: 60, | ||
| fontWeight: FontWeight.w200, | ||
| height: 1.2, | ||
| color: AppColors.ongiOrange, | ||
| ), | ||
| ), | ||
| ], | ||
| ), | ||
| ), | ||
| Padding( | ||
| padding: const EdgeInsets.only(left: 40, right: 40, top: 40), | ||
| child: Text( | ||
| '반갑습니다!', | ||
| style: TextStyle( | ||
| fontSize: 20, | ||
| fontWeight: FontWeight.w300, | ||
| color: Colors.grey | ||
| ) | ||
| ) | ||
| ), | ||
| Padding( | ||
| padding: const EdgeInsets.only(left: 40, right: 40, top: 10), | ||
| child: TextField( | ||
| controller: _passwordCtrl, | ||
| keyboardType: TextInputType.visiblePassword, | ||
| style: const TextStyle(fontSize: 25, color: AppColors.ongiOrange), | ||
| decoration: InputDecoration( | ||
| hintText: 'PASSWORD', | ||
| hintStyle: | ||
| TextStyle(color: Colors.grey), | ||
| contentPadding: const EdgeInsets.symmetric( | ||
| horizontal: 24, vertical: 13), | ||
| filled: true, | ||
| fillColor: Colors.transparent, | ||
| enabledBorder: OutlineInputBorder( | ||
| borderSide: | ||
| const BorderSide(color: AppColors.ongiOrange, width: 1), | ||
| borderRadius: BorderRadius.circular(20), | ||
| ), | ||
| focusedBorder: OutlineInputBorder( | ||
| borderSide: | ||
| const BorderSide(color: AppColors.ongiOrange, width: 1), | ||
| borderRadius: BorderRadius.circular(20), | ||
| ), | ||
| ), | ||
| ), | ||
| ), | ||
| Padding( | ||
| padding: const EdgeInsets.only(left: 40, right: 40, top: 20), | ||
| child: SizedBox( | ||
| width: double.infinity, | ||
| height: 65, | ||
| child: ElevatedButton( | ||
| style: ElevatedButton.styleFrom( | ||
| padding: const EdgeInsets.symmetric(vertical: 10), | ||
| backgroundColor: AppColors.ongiOrange, | ||
| shape: RoundedRectangleBorder( | ||
| borderRadius: BorderRadius.circular(20), | ||
| ), | ||
| ), | ||
| onPressed: _isLoading | ||
| ? null | ||
| : () async { | ||
| final password = _passwordCtrl.text.trim(); | ||
| if (password.isEmpty) { | ||
| _showErrorSnackBar('비밀번호를 입력해주세요.'); | ||
| return; | ||
| } | ||
|
|
||
| setState(() => _isLoading = true); | ||
|
|
||
| try { | ||
| final prefs = await SharedPreferences.getInstance(); | ||
| final email = prefs.getString('signup_email') ?? ''; | ||
|
Comment on lines
+133
to
+134
There was a problem hiding this comment. 🛠️ Refactor suggestion SharedPreferences 키 이름을 명확하게 변경하세요 로그인 화면에서 'signup_email'이라는 키를 사용하는 것은 혼란을 줄 수 있습니다. final prefs = await SharedPreferences.getInstance();
- final email = prefs.getString('signup_email') ?? '';
+ final email = prefs.getString('user_email') ?? '';또한 이메일이 없을 경우의 처리도 추가하는 것이 좋습니다: if (email.isEmpty) {
_showErrorSnackBar('이메일 정보가 없습니다. 다시 로그인해주세요.');
return;
}🤖 Prompt for AI Agents |
||
|
|
||
| final result = await _loginService.login( | ||
| email: email, | ||
| password: password, | ||
| ); | ||
|
|
||
| if (!mounted) return; | ||
|
|
||
| Navigator.pushReplacement( | ||
| context, | ||
| MaterialPageRoute( | ||
| builder: (_) => LoginReadyScreen( | ||
| username: result['userInfo']['name'] ?? '사용자', | ||
| ), | ||
| ), | ||
| ); | ||
| } catch (e) { | ||
| _showErrorSnackBar('로그인에 실패했어요.T_T 비밀번호를 다시 확인해주세요.'); | ||
| } finally { | ||
| setState(() => _isLoading = false); | ||
| } | ||
| }, | ||
| child: _isLoading | ||
| ? const CircularProgressIndicator(color: AppColors.ongiOrange) | ||
| : const Text( | ||
| '로그인', | ||
| style: TextStyle( | ||
| fontSize: 33, | ||
| fontWeight: FontWeight.w400, | ||
| color: Colors.white, | ||
| ), | ||
| ), | ||
| ), | ||
| ), | ||
| ), | ||
| ] | ||
| ), | ||
| ), | ||
| ); | ||
| } | ||
| } | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| import 'dart:async'; | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:ongi/core/app_background.dart'; | ||
| import 'package:ongi/screens/home_screen.dart'; | ||
|
|
||
| class LoginReadyScreen extends StatefulWidget { | ||
| final String username; | ||
| const LoginReadyScreen({required this.username, super.key}); | ||
|
|
||
| @override | ||
| State<LoginReadyScreen> createState() => _LoginReadyScreenState(); | ||
| } | ||
|
|
||
| class _LoginReadyScreenState extends State<LoginReadyScreen> { | ||
| Timer? _timer; | ||
|
|
||
| @override | ||
| void initState() { | ||
| super.initState(); | ||
|
|
||
| _timer = Timer(const Duration(seconds: 2), () { | ||
| if (!mounted) return; | ||
| Navigator.of(context).pushReplacement( | ||
| MaterialPageRoute(builder: (_) => const HomeScreen()), | ||
| ); | ||
| }); | ||
| } | ||
|
|
||
| @override | ||
| void dispose() { | ||
| _timer?.cancel(); | ||
| super.dispose(); | ||
| } | ||
|
|
||
| @override | ||
| Widget build(BuildContext context) { | ||
| return Scaffold( | ||
| backgroundColor: Colors.transparent, | ||
| body: AppBackground( | ||
| child: Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| Padding( | ||
| padding: const EdgeInsets.only(left: 30, right: 30, top: 150), | ||
| child: Column( | ||
| crossAxisAlignment: CrossAxisAlignment.start, | ||
| children: [ | ||
| const Text( | ||
| '반가워요', | ||
| style: TextStyle( | ||
| fontSize: 60, | ||
| fontWeight: FontWeight.w200, | ||
| height: 1.2, | ||
| color: Colors.white, | ||
| ), | ||
| ), | ||
| Text( | ||
| '${widget.username}님', | ||
| style: const TextStyle( | ||
| fontSize: 60, | ||
| fontWeight: FontWeight.w800, | ||
| height: 1.2, | ||
| color: Colors.white, | ||
| ), | ||
| ), | ||
| ], | ||
| ), | ||
| ), | ||
| ], | ||
| ), | ||
| ), | ||
| ); | ||
| } | ||
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
비밀번호 필드에 보안 설정을 추가하세요
비밀번호 입력 필드가 평문으로 표시되고 있습니다. 보안을 위해
obscureText를 사용해야 합니다.child: TextField( controller: _passwordCtrl, - keyboardType: TextInputType.visiblePassword, + obscureText: true, + keyboardType: TextInputType.text, style: const TextStyle(fontSize: 25, color: AppColors.ongiOrange),📝 Committable suggestion
🤖 Prompt for AI Agents