scroll

Scroll to location within container, list box, or tree

Syntax

scroll(component,location)
scroll(component,x,y)

Description

example

scroll(component,location) scrolls to the specified location within a component. Use this syntax to scroll within a figure created with the uifigure function, or any of these child components: grid layout, panel, button group, tab, tree, or list box.

example

scroll(component,x,y) scrolls to the specified (x, y) coordinates within a container. The coordinates are measured in pixels from the lower-left corner of the container. This syntax supports figures created with the uifigure function and any of these child containers: grid layout, panel, button group, or tab. For more information on when scrolling is possible, see Conditions that Enable Scrolling.

Examples

collapse all

Create a figure, and set the Scrollable property to 'on'. Then add five child components. To ensure that the figure is scrollable, place the first component above the top edge of the figure. Then space the components far enough apart so that they cannot fit within the figure together.

% Create figure
uf = uifigure('Name','Customer','Scrollable','on');
uf.Position = [100 100 493 283];

% Title label
title = uilabel(uf,'Text','Customer Record');
title.FontSize = 18;
title.FontWeight = 'bold';
title.Position = [173 315 157 22];

% Name
name = uieditfield(uf,'text');
name.Position = [169 239 173 22];
namelabel = uilabel(uf,'Text','Name','HorizontalAlignment','right');
namelabel.Position = [116 239 38 22];

% Phone
phone = uieditfield(uf,'text');
phone.Position = [169 164 173 22];
phonelabel = uilabel(uf,'Text','Phone','HorizontalAlignment','right');
phonelabel.Position = [114 164 40 22];

% Balance
balance = uieditfield(uf,'numeric');
balance.Position = [169 89 173 22];
balancelabel = uilabel(uf,'Text','Balance','HorizontalAlignment','right');
balancelabel.Position = [105 89 49 22];

% Submit button
button = uibutton(uf,'push','Text','Submit');
button.Position = [169 14 173 22];

By default, MATLAB® scrolls to the upper-left corner of the area that encloses the child components.

Scroll to location (1,1), which is the bottom of the figure.

scroll(uf,1,1);

Bring child components of a scrollable grid layout into view by specifying pixel coordinates or a location name.

Create a 5-by-2 grid layout and set the Scrollable property of the grid to 'on'. Then add a label, a table, and a panel to the grid. Set the Scrollable property of the panel to 'off' and then add a chart to the panel.

uf = uifigure('Position',[782 497 435 311]);
g = uigridlayout(uf,'Scrollable','on');
g.RowHeight = {22,40,22,22,400};
g.ColumnWidth = {400,400};

lbl = uilabel(g,'Text','Tsunamis');
lbl.Layout.Row = 2;
lbl.Layout.Column = [1,2];
lbl.HorizontalAlignment = 'center';
lbl.FontSize = 28;

tsunamis = readtable('tsunamis.xlsx');
tsunamis.Cause = categorical(tsunamis.Cause);
t = uitable(g,'Data',tsunamis);
t.Layout.Row = [3,5];
t.Layout.Column = 2;

p = uipanel(g);
p.Scrollable = 'off';
p.Layout.Row = [3,5];
p.Layout.Column = 1;
gb = geobubble(p,tsunamis.Latitude,tsunamis.Longitude,...
    tsunamis.MaxHeight,tsunamis.Cause);

Scroll to a location in the grid.

scroll(g,100,-30);

Now use location names to scroll to the bottom-right corner of the grid.

scroll(g,'bottom','right');

Bring a component into view by specifying the scroll location as the first two position coordinates of the component you want to view.

Create a figure with two drop-down components, a list box, and a table. Position the components so that they cannot all be displayed within the figure at one time.

uf = uifigure;
uf.Scrollable = 'on';
uf.Position = [100 300 328 110];

dd1 = uidropdown(uf);
dd1.Position = [20 360 120 22];

dd2 = uidropdown(uf);
dd2.Position = [20 200 120 22];

