SOURCE CODE: Color Grid With Color Pickers

  
  
  
  
  
  
  
  







  
  UIZE JavaScript Framework



  

    JAVASCRIPT EXAMPLES
    Color Grid With Color Pickers
    

      
SOURCE
    
  

  

  

    
In this example, an instance of Uize.Widget.ColorGrid.Draggable provides a draggable color grid widget that shows the interpolated colors between four corner colors. Click-and-drag inside the grid to "smudge" the color space in different directions. Instances of Uize.Widgets.RgbSliders.Widget are wired up at each corner for changing the colors using sliders. The sliders control the grid, but dragging inside the grid also controls the sliders. Event handlers wire the widgets bidirectionally so their values stay in sync. Click the "AGITATE" button to randomize the corner colors.