ScrollSketch Demo

ScrollSketch adds scroll bars to the right and bottom of sketch which enable scrolling the sketch. Clickable items will scroll automatically in response to changes in the scroll buttons but some coding changes are needed in standard graphic items.

class ScrollSketch
extends Draggable
which extends ClickablePanel
which extends Clickable

Adds a vertical and horizontal scrollbars to the sketch on the right and bottom. The user can use these bars to scroll the sketch.

All the Clickable items have been adapted to scroll so normally no extra coding is needed to allow them to scroll. However, standard Processing items like text, lines and rectangles need a little extra coding. All the x and y coordinates must be adapted to use the global sX_ and sY_ methods found in the Clickable package. For example, replace
text("Some text", 20, 40);
with
text("Some text", sX_(20), sY_(40));
If you don't want a Clickable item to scroll, have it call its setScrollable method. For example,
myButton.setScrollable(false);
For non-Clickable graphics like text, lines and rectangles, just don't use the sX_ and sY_ methods if they are not supposed to scroll.

The ScrollSketch graphics must be set up carefully. It should be the last item in the ClickableGroup. The scrollbars will not appear unless setupScrollSketch(...) is called in setup() "immediately" after the size of the sketch is specified. For example,

      ...
    ScrollSketch sWindow  = new ScrollSketch(...); 
    Clickable[] clickItems = {... other Clickable items ...,  sWindow};
    ClickableGroup clickGrp = new ClickableGroup(clickItems);
    Clickable[] dragItems = {.. other draggaable items ..., sWindow};
    Dragger dragGrp = new Dragger(dragItems);

    void setup() {
      size(450, 500);
      smooth();
      frameRate(15);
      sWindow.setupScrollSketch(false);  // assumes no menu
      sWindow.setProcessClicks(true);   // process clicks on scroll bar (optional)     ...

In addition, in draw(), the ScrollSketch should be the last thing drawn. This will be true if the ScrollSketch item is the last item in the Clickable group.

The Clickable.pde file contains global fields "soX"_and "soY_" which contain the current scrolling offsets. The global methods sX_() and sY_() are intended for the user's sketch. Every Clickable item has the methods sX() and sY() methods that carry out similar operations except these methods do not adjust the coordinates if the "scrollable" field has been set false.

In addition, the sWindow must be processed in the mousePressed() and mouseDragged() methods. Whenever dragging is used, the mouseReleased() method must be modified. The following code is appropriate when the only items that can be dragged are those that are extended from Draggable:

void mousePressed() {
  Draggable item;
  if (dragGrp.checkForDrag()) {
    item = (Draggable)dragGrp.getItemTracked();
    if (item != null) {
      item.readyForDrag(drag);
    }
  }
}  // mousePressed

void mouseDragged() {
  Draggable item;
  if (mousePressed) {
    item = (Draggable)dragGrp.getItemTracked();
    if (item != null) {
      item.moved(drag);
    }
  }
}  // mouseDragged

void mouseReleased() {
  if (dragGrp.getWasDragging())
    dragGrp.endDrag();
  else
    clickGrp.checkForClick();
}  // mouseReleased

See DraggableDemo.pde for appropriate coding for mousePressed() and mousedMoved() when items like Buttons are also dragged.

Additional fields The scroll windows

final int BAR_SIZE = 20 - Width and height of the scroll bars.
int scrollW, scrollH - The virtual size of scroll window - the maximum values of x and y that can be displayed in the window. (The scroll window is marked "Virtual Window" in the diagram.)
int winPaneWidth, winPaneHeigh - The area that actually is drawn after the scroll bars are inserted. (Marked "winPane" in the diagram.)
ScrollBar hScroll - The horizontal scroll bar.
ScrollBar vScroll - The vertical scroll bar.
Clickable canBeDragged - The scroll button of the appropriate ScrollBar if is currently draggable.
color btnColor - Color of the scroll button.

** ScrollSketch(int maxWidth, int maxHeight,)
color theColor, color theOverColor, color buttonColor)
- The constructor for ScrollSketch. It sets up scrolling for the sketch window. Vertical and horizontal scroll bars are used. The colors are the standard color, the color used when cursor is over the ScrollBar and the color used for the buttons in the scroll bars.

maxWidth and maxHeight are the maximum size of the scrolled sketch of which only a portion is shown. This gives the using sketch complete control over the dimensions of area to be scrolled in contrast to the next two simpler constructors which simply double the dimensions of the displayed screen.

