|
Stateful Graphics |
  
|
|
Stateful Graphics |
|
So far, we've explored control graphics that add ways in which the user can control the subject, but there are many situations where user input is interpreted differently depending on the sequence of inputs received. It is usually desirable to have some form of dynamic visual feedback as the user interacts with a graphic, like changing it's colour when the mouse cursor hovers over it. This is typically achieved by defining a number of states and the conditions for transitioning between states for the object in question – a design known as the State pattern. In the Framework, graphics with state are driven by a special ControlGraphic called the StatefulCompositeGraphic.
The key here is that StatefulCompositeGraphic and GraphicState both implement the IMouseButtonHandler interface. The Framework calls the IMouseButtonHandler methods on StatefulCompositeGraphic upon mouse events such as MouseDown or MouseMove. However, instead of handling the events itself, StatefulCompositeGraphic routes those messages to it's currentGraphicState. That state class – which defines the current state of the subject graphic – is then responsible for transitioning to the next state when certain conditions (e.g. a mouse click, a hit test, etc.) are met.
Consider the measurment ROI graphics, which can be selected and focused (a focused graphic is one which the mouse cursor is hovering over) by the user. Each graphic can therefore be in one of four states – focused and selected, focused but not selected, selected but not focused, and neither. When the ROI is drawn by the user, it becomes selected and focused, and so its state is of the FocussedSelectedGraphicState type. From there, a number of things can happen:
| 1. | If the user moves the mouse away from the ROI such that it’s no longer in its “hit test zone”, the state transitions to SelectedGraphicState. If the user moves the mouse back over the ROI, the state transitions back to FocussedSelectedGraphicState. |
| 2. | If the user moves the mouse onto a nearby ROI and clicks down to select it, the state of the original ROI transitions first to SelectedGraphicState as the user moves out of the hit test zone, and then into the InactiveGraphicState when the other ROI becomes selected. |
| 3. | If the user now moves back over the original ROI, the state transitions to FocussedGraphicState – and if the user clicks down, it will transition back into FocussedSelectedGraphicState. |
With the underlying states of the ROI now defined, we can assign a certain display style in which the ROI should be drawn whenever the state transitions through one of these states. For example, the ROI graphic specifies that it is drawn in red whenever it is selected, orange if it is focused but not selected, and yellow at all other times, while any control graphic decorations such as control points are only shown if the graphic is focused.
It’s important to note that StatefulCompositeGraphic makes no assumptions about what actual GraphicStates exist, thus allowing a developer to derive his/her own GraphicStates and transitions if necessary. That said, the state machine described in the example above is actually so frequently used that the Framework defines the StandardStatefulGraphic and associated StandardGraphicState subclasses.
