From 8ad7c14fbe4e0b1eec55c9de8bed5bbce931d180 Mon Sep 17 00:00:00 2001 From: kkosang Date: Sun, 20 Apr 2025 17:27:08 +0900 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=EC=BD=94=EB=93=9C=20=ED=94=84?= =?UTF-8?q?=EB=A1=9C=ED=95=84=20=EA=B4=80=EC=8B=AC=20=EC=A3=BC=EC=A0=9C=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20UI=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../profile_intereset_page.dart | 117 ++++++++++++++++++ 1 file changed, 117 insertions(+) create mode 100644 lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart diff --git a/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart b/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart new file mode 100644 index 0000000..cd20e29 --- /dev/null +++ b/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart @@ -0,0 +1,117 @@ +import 'package:code_l/sign_up/presentation/widgets/sign_up_app_bar.dart'; +import 'package:flutter/material.dart'; + +import '../../../../core/utills/design/app_colors.dart'; +import '../../../../core/utills/design/app_gaps.dart'; +import '../../../../core/utills/design/app_typography.dart'; +import '../../widgets/sign_up_confirm_button.dart'; + +class ProfileInterestPage extends StatefulWidget { + const ProfileInterestPage({super.key}); + + @override + State createState() => _ProfileInterestPageState(); +} + +class _ProfileInterestPageState extends State { + // todo 상태관리 + final List interestOptions = [ + '게임 🎮', '방탈출/보드게임 🎲', '야외활동 🚴', + '운동 🏋️', '독서 & 글쓰기 📚✍️', '음악 & 악기 🎵🎸', + '영화 🎬', '캠핑 🏕️', 'OTT/드라마 📺', + '여행 ✈', '요리 🍳', '맛집 탐방 🍽', + '패션 & 뷰티 👗💄', '쇼핑 🛍', '동물 🐶🐱', + 'IT기술 💻', '댄스 & 퍼포먼스 💃🕺', '인테리어 & DIY 🏠🔨', + '사지 & 영상 제작 🎥', '전시관람 🖼' + ]; + + final List selectedIndexes = []; + final int maxSelection = 5; + + @override + Widget build(BuildContext context) { + final screenHeight = MediaQuery.of(context).size.height; + final isValid = selectedIndexes.isNotEmpty; + + return Scaffold( + appBar: SignUpAppBar(), + bottomNavigationBar: Padding( + padding: const EdgeInsets.symmetric(horizontal: AppGaps.gap20, vertical: 34), + child: ConfirmButton( + enabled: isValid, + onPressed: () { + // TODO: 다음 페이지 이동 로직 + }, + ), + ), + body: SafeArea( + child: Padding( + padding: const EdgeInsets.all(AppGaps.gap20), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox(height: screenHeight * 0.05), + Text("어떤 주제를 좋아하세요?", style: AppTypography.header1), + SizedBox(height: AppGaps.gap12), + Text( + "관심 있는 주제를 최대 5개까지 선택해주세요!\n나에게 딱 맞는 CODE 사용자를 추천해드려요", + style: AppTypography.body2.copyWith(color: AppColors.grey600), + ), + SizedBox(height: AppGaps.gap20), + Align( + alignment: Alignment.centerRight, + child: Text( + "${selectedIndexes.length} / $maxSelection", + style: AppTypography.body2.copyWith(color: AppColors.grey500), + ), + ), + SizedBox(height: AppGaps.gap20), + Expanded( + child: SingleChildScrollView( + child: Wrap( + spacing: 12, + runSpacing: 12, + children: List.generate(interestOptions.length, (index) { + final isSelected = selectedIndexes.contains(index); + + return GestureDetector( + onTap: () { + setState(() { + if (isSelected) { + selectedIndexes.remove(index); + } else { + if (selectedIndexes.length < maxSelection) { + selectedIndexes.add(index); + } + } + }); + }, + child: Container( + padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 16), + decoration: BoxDecoration( + border: Border.all( + color: isSelected ? AppColors.primary : AppColors.grey400, + ), + color: isSelected ? AppColors.primaryLight : AppColors.white, + borderRadius: BorderRadius.circular(100), + ), + child: Text( + interestOptions[index], + style: AppTypography.body2.copyWith( + color: AppColors.grey800, + ), + ), + ), + ); + }), + ), + ), + ), + ], + ), + ), + ), + ); + } +} + From 2a9a0f71260a06e95386ea678d6441400ae23cdc Mon Sep 17 00:00:00 2001 From: kkosang Date: Sun, 20 Apr 2025 17:28:29 +0900 Subject: [PATCH 2/2] chore: dart format --- .../congratulation/congratulation_page.dart | 2 +- .../widgets/congratulation_app_bar.dart | 4 +- .../pages/login/login_viewmodel.dart | 7 +- .../pages/terms_and_conditions/providers.dart | 5 +- .../terms_and_condition_page.dart | 35 +-- .../terms_and_conditions_viewmodel.dart | 5 +- .../presentation/pages/woman/providers.dart | 5 +- .../widgets/woman_verification_app_bar.dart | 4 +- .../pages/woman/woman_verification_Page.dart | 232 +++++++++--------- lib/main.dart | 6 +- .../pages/code_age/code_age_page.dart | 118 +++++---- .../pages/code_job/code_job_page.dart | 79 +++--- .../code_lifestyle_drink_page.dart | 49 ++-- .../code_lifestyle_smoke_page.dart | 47 ++-- .../widgets/code_lifestyle_check_icon.dart | 31 ++- .../pages/code_name/code_name_page.dart | 13 +- .../profile_intereset_page.dart | 50 +++- .../widgets/sign_up_confirm_button.dart | 10 +- 18 files changed, 387 insertions(+), 315 deletions(-) diff --git a/lib/auth/presentation/pages/congratulation/congratulation_page.dart b/lib/auth/presentation/pages/congratulation/congratulation_page.dart index a3d7180..86e1ffc 100644 --- a/lib/auth/presentation/pages/congratulation/congratulation_page.dart +++ b/lib/auth/presentation/pages/congratulation/congratulation_page.dart @@ -114,4 +114,4 @@ class CongratulationPage extends StatelessWidget { ), ); } -} \ No newline at end of file +} diff --git a/lib/auth/presentation/pages/congratulation/widgets/congratulation_app_bar.dart b/lib/auth/presentation/pages/congratulation/widgets/congratulation_app_bar.dart index dab9184..8485d34 100644 --- a/lib/auth/presentation/pages/congratulation/widgets/congratulation_app_bar.dart +++ b/lib/auth/presentation/pages/congratulation/widgets/congratulation_app_bar.dart @@ -19,9 +19,7 @@ class CongratulationAppBar extends StatelessWidget mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ - SizedBox( - width: AppGaps.gap36, - ), + SizedBox(width: AppGaps.gap36), Text( "회원가입", style: AppTypography.subtitle2.copyWith(color: AppColors.grey900), diff --git a/lib/auth/presentation/pages/login/login_viewmodel.dart b/lib/auth/presentation/pages/login/login_viewmodel.dart index 68b315d..830484f 100644 --- a/lib/auth/presentation/pages/login/login_viewmodel.dart +++ b/lib/auth/presentation/pages/login/login_viewmodel.dart @@ -15,9 +15,10 @@ class LoginViewModel extends ChangeNotifier { try { bool installed = await isKakaoTalkInstalled(); - OAuthToken token = installed - ? await UserApi.instance.loginWithKakaoTalk() - : await UserApi.instance.loginWithKakaoAccount(); + OAuthToken token = + installed + ? await UserApi.instance.loginWithKakaoTalk() + : await UserApi.instance.loginWithKakaoAccount(); final user = await UserApi.instance.me(); diff --git a/lib/auth/presentation/pages/terms_and_conditions/providers.dart b/lib/auth/presentation/pages/terms_and_conditions/providers.dart index 578c774..b6a8ff6 100644 --- a/lib/auth/presentation/pages/terms_and_conditions/providers.dart +++ b/lib/auth/presentation/pages/terms_and_conditions/providers.dart @@ -1,5 +1,6 @@ import 'package:code_l/auth/presentation/pages/terms_and_conditions/terms_and_conditions_viewmodel.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; -final termsAndConditionsViewModelProvider = - ChangeNotifierProvider((ref) => TermsAndConditionsViewmodel()); +final termsAndConditionsViewModelProvider = ChangeNotifierProvider( + (ref) => TermsAndConditionsViewmodel(), +); diff --git a/lib/auth/presentation/pages/terms_and_conditions/terms_and_condition_page.dart b/lib/auth/presentation/pages/terms_and_conditions/terms_and_condition_page.dart index 704acc9..4c8c842 100644 --- a/lib/auth/presentation/pages/terms_and_conditions/terms_and_condition_page.dart +++ b/lib/auth/presentation/pages/terms_and_conditions/terms_and_condition_page.dart @@ -43,7 +43,8 @@ class TermsAndConditionPage extends ConsumerWidget { Navigator.push( context, MaterialPageRoute( - builder: (context) => const WomanVerificationPage()), + builder: (context) => const WomanVerificationPage(), + ), ); }, ), @@ -72,9 +73,10 @@ class TermsAndConditionPage extends ConsumerWidget { Text( "모두 동의합니다.", style: AppTypography.subtitle2.copyWith( - color: viewmodel.checkState[0] - ? AppColors.grey900 - : AppColors.grey500, + color: + viewmodel.checkState[0] + ? AppColors.grey900 + : AppColors.grey500, ), ), IconButton( @@ -82,9 +84,10 @@ class TermsAndConditionPage extends ConsumerWidget { iconSize: 36, icon: Icon( Icons.check_circle_outline, - color: viewmodel.checkState[0] - ? AppColors.grey900 - : AppColors.grey500, + color: + viewmodel.checkState[0] + ? AppColors.grey900 + : AppColors.grey500, ), ), ], @@ -95,17 +98,16 @@ class TermsAndConditionPage extends ConsumerWidget { mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ TextButton( - style: TextButton.styleFrom( - padding: EdgeInsets.zero, - ), + style: TextButton.styleFrom(padding: EdgeInsets.zero), onPressed: () {}, child: Text( getLabel(i), style: AppTypography.body2.copyWith( decoration: TextDecoration.underline, - color: viewmodel.checkState[i] - ? AppColors.grey900 - : AppColors.grey500, + color: + viewmodel.checkState[i] + ? AppColors.grey900 + : AppColors.grey500, ), ), ), @@ -114,9 +116,10 @@ class TermsAndConditionPage extends ConsumerWidget { iconSize: 24, icon: Icon( Icons.check, - color: viewmodel.checkState[i] - ? AppColors.grey900 - : AppColors.grey500, + color: + viewmodel.checkState[i] + ? AppColors.grey900 + : AppColors.grey500, ), ), ], diff --git a/lib/auth/presentation/pages/terms_and_conditions/terms_and_conditions_viewmodel.dart b/lib/auth/presentation/pages/terms_and_conditions/terms_and_conditions_viewmodel.dart index 4c6e039..3ecfbe6 100644 --- a/lib/auth/presentation/pages/terms_and_conditions/terms_and_conditions_viewmodel.dart +++ b/lib/auth/presentation/pages/terms_and_conditions/terms_and_conditions_viewmodel.dart @@ -21,7 +21,10 @@ class TermsAndConditionsViewmodel extends ChangeNotifier { void toggleAll() { final allAgree = !checkState[0]; - checkState = [allAgree, for (int i = 1; i < checkState.length; i++) allAgree]; + checkState = [ + allAgree, + for (int i = 1; i < checkState.length; i++) allAgree, + ]; if (checkState.sublist(1, 4).every((checked) => checked)) { isValid = true; } else { diff --git a/lib/auth/presentation/pages/woman/providers.dart b/lib/auth/presentation/pages/woman/providers.dart index 1bfd11e..fa488fa 100644 --- a/lib/auth/presentation/pages/woman/providers.dart +++ b/lib/auth/presentation/pages/woman/providers.dart @@ -1,5 +1,6 @@ import 'package:code_l/auth/presentation/pages/woman/woman_verification_viewmodel.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; -final womanViewmodelProvider = - ChangeNotifierProvider((ref) => WomanVerificationViewmodel()); +final womanViewmodelProvider = ChangeNotifierProvider( + (ref) => WomanVerificationViewmodel(), +); diff --git a/lib/auth/presentation/pages/woman/widgets/woman_verification_app_bar.dart b/lib/auth/presentation/pages/woman/widgets/woman_verification_app_bar.dart index 2a96d2d..568a74e 100644 --- a/lib/auth/presentation/pages/woman/widgets/woman_verification_app_bar.dart +++ b/lib/auth/presentation/pages/woman/widgets/woman_verification_app_bar.dart @@ -19,9 +19,7 @@ class WomanVerificationAppBar extends StatelessWidget mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ - SizedBox( - width: AppGaps.gap36, - ), + SizedBox(width: AppGaps.gap36), Text( "여성확인 안내", style: AppTypography.subtitle2.copyWith(color: AppColors.grey900), diff --git a/lib/auth/presentation/pages/woman/woman_verification_Page.dart b/lib/auth/presentation/pages/woman/woman_verification_Page.dart index 4370524..9b45753 100644 --- a/lib/auth/presentation/pages/woman/woman_verification_Page.dart +++ b/lib/auth/presentation/pages/woman/woman_verification_Page.dart @@ -38,137 +38,139 @@ class WomanVerificationPage extends ConsumerWidget { Future _buildBottomSheetField(context, viewModel, notifier) async { return showModalBottomSheet( - context: context, - builder: (BuildContext context) { - return Consumer( - builder: (context, ref, _) { - final viewModel = ref.watch(womanViewmodelProvider); - final notifier = ref.read(womanViewmodelProvider.notifier); - return Container( - decoration: BoxDecoration( - borderRadius: BorderRadius.only( - topLeft: Radius.circular(AppGaps.gap20), - topRight: Radius.circular(AppGaps.gap20), - ), - color: AppColors.white, + context: context, + builder: (BuildContext context) { + return Consumer( + builder: (context, ref, _) { + final viewModel = ref.watch(womanViewmodelProvider); + final notifier = ref.read(womanViewmodelProvider.notifier); + return Container( + decoration: BoxDecoration( + borderRadius: BorderRadius.only( + topLeft: Radius.circular(AppGaps.gap20), + topRight: Radius.circular(AppGaps.gap20), ), - height: MediaQuery.sizeOf(context).height * 0.5, - child: Center( - child: Padding( - padding: const EdgeInsets.all(AppGaps.gap20), - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Text( - "꼭 확인해 주세요", - style: AppTypography.subtitle2.copyWith( - color: AppColors.grey900, - ), - ), - IconButton( - onPressed: () => Navigator.pop(context), - icon: Icon(Icons.close), - ), - ], - ), - SizedBox(height: AppGaps.gap20), - Flexible( - child: Text( - "code:L은 여러분의 안전을 소중히 생각합니다.\n해당 확인서는 여성들만의 안전한 커뮤니티를 함께 지키기 위한 약속입니다.", + color: AppColors.white, + ), + height: MediaQuery.sizeOf(context).height * 0.5, + child: Center( + child: Padding( + padding: const EdgeInsets.all(AppGaps.gap20), + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + "꼭 확인해 주세요", style: AppTypography.subtitle2.copyWith( color: AppColors.grey900, ), ), + IconButton( + onPressed: () => Navigator.pop(context), + icon: Icon(Icons.close), + ), + ], + ), + SizedBox(height: AppGaps.gap20), + Flexible( + child: Text( + "code:L은 여러분의 안전을 소중히 생각합니다.\n해당 확인서는 여성들만의 안전한 커뮤니티를 함께 지키기 위한 약속입니다.", + style: AppTypography.subtitle2.copyWith( + color: AppColors.grey900, + ), ), - SizedBox(height: AppGaps.gap20), - Row( - children: [ - Text( - "1", - style: AppTypography.subtitle3.copyWith( + ), + SizedBox(height: AppGaps.gap20), + Row( + children: [ + Text( + "1", + style: AppTypography.subtitle3.copyWith( + color: AppColors.grey800, + ), + ), + SizedBox(width: AppGaps.gap16), + Flexible( + child: Text( + "본 서비스가 여성들끼리의 소중한 인연을 위한 플랫폼임을 이해했으며, 여성 사용자임을 확인합니다.", + style: AppTypography.body2.copyWith( color: AppColors.grey800, ), ), - SizedBox(width: AppGaps.gap16), - Flexible( - child: Text( - "본 서비스가 여성들끼리의 소중한 인연을 위한 플랫폼임을 이해했으며, 여성 사용자임을 확인합니다.", - style: AppTypography.body2.copyWith( - color: AppColors.grey800, - ), - ), + ), + ], + ), + SizedBox(height: AppGaps.gap20), + Row( + children: [ + Text( + "2", + style: AppTypography.subtitle3.copyWith( + color: AppColors.grey800, ), - ], - ), - SizedBox(height: AppGaps.gap20), - Row( - children: [ - Text( - "2", - style: AppTypography.subtitle3.copyWith( + ), + SizedBox(width: AppGaps.gap16), + Flexible( + child: Text( + "여성이 아님에도 가입할 경우 발생하는 모든 법적 책임은 사용자 본인에게 있습니다.", + style: AppTypography.body2.copyWith( color: AppColors.grey800, ), ), - SizedBox(width: AppGaps.gap16), - Flexible( - child: Text( - "여성이 아님에도 가입할 경우 발생하는 모든 법적 책임은 사용자 본인에게 있습니다.", - style: AppTypography.body2.copyWith( - color: AppColors.grey800, - ), - ), + ), + ], + ), + SizedBox(height: AppGaps.gap20), + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + "위 안내사항을 모두 확인하였습니다.", + style: AppTypography.subtitle2.copyWith( + color: + viewModel.isChecked + ? AppColors.grey800 + : AppColors.grey400, ), - ], - ), - SizedBox(height: AppGaps.gap20), - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Text( - "위 안내사항을 모두 확인하였습니다.", - style: AppTypography.subtitle2.copyWith( - color: viewModel.isChecked - ? AppColors.grey800 - : AppColors.grey400, - ), + ), + IconButton( + onPressed: () { + notifier.toggle(); + }, + icon: Icon( + Icons.check_circle_outline, + color: + viewModel.isChecked + ? AppColors.grey800 + : AppColors.grey400, ), - IconButton( - onPressed: () { - notifier.toggle(); - }, - icon: Icon( - Icons.check_circle_outline, - color: viewModel.isChecked - ? AppColors.grey800 - : AppColors.grey400, - ), + ), + ], + ), + SizedBox(height: AppGaps.gap20), + ConfirmButton( + enabled: viewModel.isChecked, + onPressed: () { + Navigator.push( + context, + MaterialPageRoute( + builder: (context) => const CongratulationPage(), ), - ], - ), - SizedBox(height: AppGaps.gap20), - ConfirmButton( - enabled: viewModel.isChecked, - onPressed: () { - Navigator.push( - context, - MaterialPageRoute( - builder: (context) => - const CongratulationPage(), - ), - ); - }, - ), - ], - ), + ); + }, + ), + ], ), ), - ); - }, - ); - }); + ), + ); + }, + ); + }, + ); } Widget _buildInformationField() { @@ -244,9 +246,7 @@ class WomanVerificationPage extends ConsumerWidget { alignment: Alignment.center, color: AppColors.grey100, child: Padding( - padding: const EdgeInsets.symmetric( - horizontal: AppGaps.gap16, - ), + padding: const EdgeInsets.symmetric(horizontal: AppGaps.gap16), child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start, diff --git a/lib/main.dart b/lib/main.dart index 335e24e..c30236d 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,5 +1,6 @@ import 'package:code_l/auth/presentation/pages/login/login_page.dart'; import 'package:code_l/auth/presentation/pages/terms_and_conditions/terms_and_condition_page.dart'; +import 'package:code_l/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart'; import 'package:firebase_core/firebase_core.dart'; import 'package:flutter/material.dart'; import 'package:flutter_dotenv/flutter_dotenv.dart'; @@ -26,8 +27,9 @@ class MyApp extends StatelessWidget { Widget build(BuildContext context) { return MaterialApp( title: 'Kakao Login Demo', - home: const TermsAndConditionPage(), - theme: ThemeData(primarySwatch: Colors.blue, + home: const ProfileInterestPage(), + theme: ThemeData( + primarySwatch: Colors.blue, scaffoldBackgroundColor: Colors.white, ), ); diff --git a/lib/sign_up/presentation/pages/code_age/code_age_page.dart b/lib/sign_up/presentation/pages/code_age/code_age_page.dart index 2a6e6f5..e31e794 100644 --- a/lib/sign_up/presentation/pages/code_age/code_age_page.dart +++ b/lib/sign_up/presentation/pages/code_age/code_age_page.dart @@ -17,66 +17,76 @@ class CodeAgePage extends StatelessWidget { final isValid = true; // todo 상태관리 return Scaffold( - appBar: SignUpAppBar(), - bottomNavigationBar: Padding( - padding: const EdgeInsets.all(AppGaps.gap20), - child: ConfirmButton( - enabled: isValid, - onPressed: () { - Navigator.push( - context, - MaterialPageRoute(builder: (context) => CodeJobPage()), - ); - }, - ), + appBar: SignUpAppBar(), + bottomNavigationBar: Padding( + padding: const EdgeInsets.all(AppGaps.gap20), + child: ConfirmButton( + enabled: isValid, + onPressed: () { + Navigator.push( + context, + MaterialPageRoute(builder: (context) => CodeJobPage()), + ); + }, ), - body: SafeArea( - child: Padding( - padding: const EdgeInsets.symmetric( - horizontal: AppGaps.gap24, vertical: AppGaps.gap40), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - SizedBox(height: screenHeight * 0.05), - Text("나이를", style: AppTypography.header1), - Text("입력해주세요", style: AppTypography.header1), - SizedBox(height: AppGaps.gap12), - SizedBox(height: AppGaps.gap40 + AppGaps.gap40 + AppGaps.gap40), - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - TextField( - decoration: InputDecoration( - hintText: '나이를 입력해주세요', - hintStyle: AppTypography.header2 - .copyWith(color: AppColors.grey400), - contentPadding: - EdgeInsets.symmetric(vertical: AppGaps.gap8), - border: UnderlineInputBorder( - borderSide: - BorderSide(color: AppColors.grey400, width: 0.6), + ), + body: SafeArea( + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: AppGaps.gap24, + vertical: AppGaps.gap40, + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox(height: screenHeight * 0.05), + Text("나이를", style: AppTypography.header1), + Text("입력해주세요", style: AppTypography.header1), + SizedBox(height: AppGaps.gap12), + SizedBox(height: AppGaps.gap40 + AppGaps.gap40 + AppGaps.gap40), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + TextField( + decoration: InputDecoration( + hintText: '나이를 입력해주세요', + hintStyle: AppTypography.header2.copyWith( + color: AppColors.grey400, + ), + contentPadding: EdgeInsets.symmetric( + vertical: AppGaps.gap8, + ), + border: UnderlineInputBorder( + borderSide: BorderSide( + color: AppColors.grey400, + width: 0.6, ), - enabledBorder: UnderlineInputBorder( - borderSide: - BorderSide(color: AppColors.grey400, width: 0.6), + ), + enabledBorder: UnderlineInputBorder( + borderSide: BorderSide( + color: AppColors.grey400, + width: 0.6, ), - focusedBorder: UnderlineInputBorder( - borderSide: BorderSide( - color: AppColors.grey400, - width: 0.6, - ), + ), + focusedBorder: UnderlineInputBorder( + borderSide: BorderSide( + color: AppColors.grey400, + width: 0.6, ), - suffixIcon: IconButton( - icon: Icon(Icons.clear, size: 16), - onPressed: () => {/*todo 삭제버튼*/}), + ), + suffixIcon: IconButton( + icon: Icon(Icons.clear, size: 16), + onPressed: () => {/*todo 삭제버튼*/}, ), ), - SizedBox(height: AppGaps.gap4), - ], - ), - ], - ), + ), + SizedBox(height: AppGaps.gap4), + ], + ), + ], ), - )); + ), + ), + ); } } diff --git a/lib/sign_up/presentation/pages/code_job/code_job_page.dart b/lib/sign_up/presentation/pages/code_job/code_job_page.dart index 312ff63..fcfa1b4 100644 --- a/lib/sign_up/presentation/pages/code_job/code_job_page.dart +++ b/lib/sign_up/presentation/pages/code_job/code_job_page.dart @@ -47,7 +47,9 @@ class _JobSelectionPageState extends ConsumerState { body: SafeArea( child: Padding( padding: const EdgeInsets.symmetric( - horizontal: AppGaps.gap24, vertical: AppGaps.gap40), + horizontal: AppGaps.gap24, + vertical: AppGaps.gap40, + ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ @@ -61,42 +63,47 @@ class _JobSelectionPageState extends ConsumerState { mainAxisSpacing: 12, crossAxisSpacing: 12, childAspectRatio: 1.1, - children: jobList.map((job) { - final isSelected = selectedJob == job['label']; - return GestureDetector( - onTap: () { - setState(() => selectedJob = job['label']); - }, - child: Container( - decoration: BoxDecoration( - color: isSelected - ? AppColors.primaryLight - : AppColors.grey100, - border: Border.all( - color: isSelected - ? AppColors.primary - : AppColors.grey100, - width: 1.5, - ), - borderRadius: BorderRadius.circular(8), - ), - padding: EdgeInsets.symmetric(vertical: 16), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Image.asset( - job['image']!, - width: 16, - height: 22, + children: + jobList.map((job) { + final isSelected = selectedJob == job['label']; + return GestureDetector( + onTap: () { + setState(() => selectedJob = job['label']); + }, + child: Container( + decoration: BoxDecoration( + color: + isSelected + ? AppColors.primaryLight + : AppColors.grey100, + border: Border.all( + color: + isSelected + ? AppColors.primary + : AppColors.grey100, + width: 1.5, + ), + borderRadius: BorderRadius.circular(8), ), - SizedBox(height: AppGaps.gap4), - Text(job['label'] ?? '', - style: AppTypography.body2), - ], - ), - ), - ); - }).toList(), + padding: EdgeInsets.symmetric(vertical: 16), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Image.asset( + job['image']!, + width: 16, + height: 22, + ), + SizedBox(height: AppGaps.gap4), + Text( + job['label'] ?? '', + style: AppTypography.body2, + ), + ], + ), + ), + ); + }).toList(), ), ), ], diff --git a/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_drink_page.dart b/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_drink_page.dart index 22981d9..76147d2 100644 --- a/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_drink_page.dart +++ b/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_drink_page.dart @@ -22,21 +22,21 @@ class _CodeLifestyleDrinkPageState extends State { Widget build(BuildContext context) { final screenHeight = MediaQuery.of(context).size.height; final isValid = true; - final drinkOptions = [ - '음주는 안해요', - '약속 있을 때만 먹어요', - '음주를 즐기는 매니아', - '금주중', - ]; + final drinkOptions = ['음주는 안해요', '약속 있을 때만 먹어요', '음주를 즐기는 매니아', '금주중']; return Scaffold( appBar: SignUpAppBar(), bottomNavigationBar: Padding( padding: const EdgeInsets.all(AppGaps.gap20), - child: ConfirmButton(enabled: selectedIndex != null,onPressed: () { Navigator.push( - context, - MaterialPageRoute(builder: (context) => CodeLifestyleSmokePage()), - );}, ), + child: ConfirmButton( + enabled: selectedIndex != null, + onPressed: () { + Navigator.push( + context, + MaterialPageRoute(builder: (context) => CodeLifestyleSmokePage()), + ); + }, + ), ), body: SafeArea( child: Padding( @@ -47,15 +47,17 @@ class _CodeLifestyleDrinkPageState extends State { SizedBox(height: screenHeight * 0.05), Text("음주 하시나요?", style: AppTypography.header1), SizedBox(height: AppGaps.gap12), - Text("일주일에 얼마나 음주를 즐기시나요?", style: AppTypography.body2.copyWith( - color: AppColors.grey600, - )), + Text( + "일주일에 얼마나 음주를 즐기시나요?", + style: AppTypography.body2.copyWith(color: AppColors.grey600), + ), SizedBox(height: AppGaps.gap40), Expanded( child: ListView.separated( itemCount: drinkOptions.length, - separatorBuilder: (_, __) => const SizedBox(height: AppGaps.gap16), + separatorBuilder: + (_, __) => const SizedBox(height: AppGaps.gap16), itemBuilder: (context, index) { final item = drinkOptions[index]; final isSelected = selectedIndex == index; @@ -67,12 +69,21 @@ class _CodeLifestyleDrinkPageState extends State { }); }, child: Container( - padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20), + padding: const EdgeInsets.symmetric( + vertical: 18, + horizontal: 20, + ), decoration: BoxDecoration( border: Border.all( - color: isSelected ? AppColors.primary : AppColors.grey400, + color: + isSelected + ? AppColors.primary + : AppColors.grey400, ), - color: isSelected ? AppColors.primaryLight : AppColors.white, + color: + isSelected + ? AppColors.primaryLight + : AppColors.white, ), child: Row( children: [ @@ -81,8 +92,8 @@ class _CodeLifestyleDrinkPageState extends State { Text( drinkOptions[index], style: AppTypography.body2.copyWith( - color:AppColors.grey800 - ) + color: AppColors.grey800, + ), ), ], ), diff --git a/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_smoke_page.dart b/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_smoke_page.dart index ffafcb7..2ed14aa 100644 --- a/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_smoke_page.dart +++ b/lib/sign_up/presentation/pages/code_lifestyle/code_lifestyle_smoke_page.dart @@ -1,4 +1,3 @@ - import 'package:code_l/sign_up/presentation/pages/code_lifestyle/widgets/code_lifestyle_check_icon.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; @@ -35,10 +34,15 @@ class _CodeLifestyleDrinkPageState extends State { appBar: SignUpAppBar(), bottomNavigationBar: Padding( padding: const EdgeInsets.all(AppGaps.gap20), - child: ConfirmButton(enabled: selectedIndex != null,onPressed: () { Navigator.push( - context, - MaterialPageRoute(builder: (context) => CodeNamePage()), - );}, ), + child: ConfirmButton( + enabled: selectedIndex != null, + onPressed: () { + Navigator.push( + context, + MaterialPageRoute(builder: (context) => CodeNamePage()), + ); + }, + ), ), body: SafeArea( child: Padding( @@ -49,16 +53,18 @@ class _CodeLifestyleDrinkPageState extends State { SizedBox(height: screenHeight * 0.05), Text("흡연을 하시나요?", style: AppTypography.header1), SizedBox(height: AppGaps.gap12), - Text("흡연 여부를 알려주세요!", style: AppTypography.body2.copyWith( - color: AppColors.grey600, - )), + Text( + "흡연 여부를 알려주세요!", + style: AppTypography.body2.copyWith(color: AppColors.grey600), + ), // todo gap수정 SizedBox(height: AppGaps.gap40), Expanded( child: ListView.separated( itemCount: drinkOptions.length, - separatorBuilder: (_, __) => const SizedBox(height: AppGaps.gap16), + separatorBuilder: + (_, __) => const SizedBox(height: AppGaps.gap16), itemBuilder: (context, index) { final item = drinkOptions[index]; final isSelected = selectedIndex == index; @@ -70,22 +76,31 @@ class _CodeLifestyleDrinkPageState extends State { }); }, child: Container( - padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20), + padding: const EdgeInsets.symmetric( + vertical: 18, + horizontal: 20, + ), decoration: BoxDecoration( border: Border.all( - color: isSelected ? AppColors.primary : AppColors.grey400, + color: + isSelected + ? AppColors.primary + : AppColors.grey400, ), - color: isSelected ? AppColors.primaryLight : AppColors.white, + color: + isSelected + ? AppColors.primaryLight + : AppColors.white, ), child: Row( children: [ buildCheckIcon(isSelected), const SizedBox(width: 10), Text( - drinkOptions[index], - style: AppTypography.body2.copyWith( - color:AppColors.grey800 - ) + drinkOptions[index], + style: AppTypography.body2.copyWith( + color: AppColors.grey800, + ), ), ], ), diff --git a/lib/sign_up/presentation/pages/code_lifestyle/widgets/code_lifestyle_check_icon.dart b/lib/sign_up/presentation/pages/code_lifestyle/widgets/code_lifestyle_check_icon.dart index bf4e01f..49495bc 100644 --- a/lib/sign_up/presentation/pages/code_lifestyle/widgets/code_lifestyle_check_icon.dart +++ b/lib/sign_up/presentation/pages/code_lifestyle/widgets/code_lifestyle_check_icon.dart @@ -1,4 +1,3 @@ - import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; @@ -7,21 +6,21 @@ import '../../../../../core/utills/design/app_gaps.dart'; Widget buildCheckIcon(bool isSelected) { return Container( - width: AppGaps.gap24, - height: AppGaps.gap24, - decoration: BoxDecoration( - shape: BoxShape.circle, - border: Border.all( - color: isSelected ?AppColors.grey800 : AppColors.grey400, - width: 1.6, - ), + width: AppGaps.gap24, + height: AppGaps.gap24, + decoration: BoxDecoration( + shape: BoxShape.circle, + border: Border.all( + color: isSelected ? AppColors.grey800 : AppColors.grey400, + width: 1.6, + ), + ), + child: Center( + child: Icon( + Icons.check, + size: AppGaps.gap16, + color: isSelected ? AppColors.grey800 : AppColors.grey400, ), - child: Center( - child: Icon( - Icons.check, - size: AppGaps.gap16, - color: isSelected ? AppColors.grey800 : AppColors.grey400 - ), - ) + ), ); } diff --git a/lib/sign_up/presentation/pages/code_name/code_name_page.dart b/lib/sign_up/presentation/pages/code_name/code_name_page.dart index b155be3..1900372 100644 --- a/lib/sign_up/presentation/pages/code_name/code_name_page.dart +++ b/lib/sign_up/presentation/pages/code_name/code_name_page.dart @@ -27,10 +27,7 @@ class CodeNamePage extends StatelessWidget { SizedBox(height: AppGaps.gap40 + AppGaps.gap40), _buildCodeNameInputField(isValid, TextEditingController()), Spacer(), - ConfirmButton( - enabled: isValid, - onPressed: () {}, - ), + ConfirmButton(enabled: isValid, onPressed: () {}), ], ), ), @@ -48,16 +45,16 @@ Widget _buildHeaderText() { SizedBox(height: AppGaps.gap12), Text( "한글, 숫자 최대 10자 / 공백, 영문, 특수기호 불가", - style: AppTypography.body2.copyWith( - color: AppColors.grey600, - ), + style: AppTypography.body2.copyWith(color: AppColors.grey600), ), ], ); } Widget _buildCodeNameInputField( - bool isValid, TextEditingController controller) { + bool isValid, + TextEditingController controller, +) { return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ diff --git a/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart b/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart index cd20e29..99b0f5f 100644 --- a/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart +++ b/lib/sign_up/presentation/pages/profile_interest/profile_intereset_page.dart @@ -16,13 +16,26 @@ class ProfileInterestPage extends StatefulWidget { class _ProfileInterestPageState extends State { // todo 상태관리 final List interestOptions = [ - '게임 🎮', '방탈출/보드게임 🎲', '야외활동 🚴', - '운동 🏋️', '독서 & 글쓰기 📚✍️', '음악 & 악기 🎵🎸', - '영화 🎬', '캠핑 🏕️', 'OTT/드라마 📺', - '여행 ✈', '요리 🍳', '맛집 탐방 🍽', - '패션 & 뷰티 👗💄', '쇼핑 🛍', '동물 🐶🐱', - 'IT기술 💻', '댄스 & 퍼포먼스 💃🕺', '인테리어 & DIY 🏠🔨', - '사지 & 영상 제작 🎥', '전시관람 🖼' + '게임 🎮', + '방탈출/보드게임 🎲', + '야외활동 🚴', + '운동 🏋️', + '독서 & 글쓰기 📚✍️', + '음악 & 악기 🎵🎸', + '영화 🎬', + '캠핑 🏕️', + 'OTT/드라마 📺', + '여행 ✈', + '요리 🍳', + '맛집 탐방 🍽', + '패션 & 뷰티 👗💄', + '쇼핑 🛍', + '동물 🐶🐱', + 'IT기술 💻', + '댄스 & 퍼포먼스 💃🕺', + '인테리어 & DIY 🏠🔨', + '사지 & 영상 제작 🎥', + '전시관람 🖼', ]; final List selectedIndexes = []; @@ -36,7 +49,10 @@ class _ProfileInterestPageState extends State { return Scaffold( appBar: SignUpAppBar(), bottomNavigationBar: Padding( - padding: const EdgeInsets.symmetric(horizontal: AppGaps.gap20, vertical: 34), + padding: const EdgeInsets.symmetric( + horizontal: AppGaps.gap20, + vertical: 34, + ), child: ConfirmButton( enabled: isValid, onPressed: () { @@ -73,7 +89,7 @@ class _ProfileInterestPageState extends State { runSpacing: 12, children: List.generate(interestOptions.length, (index) { final isSelected = selectedIndexes.contains(index); - + return GestureDetector( onTap: () { setState(() { @@ -87,12 +103,21 @@ class _ProfileInterestPageState extends State { }); }, child: Container( - padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 16), + padding: const EdgeInsets.symmetric( + vertical: 10, + horizontal: 16, + ), decoration: BoxDecoration( border: Border.all( - color: isSelected ? AppColors.primary : AppColors.grey400, + color: + isSelected + ? AppColors.primary + : AppColors.grey400, ), - color: isSelected ? AppColors.primaryLight : AppColors.white, + color: + isSelected + ? AppColors.primaryLight + : AppColors.white, borderRadius: BorderRadius.circular(100), ), child: Text( @@ -114,4 +139,3 @@ class _ProfileInterestPageState extends State { ); } } - diff --git a/lib/sign_up/presentation/widgets/sign_up_confirm_button.dart b/lib/sign_up/presentation/widgets/sign_up_confirm_button.dart index e4df7d4..22bcd34 100644 --- a/lib/sign_up/presentation/widgets/sign_up_confirm_button.dart +++ b/lib/sign_up/presentation/widgets/sign_up_confirm_button.dart @@ -28,10 +28,12 @@ class ConfirmButton extends StatelessWidget { color: enabled ? AppColors.primary : AppColors.grey200, borderRadius: BorderRadius.circular(8), ), - child: Text(text, - style: AppTypography.subtitle2.copyWith( - color: enabled ? AppColors.white : AppColors.grey400, - )), + child: Text( + text, + style: AppTypography.subtitle2.copyWith( + color: enabled ? AppColors.white : AppColors.grey400, + ), + ), ), ); }