256 lines
12 KiB
Dart
256 lines
12 KiB
Dart
|
import 'package:flutter/material.dart';
|
||
|
import 'login_page.dart'; // 로그인 페이지 임포트 추가
|
||
|
|
||
|
class SignUpPage extends StatefulWidget {
|
||
|
const SignUpPage({Key? key}) : super(key: key);
|
||
|
|
||
|
@override
|
||
|
_SignUpPageState createState() => _SignUpPageState();
|
||
|
}
|
||
|
|
||
|
class _SignUpPageState extends State<SignUpPage> {
|
||
|
bool _isAgreed = false; // 개인정보 수집 동의 체크박스 상태
|
||
|
String _username = ''; // 아이디 입력값
|
||
|
String? _usernameError; // 아이디 오류 메시지
|
||
|
|
||
|
// 아이디 패턴 검증
|
||
|
bool _isUsernameValid(String username) {
|
||
|
final RegExp regex = RegExp(r'^(?![0-9])[A-Za-z0-9]{6,20}$');
|
||
|
return regex.hasMatch(username);
|
||
|
}
|
||
|
|
||
|
void _validateUsername(String value) {
|
||
|
setState(() {
|
||
|
_username = value;
|
||
|
if (_isUsernameValid(value)) {
|
||
|
_usernameError = null; // 유효한 경우 오류 메시지 제거
|
||
|
} else {
|
||
|
_usernameError = '* 아이디는 6~20자 영문 대소문자와 숫자 조합이어야 하며, 숫자로 시작할 수 없습니다.';
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
|
||
|
@override
|
||
|
Widget build(BuildContext context) {
|
||
|
return Scaffold(
|
||
|
backgroundColor: Colors.white,
|
||
|
appBar: AppBar(
|
||
|
title: const Text('ALL SCORE', style: TextStyle(color: Colors.white)),
|
||
|
backgroundColor: Colors.black,
|
||
|
leading: IconButton(
|
||
|
icon: const Icon(Icons.chevron_left, color: Colors.white),
|
||
|
onPressed: () {
|
||
|
Navigator.pop(context); // 로그인 페이지로 이동
|
||
|
},
|
||
|
),
|
||
|
),
|
||
|
body: Padding(
|
||
|
padding: const EdgeInsets.all(16.0),
|
||
|
child: SingleChildScrollView( // 스크롤 가능하게 설정
|
||
|
child: Column(
|
||
|
mainAxisAlignment: MainAxisAlignment.start,
|
||
|
children: [
|
||
|
const Text(
|
||
|
'회원가입',
|
||
|
style: TextStyle(
|
||
|
fontSize: 24,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: Colors.black,
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 32),
|
||
|
TextField(
|
||
|
onChanged: _validateUsername, // 아이디 입력 시 검증
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '아이디',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
if (_usernameError != null) // 오류 메시지 표시
|
||
|
Padding(
|
||
|
padding: const EdgeInsets.only(top: 8.0),
|
||
|
child: Text(
|
||
|
_usernameError!,
|
||
|
style: const TextStyle(color: Colors.red, fontSize: 12), // 폰트 크기 줄임
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
TextField(
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '비밀번호',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
obscureText: true,
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
TextField(
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '비밀번호 확인',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
obscureText: true,
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
TextField(
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '닉네임',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
TextField(
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '이메일',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
TextField(
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '소속',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
TextField(
|
||
|
decoration: InputDecoration(
|
||
|
labelText: '자기소개',
|
||
|
labelStyle: const TextStyle(color: Colors.black),
|
||
|
border: OutlineInputBorder(),
|
||
|
focusedBorder: OutlineInputBorder(
|
||
|
borderSide: const BorderSide(color: Colors.black, width: 2.0),
|
||
|
),
|
||
|
),
|
||
|
maxLines: 3, // 여러 줄 입력 가능
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
const Text(
|
||
|
'개인정보 수집 및 이용 동의서',
|
||
|
style: TextStyle(
|
||
|
fontSize: 16,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: Colors.black,
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 8),
|
||
|
Container(
|
||
|
height: 200, // 스크롤 가능한 영역의 높이 설정
|
||
|
decoration: BoxDecoration(
|
||
|
border: Border.all(color: Colors.black.withOpacity(0.5)), // 부드러운 테두리
|
||
|
borderRadius: BorderRadius.circular(8), // 모서리 둥글게
|
||
|
),
|
||
|
child: Scrollbar( // 스크롤바 추가
|
||
|
thickness: 5, // 스크롤바 두께
|
||
|
radius: Radius.circular(5), // 스크롤바 둥글게
|
||
|
child: SingleChildScrollView(
|
||
|
child: const Padding(
|
||
|
padding: EdgeInsets.all(15.0), // 여백 추가
|
||
|
child: Text(
|
||
|
'올스코어(이하 "회사"라 합니다)는 이용자의 개인정보를 중요시하며, '
|
||
|
'「개인정보 보호법」 등 관련 법령을 준수하고 있습니다. '
|
||
|
'회사는 개인정보 수집 및 이용에 관한 사항을 아래와 같이 안내드리오니, '
|
||
|
'내용을 충분히 숙지하신 후 동의하여 주시기 바랍니다.\n\n'
|
||
|
'1. 수집하는 개인정보 항목\n'
|
||
|
'필수 항목: 아이디(ID), 비밀번호(PW), 닉네임(실명 아님), 이메일 주소\n'
|
||
|
'선택 항목: 소속, 자기소개\n\n'
|
||
|
'2. 개인정보의 수집 및 이용 목적\n'
|
||
|
'회원 관리\n'
|
||
|
'회원 식별 및 인증\n'
|
||
|
'부정 이용 방지 및 비인가 사용 방지\n'
|
||
|
'서비스 이용에 따른 문의 사항 처리\n'
|
||
|
'서비스 제공\n'
|
||
|
'게임 방 생성 및 참여 등 기본 서비스 제공\n'
|
||
|
'통계 및 순위 제공 등 부가 서비스 제공\n'
|
||
|
'고객 지원 및 공지사항 전달\n'
|
||
|
'서비스 관련 중요한 공지사항 전달\n'
|
||
|
'이용자 문의 및 불만 처리\n\n'
|
||
|
'3. 개인정보의 보유 및 이용 기간\n'
|
||
|
'회원 탈퇴 시: 수집된 모든 개인정보는 회원 탈퇴 즉시 파기합니다.\n'
|
||
|
'관련 법령에 따른 보관: 전자상거래 등에서의 소비자 보호에 관한 법률 등 관계 법령의 규정에 따라 일정 기간 보관이 필요한 경우 해당 기간 동안 보관합니다.\n'
|
||
|
'계약 또는 청약 철회 등에 관한 기록: 5년 보관\n'
|
||
|
'대금 결제 및 재화 등의 공급에 관한 기록: 5년 보관\n'
|
||
|
'소비자의 불만 또는 분쟁 처리에 관한 기록: 3년 보관\n\n'
|
||
|
'4. 개인정보의 파기 절차 및 방법\n'
|
||
|
'파기 절차\n'
|
||
|
'회원 탈퇴 요청 또는 개인정보 수집 및 이용 목적이 달성된 후 지체 없이 해당 정보를 파기합니다.\n'
|
||
|
'파기 방법\n'
|
||
|
'전자적 파일 형태: 복구 및 재생이 불가능한 방법으로 영구 삭제\n'
|
||
|
'종이 문서 형태: 분쇄하거나 소각\n\n'
|
||
|
'5. 이용자의 권리 및 행사 방법\n'
|
||
|
'이용자는 언제든지 자신의 개인정보에 대해 열람, 수정, 삭제, 처리 정지를 요구할 수 있습니다.\n'
|
||
|
'회원 탈퇴를 원하시는 경우, 서비스 내의 "회원 탈퇴" 기능을 이용하시거나 고객센터를 통해 요청하실 수 있습니다.\n\n'
|
||
|
'6. 동의를 거부할 권리 및 거부 시 불이익\n'
|
||
|
'이용자는 개인정보 수집 및 이용에 대한 동의를 거부할 권리가 있습니다.\n'
|
||
|
'그러나 필수 항목에 대한 동의를 거부하실 경우 서비스 이용이 제한될 수 있습니다.\n\n'
|
||
|
'7. 개인정보 보호책임자\n'
|
||
|
'이름: 여정훈\n'
|
||
|
'연락처: eld_yeojh@naver.com\n\n'
|
||
|
'8. 개인정보의 안전성 확보 조치\n'
|
||
|
'회사는 개인정보의 안전한 처리를 위하여 기술적, 관리적 보호조치를 시행하고 있습니다.\n'
|
||
|
'개인정보의 암호화\n'
|
||
|
'해킹 등에 대비한 대책\n'
|
||
|
'접근 통제 장치의 설치 및 운영',
|
||
|
textAlign: TextAlign.left,
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
// 동의 체크박스
|
||
|
Row(
|
||
|
children: [
|
||
|
Checkbox(
|
||
|
value: _isAgreed,
|
||
|
onChanged: (value) {
|
||
|
setState(() {
|
||
|
_isAgreed = value ?? false; // 체크박스 상태 업데이트
|
||
|
});
|
||
|
},
|
||
|
),
|
||
|
const Text('개인정보 수집 및 이용에 동의합니다.'),
|
||
|
],
|
||
|
),
|
||
|
const SizedBox(height: 16),
|
||
|
ElevatedButton(
|
||
|
onPressed: () {
|
||
|
// 회원가입 로직 추가
|
||
|
Navigator.pop(context); // 로그인 페이지로 이동
|
||
|
},
|
||
|
style: ElevatedButton.styleFrom(
|
||
|
backgroundColor: Colors.black,
|
||
|
foregroundColor: Colors.white,
|
||
|
),
|
||
|
child: const Text('ALL SCORE 회원가입'),
|
||
|
),
|
||
|
],
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
);
|
||
|
}
|
||
|
}
|