Scrollbar Tutorial – Vertical Scrollbar Code

Scrollbar Tutorial – Vertical Scrollbar Code

This is a very short and very effective code that allows you to use a Vertical scrollbar in conjunction with a control container so the scrollbar scrolls the contents of the container.

As an example, use a picture box as the main container which becomes the viewing window. At the very right or left edge of the picture box will be the vertical scrollbar. Make the height of the scrollbar fill the entire height of the picture box. Within the picture box with be another container, typically the frame control. The frames height (and/or width) is set as high and as wide as necessary to hold all of the controls and elements.

verticalscrollbar example with picturebox container expanded

verticalscrollbar example with picturebox container expanded

Resize the picturebox to be as wide and as high as you wish the viewing area to be. Since the frame is a child of the picture box the visibility of its contents will be clipped by the picture box.

verticalscrollbar example with picturebox resized to desire viewing area

verticalscrollbar example with picturebox resized to desire viewing area

Use the following code below to scroll the contents of the frame within the picturebox.

[controlsContainer] in this example is the frame. Call this function from within the Vscroll_Change() and Vscroll_Scroll() events.