1.테마/컬러 수정
2. UI 텍스트 한국어 번역 3. SettingScreen(설정 페이지) -현재 페이지는 레이아웃만 완성되었으며, 토글 스위치 및 링크 연결 기능은 미완성 상태입니다.
This commit is contained in:
KIMGYEONGRAN
@@ -1,105 +1,188 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'main.dart';
|
||||
|
||||
class LoginScreen extends StatelessWidget {
|
||||
class LoginScreen extends StatefulWidget {
|
||||
const LoginScreen({super.key});
|
||||
|
||||
@override
|
||||
State<LoginScreen> createState() => _LoginScreenState();
|
||||
}
|
||||
|
||||
class _LoginScreenState extends State<LoginScreen> {
|
||||
final TextEditingController _idController = TextEditingController();
|
||||
final TextEditingController _pwController = TextEditingController();
|
||||
|
||||
LoginScreen({super.key});
|
||||
final FocusNode _idFocusNode = FocusNode();
|
||||
final FocusNode _pwFocusNode = FocusNode();
|
||||
|
||||
final Color mainBlueColor = const Color(0xFF007AFF);
|
||||
|
||||
bool _isIdFocused = false;
|
||||
bool _isPwFocused = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_idFocusNode.addListener(() {
|
||||
setState(() => _isIdFocused = _idFocusNode.hasFocus);
|
||||
});
|
||||
_pwFocusNode.addListener(() {
|
||||
setState(() => _isPwFocused = _pwFocusNode.hasFocus);
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_idController.dispose();
|
||||
_pwController.dispose();
|
||||
_idFocusNode.dispose();
|
||||
_pwFocusNode.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF1E1E1E),
|
||||
body: Padding(
|
||||
padding: const EdgeInsets.all(24.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
const Icon(Icons.polymer, size: 80, color: Colors.white),
|
||||
const SizedBox(height: 20),
|
||||
const Text(
|
||||
'METAQLAB'
|
||||
'',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 1.2,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 60),
|
||||
|
||||
_buildTextField('User ID', Icons.person, controller: _idController),
|
||||
const SizedBox(height: 16),
|
||||
_buildTextField('Password', Icons.lock, isObscure: true, controller: _pwController),
|
||||
|
||||
const SizedBox(height: 40),
|
||||
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
String inputId = _idController.text;
|
||||
String inputPw = _pwController.text;
|
||||
|
||||
if (inputId == 'user' && inputPw == '1234') {
|
||||
print('로그인 성공!');
|
||||
Navigator.pushReplacement(
|
||||
context,
|
||||
MaterialPageRoute(builder: (context) => const HomeScreen()),
|
||||
);
|
||||
} else {
|
||||
print('로그인 실패');
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('아이디 또는 비밀번호가 틀렸습니다.'),
|
||||
backgroundColor: Colors.redAccent,
|
||||
duration: Duration(seconds: 2),
|
||||
),
|
||||
);
|
||||
}
|
||||
},
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: Colors.white,
|
||||
foregroundColor: Colors.black,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
backgroundColor: Colors.white,
|
||||
body: SafeArea(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Icon(Icons.polymer, size: 80, color: mainBlueColor),
|
||||
const SizedBox(height: 20),
|
||||
Text(
|
||||
'METAQLAB',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
color: mainBlueColor,
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 1.2,
|
||||
),
|
||||
),
|
||||
child: const Text(
|
||||
'LOGIN',
|
||||
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 60),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
TextButton(
|
||||
onPressed: () {},
|
||||
child: const Text('Forgot Password?', style: TextStyle(color: Colors.grey)),
|
||||
),
|
||||
],
|
||||
_buildCustomTextField(
|
||||
label: '아이디',
|
||||
controller: _idController,
|
||||
focusNode: _idFocusNode,
|
||||
isFocused: _isIdFocused,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
|
||||
_buildCustomTextField(
|
||||
label: '비밀번호',
|
||||
controller: _pwController,
|
||||
focusNode: _pwFocusNode,
|
||||
isFocused: _isPwFocused,
|
||||
isObscure: true,
|
||||
),
|
||||
|
||||
const SizedBox(height: 40),
|
||||
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
String inputId = _idController.text;
|
||||
String inputPw = _pwController.text;
|
||||
|
||||
if (inputId == 'user' && inputPw == '1234') {
|
||||
print('로그인 성공!');
|
||||
Navigator.pushReplacement(
|
||||
context,
|
||||
MaterialPageRoute(builder: (context) => const HomeScreen()),
|
||||
);
|
||||
} else {
|
||||
print('로그인 실패');
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('아이디 또는 비밀번호가 틀렸습니다.'),
|
||||
backgroundColor: Colors.redAccent,
|
||||
duration: Duration(seconds: 2),
|
||||
),
|
||||
);
|
||||
}
|
||||
},
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: mainBlueColor,
|
||||
foregroundColor: Colors.white,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
elevation: 0,
|
||||
),
|
||||
child: const Text(
|
||||
'로그인',
|
||||
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
TextButton(
|
||||
onPressed: () {},
|
||||
child: Text(
|
||||
'비밀번호 찾기 / 회원가입',
|
||||
style: TextStyle(color: mainBlueColor, fontWeight: FontWeight.w500),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTextField(String hint, IconData icon, {bool isObscure = false, required TextEditingController controller}) {
|
||||
return TextField(
|
||||
controller: controller,
|
||||
obscureText: isObscure,
|
||||
style: const TextStyle(color: Colors.white),
|
||||
decoration: InputDecoration(
|
||||
prefixIcon: Icon(icon, color: Colors.grey),
|
||||
hintText: hint,
|
||||
hintStyle: const TextStyle(color: Colors.grey),
|
||||
filled: true,
|
||||
fillColor: const Color(0xFF2C2C2E),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide.none,
|
||||
Widget _buildCustomTextField({
|
||||
required String label,
|
||||
required TextEditingController controller,
|
||||
required FocusNode focusNode,
|
||||
required bool isFocused,
|
||||
bool isObscure = false,
|
||||
}) {
|
||||
return AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
border: Border.all(
|
||||
color: isFocused ? mainBlueColor : Colors.grey.shade300,
|
||||
width: isFocused ? 1.5 : 1.0,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: TextStyle(
|
||||
color: isFocused ? mainBlueColor : Colors.grey.shade600,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
TextField(
|
||||
controller: controller,
|
||||
focusNode: focusNode,
|
||||
obscureText: isObscure,
|
||||
decoration: const InputDecoration(
|
||||
isDense: true,
|
||||
contentPadding: EdgeInsets.zero,
|
||||
border: InputBorder.none,
|
||||
focusedBorder: InputBorder.none,
|
||||
enabledBorder: InputBorder.none,
|
||||
),
|
||||
style: const TextStyle(
|
||||
fontSize: 16,
|
||||
color: Colors.black87,
|
||||
),
|
||||
cursorColor: mainBlueColor,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user