Skip to content

Commit

Permalink
Merge pull request #61 from siiion/siiion@#58
Browse files Browse the repository at this point in the history
FEAT: 마이페이지 스크랩한 단어 화면 추가
  • Loading branch information
dayoung20 authored Jan 30, 2025
2 parents e18abe9 + ffbe968 commit cf8fbb1
Show file tree
Hide file tree
Showing 8 changed files with 792 additions and 173 deletions.
6 changes: 6 additions & 0 deletions economic_fe/lib/data/services/user_router.dart
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import 'package:economic_fe/view/screens/mypage/community_activity_page.dart';
import 'package:economic_fe/view/screens/mypage/my_learning_page.dart';
import 'package:economic_fe/view/screens/mypage/mypage_home_page.dart';
import 'package:economic_fe/view/screens/mypage/setting_page.dart';
import 'package:economic_fe/view/screens/mypage/wrong_quiz_page.dart';

import 'package:economic_fe/view/screens/onboarding/onboarding_card_page.dart';

Expand Down Expand Up @@ -216,6 +217,11 @@ class UserRouter {
name: '/learning',
page: () => const MyLearningPage(),
),
// 틀린 문제 다시 풀기
GetPage(
name: '/wrong',
page: () => const WrongQuizPage(),
),
],
),
];
Expand Down
315 changes: 151 additions & 164 deletions economic_fe/lib/view/screens/mypage/my_learning_page.dart
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import 'package:economic_fe/view/theme/palette.dart';
import 'package:economic_fe/view/widgets/custom_app_bar.dart';
import 'package:economic_fe/view/widgets/mypage/level_container.dart';
import 'package:economic_fe/view/widgets/word_list_view.dart';
import 'package:economic_fe/view_model/mypage/my_learning_controller.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
Expand Down Expand Up @@ -44,196 +46,181 @@ class _MyLearningPageState extends State<MyLearningPage> {
unselectedLabelColor: const Color(0xff767676),
indicatorColor: Colors.black,
indicatorWeight: 3.0,
indicatorSize: TabBarIndicatorSize.tab,
tabs: const [
Tab(text: '스크랩 한 퀴즈'),
Tab(text: '스크랩 한 학습'),
Tab(text: '틀린 문제'),
Tab(text: '스크랩 한 단어'),
],
),
),
// 레벨 선택
Padding(
padding: const EdgeInsets.only(top: 22, left: 15),
child: Row(
// 탭 컨텐츠
Expanded(
child: TabBarView(
controller: controller.tabController,
children: [
Obx(
() => LevelContainer(
level: '초급',
isSelected: controller.selectedLevel.value == '초급',
onTap: () => controller.updateSelectedLevel('초급'),
),
),
const SizedBox(width: 8),
Obx(
() => LevelContainer(
level: '중급',
isSelected: controller.selectedLevel.value == '중급',
onTap: () => controller.updateSelectedLevel('중급'),
),
),
const SizedBox(width: 8),
Obx(
() => LevelContainer(
level: '고급',
isSelected: controller.selectedLevel.value == '고급',
onTap: () => controller.updateSelectedLevel('고급'),
),
),
// 스크랩 한 퀴즈 화면
_buildQuizAndLearningTab(controller: controller),
// 스크랩 한 학습 화면
_buildQuizAndLearningTab(controller: controller),
// 스크랩 한 단어 화면
WordListView(controller: controller),
],
),
),
const SizedBox(height: 18),
// 버튼
Padding(
padding: const EdgeInsets.only(left: 16),
child: GestureDetector(
onTap: () {
// 버튼 클릭 시 동작
},
child: Obx(
() => Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
controller.buttonText.value,
style: const TextStyle(
color: Color(0xFF067BD5),
fontSize: 14,
fontWeight: FontWeight.w700,
height: 1.40,
letterSpacing: -0.35,
),
),
const SizedBox(width: 3),
const Icon(
Icons.arrow_circle_right,
color: Color(0xff067bd5),
size: 15,
),
],
),
Container(
width: controller.buttonText.value == '틀린 모든 문제 다시 풀기'
? 158
: 185,
height: 1,
color: const Color(0xff067bd5),
),
],
),
),
),
),
const SizedBox(height: 15),
// 탭별 데이터 리스트
Expanded(
child: Obx(
() => ListView.builder(
itemCount: controller.currentData.length,
itemBuilder: (context, index) {
final item = controller.currentData[index];
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16, vertical: 8),
child: Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: const Color(0xFFD9D9D9),
width: 1,
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item['category']!,
style: const TextStyle(
color: Color(0xFF767676),
fontSize: 14,
fontWeight: FontWeight.w400,
),
),
const SizedBox(height: 8),
Text(
item['title']!,
style: const TextStyle(
color: Color(0xFF404040),
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
],
),
GestureDetector(
onTap: () {},
child: const Icon(
Icons.bookmark,
color: Palette.buttonColorGreen,
),
),
],
),
),
);
},
),
),
),
],
),
),
);
}
}

