uislider

Create slider or range slider component

Syntax

sld = uislider

sld = uislider(style)

sld = uislider(parent)

sld = uislider(parent,style)

sld = uislider(___,Name,Value)

Description

sld = uislider creates a standard slider in a new figure window and returns the Slider object. MATLAB^® calls the uifigure function to create the figure.

sld = uislider(style) creates a slider of the specified style. Specify style as "range" to create a range slider instead of a standard one.

sld = uislider(parent) creates the slider in the specified parent container. The parent can be a Figure object or one of its child containers.

sld = uislider(parent,style) creates a slider of the specified style in the specified parent container.

sld = uislider(___,Name,Value) specifies Slider properties using one or more name-value arguments in addition to any of the input argument combinations in previous syntaxes. For example, uislider("Value",50) creates a slider with a value of 50.

Examples

Create Slider

Create a slider component in a UI figure.

fig = uifigure;
sld = uislider(fig);

Create Range Slider

Create a range slider in a UI figure.

fig = uifigure;
sld = uislider(fig,"range");

Create Vertical Slider

Create a vertical slider in a UI figure.

fig = uifigure;
sld = uislider(fig,"Orientation","vertical");

Set and Access Slider Properties

Create a slider in a UI figure. Set the slider value to 50.

fig = uifigure;
sld = uislider(fig,"Value",50);

Determine the current slider limits.

limits = sld.Limits

limits = 1×2

     0   100

Change the slider limits and set the value to 35.

sld.Limits = [-50 50];
sld.Value = 35;

Configure Slider Tick Marks

Create a slider in a UI figure.

fig = uifigure;
sld = uislider(fig);

Customize the slider appearance. Update the limits and major ticks to correspond to temperatures in degrees Fahrenheit and remove the minor ticks.

sld.Limits = [32 212];
sld.MajorTicks = [32 100 150 212];
sld.MajorTickLabels = sld.MajorTicks + "°F";
sld.MinorTicks = [];

Code Response to Moved Slider Thumb

Create an app with a slider and a gauge. When an app user moves the slider thumb and releases the mouse button, the needle of the gauge updates to reflect the slider value.

In a file named sliderApp.m, write a function that implements the app:

• Create a UI figure and a grid layout manager to lay out the app.

• Create a gauge and a slider in the grid layout manager.

• Write a callback function named updateGauge that changes the gauge value to match the slider value, and assign the function to the ValueChangedFcn callback property of the slider. For more information about callbacks, see Create Callbacks for Apps Created Programmatically.

function sliderApp
fig = uifigure("Position",[100 100 300 250]);
g = uigridlayout(fig);
g.RowHeight = {'1x','fit'};
g.ColumnWidth = {'1x','fit','1x'};

cg = uigauge(g);
cg.Layout.Row = 1;
cg.Layout.Column = [1 3];

sld = uislider(g, ...
    "ValueChangedFcn",@(src,event)updateGauge(src,event,cg));
sld.Layout.Row = 2;
sld.Layout.Column = 2;
end

function updateGauge(src,event,cg)
cg.Value = event.Value;
end

Run the sliderApp function and move the slider thumb. When you release the thumb, the value of the gauge updates.

sliderApp

Code Response to Moving Slider Thumb

Create an app with a plot and a range slider. When an app user moves either of the slider thumbs, the shaded region of the plot updates to reflect the range slider value.

In a file named rangeSliderApp.m, write a function that implements the app:

• Create a UI figure and a grid layout manager to lay out the app.

• Create UI axes and a range slider in the grid layout manager. Plot some data in the UI axes and create a filled region to highlight a portion of the data.

• Write a callback function named updateRange that updates the range of the filled region to match the range slider value, and assign the function to the ValueChangingFcn callback property of the range slider. For more information about callbacks, see Create Callbacks for Apps Created Programmatically.

function rangeSliderApp
fig = uifigure;
g = uigridlayout(fig);
g.RowHeight = {'1x','fit'};
g.ColumnWidth = {'1x'};

ax = uiaxes(g);
plot(ax,peaks);
xr = xregion(ax,10,35);

sld = uislider(g,"range", ...
    "Limits",[0 50], ...
    "Value",[10 35]);

sld.ValueChangingFcn = @(src,event) updateRange(src,event,xr);
end

function updateRange(src,event,xr)
val = event.Value;
xr.Value = val;
end

Run the rangeSliderApp function and move the slider thumbs. The filled region in the axes updates as you drag either of the thumbs.

Input Arguments

style — Style of slider

"slider" (default) | "range"

Style of slider, specified as one of these values:

• "slider" — Standard slider with one thumb to specify a value

• "range" — Range slider with two thumbs to specify a range of values

parent — Parent container

Figure object (default) | Tab object | Panel object | ButtonGroup object | GridLayout object

Parent container, specified as a Figure object or one of its child containers: Tab, Panel, ButtonGroup, or GridLayout. If you do not specify a parent container, MATLAB calls the uifigure function to create a new Figure object that serves as the parent container.

Name-Value Arguments

Specify optional pairs of arguments as Name1=Value1,...,NameN=ValueN, where Name is the argument name and Value is the corresponding value. Name-value arguments must appear after other arguments, but the order of the pairs does not matter.

Example: uislider(Limits=[0 50]) specifies the minimum slider value as 0 and the maximum slider value as 50.

Before R2021a, use commas to separate each name and value, and enclose Name in quotes.

Example: uislider("Limits",[0 50]) specifies the minimum slider value as 0 and the maximum slider value as 50.

Each style of slider supports a different set of properties. For a full list of properties and descriptions for each style, see the associated property page.

• If style is the default, "slider", see Slider.

• If style is "range", see RangeSlider.

Version History

Introduced in R2016a

R2025a: Specify standard slider step size

When you create a standard slider, you can specify the amount that the value changes when a user interacts with the slider thumb by using the Step property.

R2024a: Specify range slider step size

When you create a range slider, you can specify the amount that the value changes when a user interacts with the slider thumbs by using the Step property.

R2023b: Create slider to specify range of values

Create a range slider by specifying style as "range".