DrawBox is a powerful, cross-platform drawing library built with Kotlin Multiplatform (KMP) and Jetpack Compose. Create beautiful drawings with an intuitive canvas experience across Android, iOS, Web, and Desktop.

• Multiplatform Support: Native support for Android, iOS, Web (WASM), and JVM platforms
• Multiple Drawing Modes: Freehand pen, rectangles, circles, triangles, arrows, and lines
• Rich Customization:
  • Customizable stroke size and color
  • Opacity/alpha control for transparency
  • Background color customization
• Full Undo/Redo support with history tracking
• Export Formats:
  • SVG export for vector graphics
  • JSON export for preserving drawing state
  • Bitmap export for raster images
• Reset and Clear canvas functionality
• Modern Architecture: MVI pattern with proper state management
• Easy Integration: Simple composable API with comprehensive documentation

@Composable
fun DrawingScreen() {
    val controller = rememberDrawBoxController()
    val state by controller.state.collectAsState()
    
    Column(modifier = Modifier.fillMaxSize()) {
        DrawBox(
            state = state,
            onIntent = controller::onIntent,
            modifier = Modifier.fillMaxSize().weight(1f)
        )
    }
}

// Drawing Modes
controller.setMode(Mode.PEN)          // Freehand drawing
controller.setMode(Mode.RECTANGLE)    // Rectangle shapes
controller.setMode(Mode.CIRCLE)       // Circle shapes
controller.setMode(Mode.TRIANGLE)     // Triangle shapes
controller.setMode(Mode.ARROW)        // Arrows
controller.setMode(Mode.LINE)         // Lines

// Customization
controller.setColor(Color.Blue)       // Set stroke color
controller.setStrokeWidth(5f)         // Set stroke width
controller.setOpacity(0.8f)           // Set transparency (0.0-1.0)
controller.setBgColor(Color.White)    // Set background color

// History Management
controller.undo()                     // Undo last action
controller.redo()                     // Redo last undone action
controller.reset()                    // Clear canvas

// Export & Import
controller.exportPath()               // Export as JSON
controller.exportSvg()                // Export as SVG
controller.importPath(jsonString)     // Import from JSON
controller.saveBitmap()               // Save as bitmap

// State Monitoring
controller.canUndo.collect { ... }    // Monitor undo availability
controller.canRedo.collect { ... }    // Monitor redo availability
controller.events.collect { event ->  // Listen to events
    when (event) {
        is Event.SvgExported -> saveFile(event.svg)
        is Event.PngSaved -> processImage(event.bitmap)
        is Event.Error -> showError(event.message)
        else -> {}
    }
}

Latest Version: 2.0.0-alpha02 (KMP Preview)

or grab via Gradle:

repositories {
    mavenCentral()
}

dependencies {
    implementation("io.ak1:drawbox:2.0.0-alpha02")
}

repositories {
    mavenCentral()
}

dependencies {
    implementation 'io.ak1:drawbox:2.0.0-alpha02'
}

<dependency>
  <groupId>io.ak1</groupId>
  <artifactId>drawbox</artifactId>
  <version>2.0.0-alpha02</version>
</dependency>

<dependency org='io.ak1' name='drawbox' rev='2.0.0-alpha02'>
  <artifact name='drawbox' ext='pom' ></artifact>
</dependency>

• Complete KMP rewrite - Now supports Android, iOS, Web (WASM), and JVM platforms with a single codebase
• Shared architecture - Core drawing logic and state management shared across all platforms
• Platform-specific implementations - Optimized image saving and rendering for each platform

• MVI Pattern: Modern state management with Model-View-Intent architecture
• Immutable State: Functional state updates ensure predictable behavior
• Event-Driven: Side effects handled through a reactive event system
• Type-Safe: Sealed classes for modes, intents, and events

• Multiple Drawing Modes: Draw rectangles, circles, triangles, arrows, and lines
• SVG Export: Export drawings as vector graphics for scalability
• Enhanced Customization: Control opacity, background color, and more
• Improved State Management: Better control over drawing history and canvas state
• Documentation: Auto-generated Dokka documentation for better API visibility
• Code Quality: Spotless code formatting for consistent style

RangVikalp for the beautiful color picker used in DrawBox

Licensed under the Apache License, Version 2.0, click here for the full license.

This project was created by Akshay Sharma.

If you appreciate my work, consider buying me a cup of ☕ to keep me recharged 🤘 by PayPal

I love using my work and I'm available for contract work. Freelancing helps to maintain and keep my open source projects up to date!