class LevelContainer extends StatelessWidget {
final String level;
final bool isSelected;
final Function() onTap;

const LevelContainer({
class _buildQuizAndLearningTab extends StatelessWidget {
const _buildQuizAndLearningTab({
super.key,
required this.level,
required this.isSelected,
required this.onTap,
required this.controller,
});

final MyLearningController controller;

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 6),
decoration: ShapeDecoration(
color: isSelected ? const Color(0xFF1DB691) : Colors.white,
shape: RoundedRectangleBorder(
side: BorderSide(
width: 1,
color: isSelected
? Palette.buttonColorGreen
: const Color(0xFFD9D9D9)),
borderRadius: BorderRadius.circular(10),
return Column(
children: [
Padding(
padding: const EdgeInsets.only(top: 22, left: 15),
child: Row(
children: [
Obx(
() => LevelContainer(
level: '초급',
isSelected: controller.selectedLevel.value == '초급',
onTap: () => controller.updateSelectedLevel('초급'),
),
),
const SizedBox(width: 8),
Obx(
() => LevelContainer(
level: '중급',
isSelected: controller.selectedLevel.value == '중급',
onTap: () => controller.updateSelectedLevel('중급'),
),
),
const SizedBox(width: 8),
Obx(
() => LevelContainer(
level: '고급',
isSelected: controller.selectedLevel.value == '고급',
onTap: () => controller.updateSelectedLevel('고급'),
),
),
],
),
),
const SizedBox(height: 18),
// 버튼
Padding(
padding: const EdgeInsets.only(left: 16),
child: GestureDetector(
onTap: () {
// 버튼 클릭 시 동작
},
child: Obx(
() => Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
controller.buttonText.value,
style: const TextStyle(
color: Color(0xFF067BD5),
fontSize: 14,
fontWeight: FontWeight.w700,
height: 1.40,
letterSpacing: -0.35,
),
),
const SizedBox(width: 3),
const Icon(
Icons.arrow_circle_right,
color: Color(0xff067bd5),
size: 15,
),
],
),
Container(
width: 185,
height: 1,
color: const Color(0xff067bd5),
),
],
),
),
),
),
child: Text(
level,
style: TextStyle(
color: isSelected ? Colors.white : const Color(0xffa2a2a2),
fontSize: 14,
fontWeight: FontWeight.w600,
height: 1.50,
letterSpacing: -0.35,
const SizedBox(height: 15),
// 탭별 데이터 리스트
Expanded(
child: Obx(
() => ListView.builder(
itemCount: controller.currentData.length,
itemBuilder: (context, index) {
final item = controller.currentData[index];
return Padding(
padding:
const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: const Color(0xFFD9D9D9),
width: 1,
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item['category']!,
style: const TextStyle(
color: Color(0xFF767676),
fontSize: 14,
fontWeight: FontWeight.w400,
),
),
const SizedBox(height: 8),
Text(
item['title']!,
style: const TextStyle(
color: Color(0xFF404040),
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
],
),
GestureDetector(
onTap: () {},
child: const Icon(
Icons.bookmark,
color: Palette.buttonColorGreen,
),
),
],
),
),
);
},
),
),
),
),
],
);
}
}
14 changes: 12 additions & 2 deletions economic_fe/lib/view/screens/mypage/mypage_home_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -341,8 +341,18 @@ class _MypageHomePageState extends State<MypageHomePage> {
height: 28,
),
MyContentsContainer(
title: '나의 학습',
subTitle: '스크랩 한 퀴즈, 학습, 틀린 문제를 확인해요',
title: '틀린 문제 다시 풀기',
subTitle: '퀴즈에서 틀린 문제를 다시 풀 수 있어요',
onTap: () {
Get.toNamed('/mypage/wrong');
},
),
const SizedBox(
height: 12,
),
MyContentsContainer(
title: '스크랩 한 나의 학습',
subTitle: '스크랩 한 퀴즈, 학습, 단어를 확인해요',
onTap: () {
Get.toNamed('/mypage/learning');
},
Expand Down
Loading

0 comments on commit cf8fbb1

Please sign in to comment.