Skip to content

Latest commit

 

History

History
127 lines (106 loc) · 6.28 KB

README.md

File metadata and controls

127 lines (106 loc) · 6.28 KB
Raw

pUI

A Graphical User Interface Library for Processing

The goal of this project is to create a functional prototype for a new Graphical User Interface Library for Processing. There is no core GUI system built into Processing as of date but some third-party GUI solutions exist. This project attempts to learn from and build on the existing libraries while keeping in mind the design principles that lie at the heart of Processing: Minimalism, accessibility and extensibility. Ultimately the aim is to spark discussion on what a core GUI library for Processing might encompass.

Project Info: http://martinleopold.com/pui/
Full Project Description: http://static.martinleopold.com/gsoc13/
Source: https://github.com/martinleopold/pUI

CURRENT RELEASE: v0.3 (Test Release) Note: This is still alpha, so expect changes in the API.

DOWNLOAD: https://github.com/martinleopold/pUI/raw/v0.3/dist/pUI-643.zip

INSTALLATION:

  • Requires Processing 2.0 http://www.processing.org/download
  • If not already present, create a folder named "libraries" inside your Sketchbook folder. (The location of the sketchbook folder is shown in Processing's Preferences dialog)
  • Extract the .zip into the "libraries" folder. (There is one folder named "pUI" in the .zip)
  • Restart Processing

EXAMPLES:

  • In Processing click File -> Examples... then select Contributed Libraries/pUI and select an example

FEATURES:

  • GUI Overlay
  • Widgets: Button, Toggle, Slider, VSlider, Label, Divider
  • Create new widget by extending the Widget class
  • Automatic Column Based Layout
  • Color Themes
  • Connect Widgets to Methods and Fields
  • Chainable Methods

API

PUI

  • PUI.init(PApplet) : PUI // init the library with the sketch (e.g PUI.init(this))
  • size(int width, int height) : PUI // set the size of the GUI overlay in px
  • position(int x, int y) : PUI // set the position of the GUI overlay in px
  • addButton() : Button // add a Button
  • addToggle() : Toggle // add a Toggle
  • addSlider() : Slider // add a Slider (horizontal)
  • addVSlider() : VSlider // add a vertical Slider
  • addDivider() : Divider // add a Divider
  • addLabel(String text) : Label // add a Label
  • newRow() : PUI // following widgets will be created in the next row
  • newColumn() : PUI // following widgets will be created in another column
  • grid(int x, int y) : PUI // set grid unit in pixels
  • padding(float x, float y) : PUI // set padding (around all widgets) in grid units
  • columnWidth(float w) : PUI // set column width (in grid units). widgets including padding are fit in this width
  • columnGap(float g) : PUI // set gap between columns (in grid units)
  • show() : PUI // show GUI overlay
  • hide() : PUI // hide GUI overlay
  • toggle() : PUI // toggle GUI overlay
  • toggleGrid() : PUI // toggle drawing grid
  • font(String font) : PUI // set font by name (uses createFont())
  • font(PFont font) : PUI // set font
  • theme(int presetNo) : PUI // set color theme by number (numbers 0 to getNumThemes()-1)
  • theme(String themeName) : PUI // set color theme by name (array of names: getThemeNames())
  • numThemes() : int // get the number of preset color themes (for use with theme())
  • themeNames() : String[] // get the names of the preset color themes (for use with theme());

All Widgets

  • position(float x, float y) : <WidgetType> // set widget position in grid units
  • size(float width, float height)) : <WidgetType> // set widget size in grid units
  • onMouse(String method) : <WidgetType> // method to be called when a mouse event happens. Parameters: MouseEvent
  • onDraw(String method) : <WidgetType> // method to be called when the widget is drawn. Parameters: <WidgetType>
  • isActive() : boolean // true if the widget receives mouse and keyboard events
  • isVisible() : boolean // true if the widget is drawn
  • isHovered() : boolean // true if the mouse is over the widget
  • isClicked() : boolean // true if the widget is being clicked
  • isDragged() : boolean // true if the mouse is clicked and moved over the widget
  • activate() : <WidgetType> // enable receiving mouse and keyboard events
  • deactivate() : <WidgetType> // disable receiving mouse and keyboard events
  • show() : <WidgetType> // show the widget
  • hide() : <WidgetType> // hide the widget
  • positionX() : int // x coordinate of upper left hand corner
  • positionY() : int // y coordinate of upper left hand corner
  • width() : int // width of the widget in px
  • height() : int // height of the widget in px
  • mouseX() : int // x coordinate of last mouse position relative to upper left hand corner of the widget
  • mouseY() : int // y coordinate of last mouse position relative to upper left hand corner of the widget

Button

  • connect(String) : Button // connect the Button to all applicable methods and fields with the given name
  • calls(String) : Button // name of a method to be called when the button is clicked. Parameters: () or Button
  • sets(String) : Button // name of a field to set when the button value changes. Type: boolean
  • label(String) : Button // set label text
  • noLabel() : Button // remove the label
  • isPressed(boolean) : Button
  • isPressed() : boolean // true if the button is being pressed down

Toggle

  • connect(String) : Toggle // connect the Toggle to all applicable methods and fields with the given name
  • calls(String) : Toggle // method to be called when the toggle clicked. Parameters: boolean or Toggle
  • sets(String) : Toggle // name of a field to set when the toggle value changes. Type: boolean
  • label(String) : Toggle // set label text
  • noLabel() : Toggle // remove the label
  • isPressed(boolean) : Toggle
  • isPressed() : boolean // true if the toggle is on

Slider, VSlider

  • connect(String) : Slider // connect the Slider to all applicable methods and fields with the given name
  • calls(String) : Slider // method to be called when the value is changed. Parameters: float or Slider
  • sets(String) : Slider // name of a field to set when the slider value changes. Type: float
  • label(String): Slider // set label text
  • noLabel() : Slider // remove the label
  • min(float ) : Slider // set minimum value
  • max(float max) : Slider // set maximum value
  • value() : float // current value of the slider between 0 and 1

Label

  • text(String) : Label // set label text
  • small() : Label // use small size
  • medium() : Label // use medium size
  • large() : Label // use large size
  • text() : String