- Loading...
...
A Scroll View control permits the user view content that is bigger than the scroll view itself. The content inside Scroll View can be any other control or a set of controls like list, tree, table, text, picture, formatted text, etc. The user controls which part of content is visible through Scroll View by scrolling it vertically or horizontally.
Figure 1 Various appearances of Scroll View
Scroll View on desktop platform contains vertical and horizontal scroll bars that appear automatically when content size is bigger than the available scroll view size. Each scroll bar contains scroll arrows, scroll channel and scroll slider.
Figure 2 Scroll view components
...
Figure 3 Hidden horizontal or vertical scroll bar
Scroll view can also work in a mode when content width or height is fixed to the available width or height of scroll view. This is typically used for textual documents or lists when bidirectional scrolling is undesirable.
...
Figure 4 Content fits the scroll view width
In Fit Height mode, horizontal list’s (or any other content’s) height is fixed to the available height of scroll view. Horizontal scroll bar appears as needed.
Figure 5 Content fits the scroll view height
Scroll wheel or any other pointer device's direct scroll gestures work with scroll view when the pointer is above scroll view.
...
Figure 6 Scroll View components on Touch platform
...
Figure 7 Dragging and "over-scrolling" the scroll view border
Swipe gesture invokes accelerated scrolling with initial speed defined by the intensity of swipe gesture. The content scrolls in the swipe direction with the scrolling speed continuously decreasing after it has been released by swipe gesture until the content stops scrolling. When the content has been released and it reaches the border of the scroll view, it stops scrolling. The user can also stop the scrolling content with point gesture targeted into any part of content.
...
Figure 8 Swiping and "over-scrolling" the scroll view border
Note that Touch devices can rotate. Because of this, sizes of ScrollView should adjust automatically based on the available mode (Landscape or Portrait).
...
Figure 9 Scroll View components on 2D Traversal platform
...