Skip to content

Create a "drawing pad" example guest application #22

@niklabh

Description

@niklabh

Description

The examples/ folder currently has a hello-world, audio player, timer demo, and a notes app. A drawing pad would be a great addition — it's visual, interactive, and showcases the canvas + input APIs working together.

What to build

A simple drawing app where the user can:

  1. Draw freehand — track mouse position each frame and draw lines/circles at the cursor
  2. Pick colors — use buttons or a simple palette to change the drawing color
  3. Clear the canvas — a "Clear" button to start over
  4. Adjust brush size — use a slider widget to control line thickness

APIs to use

  • canvas_clear, canvas_circle, canvas_line — for drawing
  • mouse_position, mouse_button_down — for tracking input
  • ui_button, ui_slider — for UI controls
  • on_frame — for the interactive frame loop

Structure

examples/drawing-pad/
├── Cargo.toml
└── src/
    └── lib.rs

Remember to add the crate to the workspace members in the root Cargo.toml.

Build & test

cargo build --target wasm32-unknown-unknown --release -p drawing-pad
# Open the .wasm in Oxide browser

Difficulty

Beginner to Intermediate — great way to learn the oxide-sdk APIs hands-on. A working drawing pad can be built in ~100-150 lines of Rust.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions