Components/Basic components

EScrollbar Scrollbar

import EUI 1.0

Examples

Scroll positioning and edge masks

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Column { spacing: 12 width: parent.width EScrollbar { id: webBasicScroll mask: true height: 160 always: true width: Math.min(560, parent.width) Column { spacing: 8 width: webBasicScroll.availableWidth Repeater { model: 12 ECard { padding: 12 width: parent.width header: "Item " + (index + 1) } } } } Row { spacing: 8 EButton { text: qsTr("Scroll to bottom") onClicked: webBasicScroll.setScrollTop(10000) } EButton { text: qsTr("Back to top") onClicked: webBasicScroll.setScrollTop(0) } } }

Preview

Run the code to try the component

Edit text, properties, or events, then select Run.

Code runs in this browser Licenses

Scrollbar

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EScrollbar { height: 160 Column { Repeater { model: 20 EText { text: index } } } }

Preview

Run the code to try the component

Edit text, properties, or events, then select Run.

Code runs in this browser Licenses

Properties

PropertyDescriptionValues and default

alwaysbool

Always show the scrollbar.

Defaultfalse

bottomReachedbool

Whether the scroll area has reached the corresponding edge, updated by scroll events.

Defaultfalse

componentReadybool

Whether scroll-component initialization has completed.

Defaultfalse

distancereal

Distance from a scroll edge at which it is considered reached, in pixels.

Default0

enabledbool

Allow interaction; false disables the control.

Defaulttrue

heightreal

Component size in pixels; may be bound to its parent layout.

DefaultimplicitHeight

leftReachedbool

Whether the scroll area has reached the corresponding edge, updated by scroll events.

Defaultfalse

maskvar

Show a mask; scrollbars also support edge-fade mask settings.

Defaultfalse

maskSizereal

Scroll-edge fade mask size in pixels.

Default40

maxHeightreal

Maximum display height in pixels; 0 adds no extra limit.

Default0

minSizereal

Minimum scrollbar thumb length in pixels.

Default36

rightReachedbool

Whether the scroll area has reached the corresponding edge, updated by scroll events.

Defaultfalse

topReachedbool

Whether the scroll area has reached the corresponding edge, updated by scroll events.

Defaultfalse

visiblebool

Whether the component is visible.

Defaulttrue

widthreal

Component size in pixels; may be bound to its parent layout.

DefaultimplicitWidth

scrollLeftrealRead only

Current horizontal or vertical scroll offset in pixels.

DefaultComputed at runtime

scrollTargetvarRead only

Flickable controlled by the scrollbar.

DefaultComputed at runtime

scrollToprealRead only

Current horizontal or vertical scroll offset in pixels.

DefaultComputed at runtime

Signals

SignaturePurpose

endReached(string direction)

Emitted on reaching a scroll edge; direction identifies the edge.

scrolled(real scrollTop, real scrollLeft)

Emitted when the scroll position changes; scrollTop and scrollLeft are the vertical and horizontal positions.

Methods

SignaturePurpose

update()

Refresh the scroll range and scrollbar dimensions after content size changes.

setScrollTop(top)

Set the vertical scroll position top in pixels.

setScrollLeft(left)

Set the horizontal scroll position left in pixels.

scrollTo(left, top)

Scroll to the specified position, using horizontal and vertical coordinates or the supported scroll configuration.