✨ Feat: 메인 학습페이지, 일별 학습 스크린 구현 및 네비게이션 수정

lib/utilities/app_routes.dart

@@ -13,6 +13,7 @@ abstract class Routes {
   static const PROFILE = '/profile';
   static const PROFILE_ACCOUNT = '/profile/account';
   static const PROFILE_LANGUAGE_SETTING = '/profile/language-setting';
+  static const STUDY = '/study';
 
   static final routes = [
     GetPage(

lib/viewModels/study/date_study_screen_viewmodel.dart

@@ -0,0 +1,24 @@
+import 'package:flutter/material.dart';
+
+class LearningSession {
+  final String type; // 세션 유형 (음소, 단어, 문장)
+  final DateTime createdDate; // 세션 생성 날짜
+  final String text; // 세션과 관련된 텍스트
+
+  LearningSession({required this.type, required this.createdDate, required this.text});
+}
+
+class DateStudyViewModel {
+  final DateTime date;
+
+  DateStudyViewModel({required this.date});
+
+  List<LearningSession> getSessions() {
+    // 실제 애플리케이션에서는 여기서 날짜에 따라 데이터를 조회하거나 필터링하는 로직을 구현할 수 있습니다.
+    return [
+      LearningSession(type: '음소', createdDate: DateTime(2024, 2, 12), text: "가"),
+      LearningSession(type: '단어', createdDate: DateTime(2024, 2, 13), text: "가다"),
+      LearningSession(type: '문장', createdDate: DateTime(2024, 2, 14), text: "가다 보면 길이 있다."),
+    ];
+  }
+}

lib/views/root/custom_bottom_navigation_bar.dart

@@ -28,13 +28,13 @@ class CustomBottomNavigationBar extends BaseWidget<RootViewModel> {
               mainAxisAlignment: MainAxisAlignment.spaceAround,
               children: [
                 _buildBottomNavigationBarItem(
-                  index: 0,
+                  index: 1,
                   size: 60,
                   svgPath: 'assets/icons/learning.svg',
                 ),
                 const SizedBox(width: 70),
                 _buildBottomNavigationBarItem(
-                  index: 1,
+                  index: 2,
                   size: 60,
                   svgPath: 'assets/icons/mypage.svg',
                 ),

lib/views/root/root_screen.dart

@@ -7,6 +7,7 @@ import '../../utilities/app_routes.dart';
 import '../../viewModels/root/root_viewmodel.dart';
 import '../base/base_screen.dart';
 import 'package:flutter_svg/flutter_svg.dart';
+import 'package:earlips/views/study/study_main.dart';
 
 class RootScreen extends BaseScreen<RootViewModel> {
   const RootScreen({super.key});
@@ -21,7 +22,8 @@ class RootScreen extends BaseScreen<RootViewModel> {
         index: viewModel.selectedIndex,
         children: [
           HomeScreen(),
-          const ProfileScreen(),
+          StudyMain(),
+          ProfileScreen(),
         ],
       ),
     );
@@ -50,7 +52,7 @@ class RootScreen extends BaseScreen<RootViewModel> {
         ),
         child: FloatingActionButton.large(
           onPressed: () {
-            Get.toNamed(Routes.HOME);
+            viewModel.changeIndex(0); // 홈 스크린으로 이동하기 위해 selectedIndex를 0으로 설정
           },
           elevation: 0,
           highlightElevation: 2,

lib/views/study/date_study_screen.dart

@@ -0,0 +1,96 @@
+import 'package:flutter/material.dart';
+import 'package:intl/intl.dart';
+// ViewModel import 경로는 실제 프로젝트 구조에 따라 달라질 수 있습니다.
+import 'package:earlips/viewModels/study/date_study_screen_viewmodel.dart';
+
+class DateStudyScreen extends StatelessWidget {
+  final DateTime date;
+  DateStudyScreen({Key? key, required this.date}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final viewModel = DateStudyViewModel(date: date);
+    final sessions = viewModel.getSessions();
+
+    return Scaffold(
+      appBar: AppBar(
+        title: Text(DateFormat('yyyy년 MM월 dd일').format(date)), // 동적으로 날짜를 표시
+        centerTitle: true,
+      ),
+      body: ListView.separated(
+        padding: const EdgeInsets.fromLTRB(25, 20, 25, 20),
+        itemCount: sessions.length,
+        itemBuilder: (context, index) {
+          var session = sessions[index];
+          return Container(
+            decoration: BoxDecoration(
+              color: Colors.white,
+              borderRadius: BorderRadius.circular(15.0),
+              boxShadow: [
+                BoxShadow(
+                  color: Colors.grey.withOpacity(0.5),
+                  spreadRadius: 1,
+                  blurRadius: 10,
+                  offset: Offset(0, 2),
+                ),
+              ],
+            ),
+            child: Column(
+              children: [
+                Container(
+                    alignment: Alignment.centerLeft,
+                    margin: EdgeInsets.only(left: 20.0, top: 16.0),
+                    child: _SmallCard(name: session.type)), // 세션 유형을 표시
+                ListTile(
+                  contentPadding: const EdgeInsets.only(left: 20, right: 20, bottom: 30),
+                  title: Container(
+                    alignment: Alignment.center,
+                    child: Text(
+                      session.text, // 세션과 관련된 텍스트를 표시
+                      style: const TextStyle(
+                        fontSize: 24.0,
+                        fontWeight: FontWeight.bold,
+                      ),
+                    ),
+                  ),
+                  onTap: () {
+                    // TODO: 세부 대본 학습 페이지로 이동하도록 구현
+                  },
+                ),
+              ],
+            ),
+          );
+        },
+        separatorBuilder: (context, index) => const SizedBox(height: 20),
+      ),
+    );
+  }
+}
+
+class _SmallCard extends StatelessWidget {
+  final String name;
+
+  const _SmallCard({Key? key, required this.name}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(4.0),
+        color: Color(0xFF1FA9DC),
+      ),
+      alignment: Alignment.center,
+      width: 50,
+      height: 20,
+      child: Text(
+        name,
+        style: TextStyle(
+          color: Colors.white,
+          fontSize: 14,
+          fontFamily: 'Pretendard-Bold',
+          fontWeight: FontWeight.bold,
+        ),
+      ),
+    );
+  }
+}

lib/views/study/study_main.dart

@@ -20,64 +20,70 @@ class StudyMain extends BaseScreen<StudyViewModel> {
               alignment: Alignment.center,
               child: Text('학습페이지')),
         ),
-        body: Column(
-          children: [
-            Container(
-              child: Container(
-                color: Color(0xFF),
-                child: Contribute(),
-                // child: ContributionWidget(),
+        body: SingleChildScrollView(
+          child: Column(
+            children: [
+              Container(
+                child: Container(
+                  color: Color(0xFF),
+                  child: Contribute(),
+                  // child: ContributionWidget(),
+                ),
               ),
-            ),
-            Container(
-
-                child: Column(
-
-                    children:[
-                      Row(
-                        children: [
-                          _Card(
-                            title: "음소 교정",
-                            subtitle: "옴소 교정 및 발음 테스트",
-                            imagePath: "assets/images/study/one.svg",
-                            onTap: (){
-                              Get.to(() => RealCreateScriptPage());
-                            },
-                          ),
-                          _Card(
-                            title: "단어 교정",
-                            subtitle: "단어 교정 및 발음 테스트",
-                            imagePath: "assets/images/study/2.svg",
-                            onTap: (){
-                              Get.to(() => RealCreateScriptPage());
-                            },
-                          ),
-                        ],
-                      ),
-                      Row(
-                        children: [
-                          _Card(
-                            title: "문장 교정",
-                            subtitle: "문장 교정 및 발음 테스트",
-                            imagePath: "assets/images/study/one.svg",
-                            onTap: (){
-                              Get.to(() => RealCreateScriptPage());
-                            },
-                          ),
-                          _Card(
-                            title: "문단 교정",
-                            subtitle: "대본 입력 및 발음 테스트",
-                            imagePath: "assets/images/study/one.svg",
-                            onTap: (){
-                              Get.to(() => RealCreateScriptPage());
-                            },
-                          ),
-                        ],
-                      ),
-                    ]
-                )
-            )
-          ],
+              Container(
+
+                  child: Column(
+
+                      children:[
+                        Row(
+                          children: [
+                            _Card(
+                              title: "음소 교정",
+                              subtitle: "옴소 교정 및 발음 테스트",
+                              imagePath: "assets/images/study/1.png",
+                              onTap: (){
+
+                              },
+                              ImgSize: 85,
+                            ),
+                            _Card(
+                              title: "단어 교정",
+                              subtitle: "단어 교정 및 발음 테스트",
+                              imagePath: "assets/images/study/2.png",
+                              onTap: (){
+
+                              },
+                              ImgSize: 150,
+                            ),
+                          ],
+                        ),
+                        Row(
+                          children: [
+                            _Card(
+                              title: "문장 교정",
+                              subtitle: "문장 교정 및 발음 테스트",
+                              imagePath: "assets/images/study/3.png",
+                              onTap: (){
+
+                              },
+                              ImgSize: 85,
+                            ),
+                            _Card(
+                              title: "문단 교정",
+                              subtitle: "대본 입력 및 발음 테스트",
+                              imagePath: "assets/images/study/4.png",
+                              onTap: (){
+
+                              },
+                              ImgSize: 85,
+                            ),
+                          ],
+                        ),
+                      ]
+                  )
+              )
+            ],
+          ),
         )
     );
   }
@@ -97,7 +103,9 @@ class _Card extends BaseWidget<StudyViewModel> {
   final String subtitle;
   final String imagePath;
   final VoidCallback onTap;
-  const _Card({super.key,required this.title, required this.subtitle, required this.imagePath, required this.onTap});
+  final double ImgSize;
+  const _Card({super.key,required this.title, required this.subtitle, required this.imagePath, required this.onTap ,
+  required this.ImgSize});
 
   @override
   Widget buildView(BuildContext context) {
@@ -118,12 +126,12 @@ class _Card extends BaseWidget<StudyViewModel> {
             Container(
               alignment: Alignment.center,
               margin: EdgeInsets.only(top: 20.0, bottom: 10.0),
-              child: SvgPicture.asset(
-                'assets/images/study/3.svg',
-                width: 85,
-                height: 85,
+              child: Image.asset(
+                imagePath,
+                width: ImgSize,
+                height: ImgSize,
               ),
-              width: 90,
+              width: ImgSize+5,
               height: 90,
             ),
             Text(title,
@@ -146,3 +154,4 @@ class _Card extends BaseWidget<StudyViewModel> {
     );
   }
 }
+