สร้างแอป Sudoku บน Android ด้วย Kotlin และ Jetpack Compose

Jetpack Compose เป็น UI Toolkit สมัยใหม่ของ Android สร้าง UI ด้วย Kotlin เท่านั้น ไม่ต้องใช้ XML freeCodeCamp เผยแพร่คอร์ส 3.5 ชั่วโมง สอนสร้างแอป Sudoku ด้วย Compose พร้อมเรียนรู้ Graph Data Structures และ Algorithms โดย Ryan M. Kay (นักพัฒนาประสบการณ์สูง)

หัวข้อหลักในคอร์ส

Architecture: MV-Whatever (Model-View-Whatever), Repository Pattern, Clean Architecture
Domain Layer: Enum, Data Class, Sealed Class, Interface, Hash Code
Common Layer: Extension Functions, Open-Closed Principle, Abstract Class, Singleton, Coroutine Dispatchers
Persistence: File System Storage (Serializable), Jetpack Proto DataStore (Protocol Buffers)
UI Layer: Jetpack Compose Basics, Material Theming (Light/Dark), Typography, Shapes
UI Components: Reusable Toolbar, Loading Screen, Modifiers
Active Game Feature: ViewModel, Presentation Logic, Coroutines, Function Types, State Management
Computation Logic: Graph Data Structures & Algorithms สำหรับ Generate/Solve n×n Sudoku

โครงสร้างโปรเจกต์ (Package)

domain/          // Core models, interfaces, repository contracts
common/          // Shared utilities, extensions, base classes
persistence/     // Data storage implementations
ui/
  ├ components/  // Reusable composables (Toolbar, Loading)
  ├ activegame/  // Game screen, ViewModel, Logic, Container
  └ buildlogic/  // Dependency Injection (Manual)
computation/     // Graph algorithms for Sudoku generation/solving

จุดเด่นทางเทคนิค

1. Repository Pattern & Sealed Class Result Wrapper

ใช้ Interface (IGameRepository, ISettingsStorage) แยก Interface กับ Implementation ใช้ Sealed Class สำหรับ Result Wrapper (Success/Error) แทน Callback แบบเดิม

2. Proto DataStore กับ Protocol Buffers

เก็บ Settings และ Statistics ด้วย Proto DataStore เร็วกว่า SharedPreferences ใช้ .proto file กำหนด Schema Compiler สร้าง Java Class ให้อัตโนมัติ

3. File Storage ด้วย Serializable

เก็บ Game State (Sudoku Puzzle, Nodes, Elapsed Time) ลงไฟล์ท้องถิ่น ใช้ ObjectInputStream/OutputStream Domain Models implement Serializable

4. Jetpack Compose Theming (Light/Dark)

สร้าง Color.kt, Type.kt, Shape.kt, GraphSudokuTheme.kt ใช้ isSystemInDarkTheme() สลับธีมอัตโนมัติตามระบบ

5. Presentation Logic แยกจาก ViewModel

คลาส ActiveGameLogic (extends BaseLogic) จัดการ State, Coroutines, Timer, Backend Coordination ViewModel เป็น Passive View เก็บ State และ expose Function Types สำหรับ Observer Pattern



6. Coroutine Timer แบบ Custom
ใช้ launch { while(true) { action(); delay(1000) } } ควบคุมด้วย Job สำหรับ Cancel ได้ ไม่บล็อก Main Thread

7. Graph Algorithms สำหรับ Sudoku
แทน Sudoku เป็น Directed Colored Graph (Node = Tile, Color = Value, Edge = Constraint) ใช้ Adjacency List (LinkedHashMap<Int, LinkedList<SudokuNode>>) Hash Code = x*100 + y สำหรับ Key Unique

8. Animation & Transition ใน Compose
ใช้ updateTransition และ animateFloat สำหรับ Cross-fade ระหว่าง Loading, Active Game, Game Complete ใช้ ArgbEvaluator สำหรับ Color Interpolation บน Tip Description

ขั้นตอนสร้าง UI หลัก (ActiveGameScreen)

Root Composable: จัดการ State Machine (Loading / Active / Complete) ด้วย Transition Animation
Toolbar: Reusable Composable รับ Icon และ Click Handler จาก Parent
Sudoku Board: BoxWithConstraints คำนวณขนาด Tile ตามหน้าจอ ใช้ ConstraintLayout (Compose) วาง Tile 81 ช่อง (9×9)
Tile Rendering: แยก Read-only Tile (Clue) และ Editable Tile ใช้ remember + mutableStateOf สำหรับ Board State
Grid Lines: วาดเส้นกริดและ Sub-grid (3×3) ด้วย Modulo
Input Buttons: 1-9 + Erase จัด Layout ด้วย Row/Column
Timer & Difficulty Icons: แสดงเวลาและระดับความยาก


Dependency Injection แบบ Manual (Build Logic)
ไม่ใช้ Hilt/Dagger สร้าง buildActiveGameLogic() Extension Function บน Context สร้าง Instance ทั้งหมด (Repository, DataStore, Dispatcher, Logic, ViewModel) ส่งเข้า Activity Container

สรุป
คอร์สนี้ครอบคลุม Full-stack Android Development สมัยใหม่: Architecture, Data Persistence, Modern UI (Compose), Algorithms, Testing เหมาะสำหรับนักพัฒนาที่ต้องการเลveled-up ทักษะ Kotlin และ Compose ดูคอร์สเต็มที่ freeCodeCamp.org YouTube (3.5 ชั่วโมง)