Drag & Drop Kanban Board in Compose Desktop | Kotlin Desktop #10

21views
2likes
0
16:29
T
Taught by Celeste AI - AI Coding Coach
View on YouTube
Description
Build a kanban task board with drag-and-drop in Kotlin Compose Desktop! Learn how to use dragAndDropSource, DragAndDropTarget, and mutableStateMapOf to create an interactive three-column board where you can drag task cards between To Do, In Progress, and Done columns. What You'll Learn: - dragAndDropSource modifier with long-press gesture detection - DragAndDropTransferable for carrying data between components - dragAndDropTarget with onDrop, onEntered, and onExited callbacks - Visual hover highlights for drop target feedback - mutableStateMapOf for reactive move/add/delete state management - AlertDialog for adding new tasks - LazyColumn with keyed items for efficient task lists Timestamps: 0:00 - Introduction 0:15 - Preview: What We're Building 0:45 - Project Setup (Gradle, Compose Dependencies) 2:14 - Task Model (Column Enum, Data Class) 3:02 - Task Card (Drag Source) 5:47 - Kanban Board (Drop Target, Columns, Dialog) 11:27 - Main & Compile 13:14 - Live Demo: Task Board in Action 14:29 - Recap & Key Takeaways 15:29 - Thanks for Watching Key Takeaways: 1. Source — dragAndDropSource with detectTapGestures(onLongPress) starts drag 2. Transfer — DragAndDropTransferable(StringSelection) carries data between source and target 3. Drop Target — dragAndDropTarget with DragAndDropTarget interface handles drops 4. Highlight — onEntered/onExited callbacks give visual feedback during drag hover 5. Map State — mutableStateMapOf provides reactive state for move/add/delete operations Previous Lesson: Lesson 09: Database & Storage https://youtube.com/... Next Lesson: Lesson 11: Navigation & Routing (coming soon) Tech Stack: Kotlin 2.1, Compose Multiplatform 1.7.3, Material3 Foundation Drag & Drop API (Experimental) Gradle 8.10, JVM 17+ Source Code: https://github.com/GoCelesteAI/kotlin_desktop_drag_drop Taught by CelesteAI If you found this helpful, please like and subscribe for more Kotlin Desktop tutorials! #kotlin #compose #desktop #material3 #dragAndDrop #kanban #taskBoard #tutorial #programming
Back to tutorials

Duration

16:29

Published

February 21, 2026

Added to Codegiz

March 15, 2026

Open in YouTube