✨Feat: 음소 화면

lib/views/phoneme/phoneme_screen.dart

@@ -0,0 +1,65 @@
+import 'package:earlips/models/phoneme_model.dart';
+import 'package:earlips/utilities/style/color_system.dart';
+import 'package:earlips/views/phoneme/widget/phoneme_list_widget.dart';
+import 'package:earlips/views/phoneme/widget/vowles_widget.dart';
+import 'package:earlips/views/word/widget/blue_back_appbar.dart';
+import 'package:earlips/views/word/widget/word_list_widget.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+class PhonemeScreen extends StatelessWidget {
+  final String title;
+  final int type;
+
+  const PhonemeScreen({super.key, required this.title, required this.type});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: PreferredSize(
+        preferredSize: const Size.fromHeight(kToolbarHeight),
+        child: BlueBackAppbar(title: title),
+      ),
+      body: const SingleChildScrollView(
+        child: Padding(
+          padding: EdgeInsets.all(8.0),
+          child: Column(
+            children: [
+              Column(
+                mainAxisAlignment: MainAxisAlignment.start,
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  SizedBox(height: 10),
+                  Padding(
+                    padding: EdgeInsets.symmetric(horizontal: 10),
+                    child: Text("Vowels", style: TextStyle(fontSize: 20)),
+                  ),
+                  VowelsWidget(
+                    type: 0,
+                  ),
+                  SizedBox(height: 20),
+                  Padding(
+                    padding: EdgeInsets.symmetric(horizontal: 10),
+                    child: Text("Consonants", style: TextStyle(fontSize: 20)),
+                  ),
+                  VowelsWidget(
+                    type: 1,
+                  ),
+                  SizedBox(height: 20),
+                  Padding(
+                    padding: EdgeInsets.symmetric(horizontal: 10),
+                    child: Text("R-Controlled vowels",
+                        style: TextStyle(fontSize: 20)),
+                  ),
+                  VowelsWidget(
+                    type: 2,
+                  ),
+                ],
+              ),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/views/phoneme/widget/vowles_widget.dart

@@ -0,0 +1,57 @@
+import 'package:earlips/models/phoneme_model.dart';
+import 'package:earlips/views/phoneme/phoneme_detail_screen.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+class VowelsWidget extends StatelessWidget {
+  final int type; // 0 for vowels, 1 for consonants, 2 for R-Controlled Vowels
+  const VowelsWidget({
+    required this.type,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    List<Phoneme> phonemes = _getPhonemeList();
+
+    return SizedBox(
+      height: 200,
+      child: GridView.builder(
+        padding: const EdgeInsets.all(10),
+        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+          crossAxisCount: 3,
+          crossAxisSpacing: 10,
+          mainAxisSpacing: 10,
+          childAspectRatio: 1,
+        ),
+        itemCount: phonemes.length,
+        itemBuilder: (context, index) {
+          return GestureDetector(
+            onTap: () {
+              Get.to(() => PhonemeDetailScreen(phoneme: phonemes[index]));
+            },
+            child: Card(
+              child: Center(
+                child: Text(phonemes[index].symbol,
+                    style: Theme.of(context).textTheme.titleLarge),
+              ),
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  List<Phoneme> _getPhonemeList() {
+    switch (type) {
+      case 0:
+        return vowels;
+      case 1:
+        return consonants;
+      case 2:
+        return rControlledVowels;
+      default:
+        return vowels; // Default to vowels if something goes wrong
+    }
+  }
+}