Today's goals

• Update from Wednesday
• Last bit about Essential Geometry
• Let's look at colorpicker
• Review and summarize core toolkit architecture

Event Dispatch

• Top-down, Bottom-Up, Bubble-out, Focused-based: these are theoretical Event dispatch.
• Android does it a bit differently.
• Capture is top-down: start on the in the biggest interactor that contains the event, then narrow in on which window actually will use the event
• Bubbling is bottom-up - start with the window at the front (the last drawn, lowest in the interactor tree) - see if the event is consumed by that interactor. If not, go up the tree.

Other comments

• layout varies depending on the specific layout container
  • ConstraintLayouts don't need multiple passes, it's a top down structure.
  • LinearLayout is post order for measure (measure the children, who first measure their children)
  • In general, have to look at implementation to know for sure.
• onDraw is usually pre-order (Intuitively leaf nodes should be 'on top' of parents)
• Capture is rarely used by component developers
• Bubbling is far more common
• Interface programmers just need to use callbacks, not worry about this stuff

Colorpicker assignment

View Update: Damage/Redraw

How does the toolkit know what to redraw?

What causes damage?

View Update: Damage/Redraw

How does the toolkit know what to redraw?

What causes damage?

View Update: Damage/Redraw

View Update: Damage/Redraw

View Update: Damage/Redraw

Never just draw: Why not?

View Update: Damage/Redraw

How does the toolkit know what to redraw?

• Let the component report: Damage/Redraw invoked by invalidate() or equivalent

View Update: Damage/Redraw

How does the toolkit know what to redraw?

• Let the component report (invalidate()) NOTE we are not calling onDraw() directly (important for your assignment)
• Aggregate
• Usually calculate bounding box

View Update: Draw/Redraw

Virtual device abstraction provided by windowing system

Component abstraction provided by toolkit

• Enforced using clipping
• Supported using coordinate system transformations

Drawing is recursive

• Makes it possible for parent to decorate kids
• Parent responsible for making kids think they are the center of the universe (translate)
• Clipping: intersect parent and child, also handled by parent

Core Toolkit Architecture

If damage do

• layout (may change)
  • position
  • size
• If damage do redraw
  • Union of damage (any of those can cause it) used to trigger redraw of anything inside that union
  • Drawing + clipping – standard drawing order, but only for things damaged; clipped to damage region
  • Clear damage

Using Essential Geometry as the basis for state

Using Essential Geometry as the basis for state

Scrollbar State machine with Essential Geometry

Let's try it for a button

You should have something like this

How do we implement this?

@Override
public boolean onTouch(MotionEvent e) {
  EssentialGeometry geometry = essentialGeometry(event);
  switch (state) {
    case State.START:
      if (geometry == Geometry.INSIDE && e.getAction() == MotionEvent.ACTION_DOWN) {
         indentButton();
         state = State.PRESSED;
         return true;
      }
      break;
    case PRESSED
      if (e.getAction() == MotionEvent.ACTION_MOVE) {
        if (geometry == Geometry.INSIDE) {
          indentButton();
          } else {
          normalButton();
        }
        return true;
      }
      else if (e.getAction() == MotionEvent.ACTION_UP) {
        state = State.START; // note we don't actually use the END state
        if (geometry == Geometry.INSIDE) {
          invokeAction();
        } else {
          cancelAction();
        }
        return true;
      }
      break;
    default:
      break;
  }
  return false;
}