diff --git a/lib/sign_up/presentation/pages/profile_lovestyle/profile_lovestyle_page.dart b/lib/sign_up/presentation/pages/profile_lovestyle/profile_lovestyle_page.dart new file mode 100644 index 0000000..0a9a834 --- /dev/null +++ b/lib/sign_up/presentation/pages/profile_lovestyle/profile_lovestyle_page.dart @@ -0,0 +1,214 @@ +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 ProfileLoveStylePage extends StatefulWidget { + const ProfileLoveStylePage({super.key}); + + @override + State createState() => _ProfileLoveStylePageState(); +} + +class _ProfileLoveStylePageState extends State { + int? selectedRelationshipIndex; + int? selectedAffectionIndex; + int? selectedCommunicationIndex; + int? selectedDateIndex; + int? selectedConflictIndex; + + final List relationshipStyles = [ + '천천히 알아가는 스타일 ⏳', + '만나면 운명이라고 믿는 직진형 💫', + '안정적이고 신뢰감 있는 연애 선호 🏡', + '서로의 성장과 자립을 중요시하는 스타일 🌱', + '항상 새롭고 설레는 연애를 추구하는 스타일 💃', + ]; + + final List communicationStyles = [ + '하루 종일 연락하는 스타일 📲', + '중요한 순간에만 연락하는 스타일 🕰', + '전화보다 톡을 선호하는 스타일 💬', + '하루 한 통이라도 진심을 담는 스타일 💌', + '상대가 필요할 때 항상 먼저 연락하는 스타일 🙋‍♂️', + ]; + + final List dateStyles = [ + '집에서 함께 영화 보는 홈 데이트 🏠', + '맛집 탐방하고 새로운 곳 찾기 🍔', + '야외활동이나 스포츠 즐기기 🚴‍♂️', + '문화생활 (전시회, 공연 등) 즐기기 🎭', + '계획적이고 철저한 데이트 스케줄러 📅', + '즉흥적으로 놀러 가는 스타일 🌍', + ]; + + final List conflictResolutionStyles = [ + '바로 대화해서 푸는 직설형💬', + '시간이 지난 후 차분하게 이야기하는 스타일🤫', + '상대방의 입장을 먼저 이해하는 배려형🤝', + '잘못을 빠르게 인정하고 사과하는 솔직형🙇‍♂️', + '화가 나도 조용히 마음을 가라앉히는 침착형🧘‍♀️', + ]; + + final List affectionExpressions = [ + '표현을 잘하는 직진형 💬', + '은근하게 마음을 전하는 무뚝뚝형 😎', + '말보다는 행동으로 표현하는 실천파 🚶‍♂', + '애교 많고 귀여운 스타일 🥰', + '진지하고 깊이 있는 스타일 🤔', + '다정다감한 배려형 💕', + ]; + + bool get isValid => + selectedRelationshipIndex != null && + selectedAffectionIndex != null && + selectedCommunicationIndex != null && + selectedDateIndex != null && + selectedConflictIndex != null; + + @override + Widget build(BuildContext context) { + final screenHeight = MediaQuery.of(context).size.height; + + return Scaffold( + appBar: const 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.symmetric(horizontal: AppGaps.gap20), + child: SingleChildScrollView( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox(height: screenHeight * 0.05), + Text("어떤 연애스타일을\n선호하시나요?", style: AppTypography.header1), + SizedBox(height: AppGaps.gap12), + Text( + "내가 선호하는 연애스타일을 선택해주세요", + style: AppTypography.body2.copyWith(color: AppColors.grey600), + ), + SizedBox(height: AppGaps.gap40), + Text("연애 가치관", style: AppTypography.subtitle1), + SizedBox(height: AppGaps.gap12), + ...List.generate( + relationshipStyles.length, + (index) => _buildSelectableItem( + text: relationshipStyles[index], + isSelected: selectedRelationshipIndex == index, + onTap: () { + setState(() { + selectedRelationshipIndex = index; + }); + }, + ), + ), + SizedBox(height: AppGaps.gap32), + Text("애정 표현", style: AppTypography.subtitle1), + SizedBox(height: AppGaps.gap12), + ...List.generate( + affectionExpressions.length, + (index) => _buildSelectableItem( + text: affectionExpressions[index], + isSelected: selectedAffectionIndex == index, + onTap: () { + setState(() { + selectedAffectionIndex = index; + }); + }, + ), + ), + SizedBox(height: AppGaps.gap32), + Text("연락", style: AppTypography.subtitle1), + SizedBox(height: AppGaps.gap12), + ...List.generate( + communicationStyles.length, + (index) => _buildSelectableItem( + text: communicationStyles[index], + isSelected: selectedCommunicationIndex == index, + onTap: () { + setState(() { + selectedCommunicationIndex = index; + }); + }, + ), + ), + SizedBox(height: AppGaps.gap32), + Text("데이트", style: AppTypography.subtitle1), + SizedBox(height: AppGaps.gap12), + ...List.generate( + dateStyles.length, + (index) => _buildSelectableItem( + text: dateStyles[index], + isSelected: selectedDateIndex == index, + onTap: () { + setState(() { + selectedDateIndex = index; + }); + }, + ), + ), + + SizedBox(height: AppGaps.gap32), + Text("갈등 해결", style: AppTypography.subtitle1), + SizedBox(height: AppGaps.gap12), + ...List.generate( + conflictResolutionStyles.length, + (index) => _buildSelectableItem( + text: conflictResolutionStyles[index], + isSelected: selectedConflictIndex == index, + onTap: () { + setState(() { + selectedConflictIndex = index; + }); + }, + ), + ), + ], + ), + ), + ), + ), + ); + } + + Widget _buildSelectableItem({ + required String text, + required bool isSelected, + required VoidCallback onTap, + }) { + return GestureDetector( + onTap: onTap, + child: Container( + width: double.infinity, + padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 8), + margin: const EdgeInsets.only(bottom: 12), + decoration: BoxDecoration( + color: isSelected ? AppColors.primaryLight : AppColors.grey100, + border: Border.all( + color: isSelected ? AppColors.primary : AppColors.grey300, + width: isSelected ? 1.0 : 0.0, + ), + borderRadius: BorderRadius.circular(8), + ), + child: Text( + text, + style: AppTypography.body2.copyWith(color: AppColors.grey800), + ), + ), + ); + } +}