ScrollBar

Introduction

ScrollBar is a Forms control that lets the user select a numeric value by interacting with a draggable thumb, up/down buttons, and a track. It is most commonly used internally by ScrollViewer, which creates and manages a ScrollBar automatically. Use ScrollBar directly when you need a standalone scrollbar that is not tied to a ScrollViewer — for example, to control a custom camera offset or to expose a scrollable range in a data-driven panel.

If you want a scrollable container that manages content layout for you, use ScrollViewer instead.

ScrollBar control

Key Properties

• Value — The current numeric value. Always clamped between Minimum and Maximum. Set this in code to scroll the bar programmatically.

• Minimum — The lower bound of the range (inclusive). Defaults to 0.

• Maximum — The upper bound of the range (inclusive). Defaults to 100.

• SmallChange — The amount Value changes when the user clicks the up or down arrow buttons, or scrolls the mouse wheel over the scrollbar.

• LargeChange — The amount Value changes when the user clicks on the track (the area between the thumb and the arrow buttons).

Events

• ValueChanged — Raised whenever Value changes, regardless of whether the change came from the UI or from code.

• ValueChangeCompleted — Raised when a discrete value change finishes (e.g. after releasing the thumb or clicking an arrow button). Use this to avoid reacting every frame during a drag.

Code Example: Creating a Standalone ScrollBar

The following code creates a vertical ScrollBar, configures its range and change amounts, and subscribes to ValueChanged to react whenever the value is updated.

// Initialize
var label = new Label();
label.AddToRoot();
label.X = 50;
label.Y = 20;

var scrollBar = new ScrollBar();
scrollBar.AddToRoot();
scrollBar.X = 50;
scrollBar.Y = 50;
scrollBar.Width = 24;
scrollBar.Height = 200;
scrollBar.Minimum = 0;
scrollBar.Maximum = 100;
scrollBar.SmallChange = 5;
scrollBar.LargeChange = 20;
scrollBar.Value = 0;
scrollBar.ValueChanged += (_, _) =>
    label.Text = $"ScrollBar value: {scrollBar.Value}";

Try on XnaFiddle.NET

ScrollBar and ScrollViewer

In most cases you do not need to create a ScrollBar directly. ScrollViewer instantiates and manages one internally, and exposes VerticalScrollBarValue to read or set the scroll position in code. Use a standalone ScrollBar only when you need fine-grained control over a scrollable range that is not tied to a ScrollViewer's content panel.