Flutter Processing

A Flutter port of Processing.

This project is not affiliated with the Processing project, or related organizations.

The goal of flutter_processing is to provide the same easy learning environment as Processing, but with the additional utility of a production-ready UI toolkit, called Flutter. With traditional Processing, there is minimal professional value in the underlying language. With flutter_processing, the underlying tool, Flutter, is sufficient for employment as an app UI developer. flutter_processing offers an educational tool and an employment opportunity all in one.

Want to see how this project was implemented? Nearly every change was recorded and published to the SuperDeclarative! channel on YouTube.

---

Do you get value from this package? Please consider supporting SuperDeclarative!

---

Getting Started

To paint a canvas in Flutter, the way you would in Processing, display a Processing widget and implement a Sketch.

void main() {
  runApp(
    MaterialApp(
      home: Processing(
        sketch: Sketch.simple(
          setup: (sketch) async {
            // TODO: do your typical Sketch setup
            //       stuff here. Call methods on
            //       the provided sketch object.
          },
          draw: (sketch) async {
            // TODO: do your typical Sketch drawing
            //       stuff here. Call methods on
            //       the provided sketch object.
          },
        ),
      ),
    ),
  );
}

To retain and access variables in your Sketch, or to implement a Sketch in a more traditional way, subclass Sketch:

void main() {
  runApp(
    MaterialApp(
      home: Processing(
        sketch: MySketch(),
      ),
    ),
  );
}

class MySketch extends Sketch {
  @override
  Future<void> setup() async {
    // TODO: do setup stuff here
  }

  @override
  Future<void> draw() async {
    // TODO: do drawing stuff here
  }
}

Implemented Features

Structure

• thread()
• setup()
• draw()
• redraw()
• setLocation()
• setResizable()
• setTitle()
• loop()
• noLoop()
• push()
• pushStyle()
• pop()
• popStyle()
• exit()

Environment

• settings()
• width
• height
• size()
• pixelDensity()
• pixelHeight
• pixelWidth
• displayDensity()
• fullScreen()
• frameRate()
• frameRate
• frameCount
• cursor()
• noCursor()
• focused
• smooth()
• noSmooth()
• delay()

Data

Composite

• Array: Use List
• ArrayList: Use List
• FloatDict: Use Map<String, double>
• FloatList: Use List<double>
• HashMap: Use Dart's HashMap
• IntDict: Use Map<String, int>
• IntList: Use List<int>
• JSONArray: Use List<dynamic>
• JSONObject: Use Map<String, dynamic>
• Object: Use Dart's Object
• String: Use Dart's String
• StringDict: Use Map<String, String>
• StringList: use List<String>
• Table
• TableRow
• XML

Conversion

• binary()
• boolean()
• byte()
• char()
• float()
• hex()
• int()
• str()
• unbinary()
• unhex()

String Functions

• join()
• match()
• matchAll()
• nf()
• nfc()
• nfp()
• nfs()
• split()
• splitTokens()
• trim()

Array Functions

• append()
• arrayCopy()
• concat()
• expand()
• reverse()
• shorten()
• sort()
• splice()
• subset()

Shape

• createShape()
• loadShape()
• PShape

2D Primitives

• arc()
• circle()
• ellipse()
• line()
• point()
• quad()
• rect()
• square()
• triangle()

Curves

• bezier()
• bezierDetail()
• bezierPoint()
• bezierTangent()
• curve()
• curveDetail()
• curvePoint()
• curveTangent()
• curveTightness()

3D Primitives

• box()
• sphere()
• sphereDetail()

Attributes

• ellipseMode()
• rectMode()
• strokeCap()
• strokeJoin()
• strokeWeight()

Vertex

• beginContour()
• beginShape()
• bezierVertex()
• curveVertex()
• endContour()
• endShape()
• quadraticVertex()
• vertex()

Loading & Displaying

• shape()
• shapeMode()

Input

Mouse

• mouseButton
• mouseClicked()
• mouseDragged()
• mouseMoved()
• mousePressed()
• mousePressed: Use isMousePressed
• mouseReleased()
• mouseWheel()
• mouseX
• mouseY
• pmouseX
• pmouseY

Keyboard

• key
• keyCode
• keyPressed()
• keyPressed
• keyReleased()
• keyTyped()

Files

• BufferedReader
• createInput()
• createReader()
• launch()
• loadBytes()
• loadJSONArray()
• loadJSONObject()
• loadStrings()
• loadTable()
• loadXML()
• parseJSONArray()
• parseJSONObject()
• parseXML()
• selectFolder()
• selectInput()

Time & Date

• day()
• hour()
• millis()
• minute()
• month()
• second()
• year()

Output

Text Area

• print()
• printArray()
• println()

Image

• save()
• saveFrame()

Files

• beginRaw()
• beginRecord()
• createOutput()
• createWriter()
• endRaw()
• endRecord()
• PrintWriter
• saveBytes()
• saveJSONArray()
• saveJSONObject()
• saveStream()
• saveStrings()
• saveTable()
• saveXML()
• selectOutput()

Transform

• applyMatrix()
• popMatrix()
• printMatrix()
• pushMatrix()
• resetMatrix()
• rotate()
• rotateX()
• rotateY()
• rotateZ()
• scale()
• shearX()
• shearY()
• translate()

Lights, Camera

Lights

• ambientLight()
• directionalLight()
• lightFalloff()
• lights()
• lightSpecular()
• noLights()
• normal()
• pointLight()
• spotLight()

Camera

• beginCamera()
• camera()
• endCamera()
• frustum()
• ortho()
• perspective()
• printCamera()
• printProjection()

Coordinates

• modelX()
• modelY()
• modelZ()
• screenX()
• screenY()
• screenZ()

Material Properties

• ambient()
• emissive()
• shininess()
• specular()

Color

Setting

• background()
• clear()
• colorMode(): Use Flutter's Color objects instead.
• fill()
• noFill()
• noStroke()
• stroke()

Creating & Reading

• alpha()
• blue()
• brightness()
• color()
• green()
• hue()
• lerpColor()
• red()
• saturation()

Image

• createImage()
• PImage

Loading & Displaying

• image()
• imageMode()
• loadImage()
• noTint()
• requestImage()
• tint()

Textures

• texture()
• textureMode()
• textureWrap()

Pixels

• blend()
• copy()
• filter()
• get()
• loadPixels()
• pixels[]
• set()
• updatePixels()

Rendering

• blendMode()
• clip()
• createGraphics()
• hint()
• noClip()
• PGraphics

Shaders

• loadShader()
• PShader
• resetShader()
• shader()

Typography

• PFont

Loading & Displaying

• createFont()
• loadFont()
• text()
• textFont()

Attributes

• textAlign()
• textLeading()
• textMode()
• textSize()
• textWidth()

Metrics

• textAscent()
• textDescent()

Math

• PVector

Calculation

• abs()
• ceil()
• constrain()
• dist()
• exp()
• floor()
• lerp()
• log()
• mag()
• map()
• max()
• min()
• norm()
• pow()
• round()
• sq()
• sqrt()

Trigonometry

• acos()
• asin()
• atan()
• atan2()
• cos()
• degrees()
• radians()
• sin()
• tan()

Random

• noise()
• noiseDetail()
• noiseSeed()
• random()
• randomGaussian()
• randomSeed()

Constants

• HALF_PI
• PI
• QUARTER_PI
• TAU
• TWO_PI