05-830, User Interface Software, Spring, 2001
Lecture 8,   February 19, 2001
Copyright © 2001 - Brad Myers

Constraints

  Show videos of constraint solvers.

Constraints

• Relationships defined once and maintained by the system
• Useful for keeping parts of the graphics together.
• Typically expressed as arithmetic or code relationships among variables.
  • Variables are often the properties of objects (left, color)
• Types:
  • "Dataflow" constraints;  Choices:
    • Single-Output vs. Multi-output
    • Types: One-way, Multi-way, Simultaneous equations, Incremental, Special purpose
    • Cycles: supported or not
  • Others: AI systems, scheduling systems, etc.

One Way Constraints

• Simplest form of constraints
• D = F(I1, I2, ... In)
• Often called formulas since like spreadsheets
• Can be other dependencies on D

CurrentSliderVal = mouseX - scrollbar.left
scrollbar.left = window.left + 200
scrollbar.visible = window.has_focus

• Not just for numbers: mycolor = x.color
• Implementations:
  1. Just re-evaluate all required equations every time a value is requested
     • least storage, least overhead
     • Equations may be re-evaluated many times when not changed. (e.g, scrollbar.left when mouse moves)
     • cycles:
       file_position = F1(scrollbar.Val)
scrollbar.Val = F2(file_position)
     • Cannot detect when values change (for redraw)
  2. Cache current values with each constraint; lazy eval
     • Example:
       A = 10
B = A + 5
C = A * B
D = A + E
E = 20
F = D + C
     • now need to know when values become invalid and recalculate in right order
       
     • two phases: invalidate and re-calculate
       • invalidate all values that depend on the changed value
       • recalculate only values that are demanded
       • data structures: depends-on-me, i-depend-on
     • may re-evaluate values that haven't changed unnecessarily when conditionals, "max", etc.
     • can mark slots/objects that change
     • can detect cycles with a counter
• Variations:
  • Multiple outputs (D1, D2, ... Dm) = F(I1, I2, ... In)
  • Side-effects in the formulas
    • useful for creating objects
    • when happen?
    • what if create new objects with new constraints
    • cycles cannot be detected
  • Variables in the dependencies: D = p^.left + 10
    • important innovation in Garnet we invented, now ubiquitous
    • supports feedback objects
    • supports loops: D = Max(components^)
    • requires the dependencies be dynamically determined
  • Constant formula elimination
    • To decrease the size used by constraints

Two-Way (Multi-way) Constraints

• From ThingLab (~1979)
• Constraints are expressions with multiple variables
• Any may be modified to get the right values
• Example: A.right = A.left + A.width - 1
• Often requires programmer to provide methods for solving the constraint in each direction:
  A.left = A.right - A.width + 1
A.width = A.right - A.left + 1
• Useful if mouse expressed as a constraint
• Requires a planning step to decide which way to solve
  • Many systems compute plans and save them around since usually change same variable repeatedly
• In general, have a graph of dependencies, find a path through the graph
• How control which direction is solved?
  CurrentSliderVal = mouseX - scrollbar.left
  • "Constraint hierarchies" = priorities
    • constants, interaction use "stay" constraints with high priority
  • Dynamically add and remove constraints
• Brad Vander Zanden's "QuickPlan" solver
  • Handles multi-output, multi-way cyclic constraints in O(n2) time instead of exponential like previous algorithms

Simultaneous Equations

• Required for parallel, perpendicular lines; tangency, etc.
• Also for aggregate's size
• Numerical (relaxation) or symbolic techniques

Incremental

• Michael Gleicher's PhD thesis
• Only express forward computations
• Tries to get reverse by incrementally changing the forward computation in the right direction using derivatives.
• Supports interactions otherwise not possible
• Produces smooth animations

Special: Animation Constraints in Amulet

• Implemented using Amulet's constraint mechanism
• When slot set with a new value, restores old value, and animates from old to new value
• Usually, linear interpolation
• For colors, through either HSV or RGB space
• For visibility, various special effects between TRUE and FALSE

Back to 05-830 main page