Skip to content

Latest commit

 

History

History

imgui

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 

@thi.ng/imgui

npm (scoped) npm downloads Twitter Follow

This project is part of the @thi.ng/umbrella monorepo.

About

screenshot

Currently still bare-bones, but already usable & customizable immediate mode GUI implementation, primarily for @thi.ng/hdom-canvas and @thi.ng/webgl, however with no dependency on either.

Available components / widgets

  • Push button
  • Dropdown
  • Radio button group
  • Slider (horizontal / vertical)
  • Slider groups (horizontal / vertical)
  • Text input (single line, filtered input)
  • Text label
  • Toggle button
  • XY pad

All components are:

  • skinnable (via function args & global theme)
  • keyboard controllable (incl. focus switching)
  • support tooltips
  • partial touch support

Key controls

The entire UI is fully keyboard controllable:

Keys Description
Tab / Shift+Tab Switch focus
Enter / Space Activate focused button
Up / Down or drag mouse Adjust value (slider or XY pad)
Shift+Up/Down Adjust value (5x step)
Alt+Up/Down or drag mouse Adjust slider groups uniformly (all same value)
Alt+Left/Right Move cursor to prev/next word (text field)

Status

WIP - Alpha. Breaking changes ahead!

Installation

yarn add @thi.ng/imgui

Dependencies

Usage examples

WIP demo GUI, showcasing all available components (see above screenshot):

Live demo | Source code

import * as imgui from "@thi.ng/imgui";

Authors

  • Karsten Schmidt

License

© 2019 Karsten Schmidt // Apache Software License 2.0