Note: In Processing, width and height are undefined until setup is run. Hence the ScrollSketch's ScrollBars, can't be created until after the size is set. To complete the construction setupScrollSketch must be called in setup() "immediately" after the size has been set.

** ScrollSketch(color theColor, color theOverColor, color buttonColor)
- The constructor for ScrollSketch. It sets up scrolling for the sketch window. Vertical and horizontal scroll bars are used. The colors are the standard color, the color used when cursor is over the scroll bar and the color used for the buttons in scroll bar.

The width and height of the scrolled window is about twice the size of the displayed window.

** ScrollSketch()
- The constructor for ScrollSketch. It sets up scrolling for the sketch window. Vertical and horizontal scroll bars are used. Uses default colors for the bars and buttons.

The width and height of the scrolled window is about twice the size of the displayed window.

* void setupScrollSketch(boolean hasMenu)
- Completes the construction of a ScrollSketch by creating the scrollbars and setting some values. Unfortunately the width and height of the sketch are not known until they have been set at the beginning of the setup() method hence the size and position of the scrollbars cannot be determined until the size has been set. Use in the setup() method "immediately" after size(...,...). In addition, it adjusts the size of the vertical ScrollBar if a menu is used. "hasMenu" should be true if a menu is also used. If not, "hasMenu" should be false.

* void display()
- Displays the two scrollbars which do not scroll.

** void setVisible(boolean b)
- Sets the scroll bars as being visible true or false.

** void setEnabled(boolean b)
- Sets the two scroll bars as being enabled true or false.

* boolean isOver()
- Determines if the cursor is over either of the ScrollBars and returns true if so. Always returns false if stillSearching_ is false.

* boolean checkForClick()
- Checks to see if any part of either scroll bar has been clicked. If so, it updates the value of "soX_" or "soY_" as appropriate and sets "clicked" to true. Returns true if either has been clicked. Called directly or indirectly in the mouseReleased() method.

* boolean hasBeenClicked()
- Determines if either ScrollBar has been clicked. If so, return true after "clicked" is set to false. Called directly or indirectly in by the draw() method.

** boolean readyForDrag(Dragger theTracker)
- Determines if either scroll button has experienced a mousePressed event and could be dragged. Ignores clicks on the bars outside of the button. Sets the position of the appropriate scroll button and then sets the minimumForDrag to 0 and the drag boundaries to appropriate scroll bar. Called from mousePressed().

** boolean moved(Dragger theTracker)
- If the ScrollSketch is the current draggable item, it moves the appropriate button and returns true after updating the value of soY_ or soX_. It is called by mouseDragged().

** int getOffsetX() ()
- Returns the "soX_" which is to be subtracted from the x coordinate of scrolled things.

** int getOffsetY()
- Returns the "soY_" which is to be subtracted from the y coordinate of scrolled things.

Method use codes:

** This constructor or method is designed to be called in the user sketch.

* This method is normally not called in the user's sketch unless the Clickable item was not been included in a ClickableGroup. ClickableGroup automatically uses the method as needed. Exception: This method may be needed if the user is extending Clickable with a new class.

# This constructor or method is rarely used in the user program. In Java, it would probably marked "private". Clickable, ScrollBar, and some other abstract constructors would never be called directly by the user sketch because they do nothing useful unless the user is extending a class.

Inherited from DraggablePanel

Fields
upDownDivisor

Constructors
DraggablePanel, DraggablePanel

Methods
checkForClick, moved, readyForDrag

Inherited from ClickablePanel

Fields
clickX, clickY, invisible, wholeSkectch

Constructors
ClickablePanel, ClickablePanel, ClickablePanel

Methods
adjustPanel, checkForClick, display, drawOnPanel, getClickX, getClickY, getPanelX, getPanelY, isOver, setClickX, setClickY, setColor

Inherited from Clickable

Fields
NOTHING_CLICKED, COMBO_BUTTON, DISABLED_COLOR, borderColor, c, clicked, clickedItemNum, colorState, enabled, h, label, over, overC, scrollable, selected, selectedItemNum, visible, w, x, y

Constructors
Clickable

Methods
checkForClick, display, doNotSelect, getClickedItemNum, getColorState, getH, getItem, getLabel, getSelected, getSelectedItem, getSelectedItemLabel, getSelectedItemNum, getW, getX, getY, hasBeenClicked, hideSomething, isOver, setBorderColor, setColorState, setH, setLabel, setScrollable, setSelected, setSelectedItemNum, setEnabled, setVisible, setW, setX, setY, sX, sY

ScrollSketch Demo and Documentation