lb = uilistbox(uf);
lb.Position = [230 300 120 80];

t = readtable('patients.xls');
uit = uitable(uf,'Data',t);
uit.Position = [375 100 300 300];

Scroll to the table.

scroll(uf,uit.Position(1:2));

Create a list box containing a list of names with associated ItemsData.

uf = uifigure('Position',[680 678 300 200]);
list = uilistbox(uf, 'Position',[70 50, 150 78]);
list.Items = {'Diane Fitzsimmons', 'Naomi Becker', 'Nick Stewart',...
           'Alex Bradford', 'Caroline Eliot', 'Leslie Bond', ...
           'Aaron Silberlicht', 'Ramu Sadasiv', 'Joyce Wu',...
           'Ann Shanahan'};
list.ItemsData = [1 2 3 4 5 6 7 8 9 10];

Scroll to Caroline Eliot.

scroll(list,'Caroline Eliot');

Select Caroline Eliot by setting the Value property to the corresponding element in the ItemsData property.

list.Value = 5;

Create a tree containing four top-level nodes that each have child nodes.

uf = uifigure;
tree = uitree(uf,'Position',[20 20 175 100]);
    
% First level nodes
category1 = uitreenode(tree,'Text','Runners');
category2 = uitreenode(tree,'Text','Cyclists');
category3 = uitreenode(tree,'Text','Hikers');
category4 = uitreenode(tree,'Text','Swimmers');

% Second level nodes
r1 = uitreenode(category1,'Text','Joe');
r2 = uitreenode(category1,'Text','Linda');
c1 = uitreenode(category2,'Text','Rajeev');
h1 = uitreenode(category3,'Text','Jack');
s1 = uitreenode(category4,'Text','Logan');

Expand the nodes, so that Swimmers scrolls out of view.

expand(tree);

Scroll to the Swimmers node.

scroll(tree,category4)

Select the Swimmers node by setting the SelectedNodes property of the Tree object.

tree.SelectedNodes = category4;

Input Arguments

collapse all

Scrollable component, specified as a figure created with the uifigure function, or any of the following components within that figure: grid layout, panel, button group, tab, list box, or tree.

Scroll location, specified as 'top', 'bottom', or a value listed in the table. The values 'top' and 'bottom' scroll to the top and bottom of the component. The other values are specific to the type of component. To scroll to the corner of a container, you can combine the 'top' or 'bottom' scroll locations with 'left' or 'right'. For example, scroll(uf,'left','top').

ComponentValues

Figure
Panel
Button group
Tab
Grid Layout

  • 'left' — Scrolls to the left edge of the container.

  • 'right' — Scrolls to the right edge of the container.

Tree

  • TreeNode object — Scrolls to the specified tree node.

List box

  • Element of Items property — Scrolls to the specified item in the list box.

  • Element of ItemsData property — Scrolls to the corresponding item in the list box.

x-coordinate, specified as a number in pixels from the left edge of the container. If the specified value exceeds the scrollable area of the container, the container scrolls as far as it can in the specified direction.

y-coordinate, specified as a number in pixels from the bottom edge of the container. If the specified value exceeds the scrollable area of the container, the container scrolls as far as it can in the specified direction.

If a grid layout is taller than its parent container, you use negative y-coordinates to scroll to components within the grid that lie below the bottom edge of the parent container.

More About

collapse all

Conditions that Enable Scrolling

To allow scrolling within a container, the 'Scrollable' property of the container must be set to 'on'. In addition, these container-specific conditions must also be true:

Grid layouts

  • The sum of the values specified for the 'RowHeight' property of the grid must be larger than the height of the parent container.

  • The sum of the values specified for the 'ColumnWidth' property of the grid must be larger than the width of the parent container.

  • At least one row or column of the grid must be set to a fixed pixel height or width.

  • The grid must contain components.

Containers other than grid layout

  • The child components in the container must occupy a larger area than the container can display at one time.

  • Components that do not fit in the container must be above or to the right of the container.

Introduced in R2016a