Scrollable prototype

Scrollable is a proto used to scroll generic content.
It displays a scroll bar if the content is too long for its size.

PROTO Scrollable [
  # Data
  field MFNode children []
  field SFBool enabled TRUE
  field	SFVec2f	size -1 -1 
  field	SFVec2f	contentSize -1 -1
  field	SFInt32	contentOffsetY 0
  # Style
  field MFString style ["Scrollable"]
]

Fields

MFNode children - Content to be scrolled.be Mandatory field.
SFVec2f size - Size of the scrollable proto. Mandatory field.
SFVec2f contentSize - Size of the content to scroll. Mandatory field.
SFBool enabled - If FALSE, key and touch events will be ignored. Default: TRUE.

Style

MFString style - Path to the CSS node associated to Scrollable proto

Warning:
Define style is required (we can use the default style - see Style node).

Scrollable {
  horizontal-align: middle;
  vertical-align: top;
}

ScrollBar

EXTERNPROTO SizeNotifier [] "SizeNotifier.wrl"
EXTERNPROTO Scrollable [] "Scrollable.wrl"

Group {
  children [
    
    DEF SIZE_NOTIFIER SizeNotifier {}
    
    Shape {
      appearance Appearance {
        material Material2D {
          emissiveColor 0.8 0.8 0.8
        }
      }
      geometry DEF BACKGROUND Rectangle {
        size 0 0
      }
    }
    
    DEF SCROLLABLE Scrollable {
      enabled TRUE
      contentSize 500 500
      children [
        Shape {
          appearance Appearance {
            material Material2D {
              emissiveColor 1.0 0.0 0.0
            }
          }
          geometry Rectangle {
            size 100 100
          }
        }
      ]
    }
    
    ROUTE SIZE_NOTIFIER.screenSize TO BACKGROUND.size
    ROUTE SIZE_NOTIFIER.screenSize TO SCROLLABLE.size
    
  ]
}