Skip to content

humanapp/uil

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation


UIL v4.1.0

uil.js is a lightweight ui for javascript with a complete 3d display support.
totally customizable, only 6 events, auto resize
MAIN EXAMPLE

1 - init engine

var ui = new UIL.Gui( { w:300 } )

2 - add value

ui.add('title', { name:'Title'})
ui.add('bool', { name:'Bool' })
ui.add('color', { name:'Color', type:'rgba', value:[0,1,1,1]})
ui.add('slide', { name:'Slide', value:50})
let myList = ui.add('list', { name:'List', list:['i1', 'i2', ...]})

3 - add value with object reference

const obj = {
  name:'welcome to uil',
  value: 2,
  slider: 30,
  vector: { x:10, y:-30 }
}

ui.add( obj, 'string', { type:'string' })
ui.add( obj, 'value', { type:'number', min:0, max:10, precision:2, step:0.01 })
ui.add( obj, 'slider', { type:'slide' })
ui.add( obj, 'vector', { type:'number' })

4 - callback return the value

ui.add('number', { name:'Vector4', value:[0,0,0,0] }).onChange( function(v){ debug.innerHTML = v; } )

5 - you can reset all value

ui.clear();

6 - other examples

uil module

uil listen

uil color

uil stresstest

uil group

uil to canvas

uil to three

uil to three 2

7 - uil is on npm

npm i uil

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 98.5%
  • HTML 1.5%