| CARVIEW |
Select Language
HTTP/2 200
date: Sun, 27 Jul 2025 14:36:17 GMT
content-type: text/html; charset=utf-8
vary: X-PJAX, X-PJAX-Container, Turbo-Visit, Turbo-Frame, X-Requested-With,Accept-Encoding, Accept, X-Requested-With
etag: W/"f8ed8eb57aa9463c66c93703b598ce4b"
cache-control: max-age=0, private, must-revalidate
strict-transport-security: max-age=31536000; includeSubdomains; preload
x-frame-options: deny
x-content-type-options: nosniff
x-xss-protection: 0
referrer-policy: no-referrer-when-downgrade
content-security-policy: default-src 'none'; base-uri 'self'; child-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/; connect-src 'self' uploads.github.com www.githubstatus.com collector.github.com raw.githubusercontent.com api.github.com github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com github-production-upload-manifest-file-7fdce7.s3.amazonaws.com github-production-user-asset-6210df.s3.amazonaws.com *.rel.tunnels.api.visualstudio.com wss://*.rel.tunnels.api.visualstudio.com objects-origin.githubusercontent.com copilot-proxy.githubusercontent.com proxy.individual.githubcopilot.com proxy.business.githubcopilot.com proxy.enterprise.githubcopilot.com *.actions.githubusercontent.com wss://*.actions.githubusercontent.com productionresultssa0.blob.core.windows.net/ productionresultssa1.blob.core.windows.net/ productionresultssa2.blob.core.windows.net/ productionresultssa3.blob.core.windows.net/ productionresultssa4.blob.core.windows.net/ productionresultssa5.blob.core.windows.net/ productionresultssa6.blob.core.windows.net/ productionresultssa7.blob.core.windows.net/ productionresultssa8.blob.core.windows.net/ productionresultssa9.blob.core.windows.net/ productionresultssa10.blob.core.windows.net/ productionresultssa11.blob.core.windows.net/ productionresultssa12.blob.core.windows.net/ productionresultssa13.blob.core.windows.net/ productionresultssa14.blob.core.windows.net/ productionresultssa15.blob.core.windows.net/ productionresultssa16.blob.core.windows.net/ productionresultssa17.blob.core.windows.net/ productionresultssa18.blob.core.windows.net/ productionresultssa19.blob.core.windows.net/ github-production-repository-image-32fea6.s3.amazonaws.com github-production-release-asset-2e65be.s3.amazonaws.com insights.github.com wss://alive.github.com api.githubcopilot.com api.individual.githubcopilot.com api.business.githubcopilot.com api.enterprise.githubcopilot.com; font-src github.githubassets.com; form-action 'self' github.com gist.github.com copilot-workspace.githubnext.com objects-origin.githubusercontent.com; frame-ancestors 'none'; frame-src viewscreen.githubusercontent.com notebooks.githubusercontent.com; img-src 'self' data: blob: github.githubassets.com media.githubusercontent.com camo.githubusercontent.com identicons.github.com avatars.githubusercontent.com private-avatars.githubusercontent.com github-cloud.s3.amazonaws.com objects.githubusercontent.com release-assets.githubusercontent.com secured-user-images.githubusercontent.com/ user-images.githubusercontent.com/ private-user-images.githubusercontent.com opengraph.githubassets.com copilotprodattachments.blob.core.windows.net/github-production-copilot-attachments/ github-production-user-asset-6210df.s3.amazonaws.com customer-stories-feed.github.com spotlights-feed.github.com objects-origin.githubusercontent.com *.githubusercontent.com; manifest-src 'self'; media-src github.com user-images.githubusercontent.com/ secured-user-images.githubusercontent.com/ private-user-images.githubusercontent.com github-production-user-asset-6210df.s3.amazonaws.com gist.github.com; script-src github.githubassets.com; style-src 'unsafe-inline' github.githubassets.com; upgrade-insecure-requests; worker-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/
server: github.com
content-encoding: gzip
accept-ranges: bytes
set-cookie: _gh_sess=pEwG12GxVoy5wZHAAG2xaHhQ5Nje%2BCiUeZ05sqBToNF4dF6BpUrOsUYzJo4aw5JOSm7dEMuYI4roqJCFNCZWPoU%2Fp%2FlbR3BI9tYvLbrvY0CzErcREiIyvoeFobAyuFbA9ySr9d0ZjbLfUUzBa7uAJwsOuruXcS7DLeV3ecvRNSSWfxC9HCq3UaclhM6aofv%2FuNToToe7S0t8tZtpC8ZeWS64IxZ2LRL80VRV4g5rnmWESeuRDGyhFI9nMLIxv%2F3mAPhEksKgUNatciY5KT1z3Q%3D%3D--jBKMEb0B7vwBaJ6l--qNmeL5Qv5Qie8%2FrJ1XZbsQ%3D%3D; Path=/; HttpOnly; Secure; SameSite=Lax
set-cookie: _octo=GH1.1.1354027322.1753626977; Path=/; Domain=github.com; Expires=Mon, 27 Jul 2026 14:36:17 GMT; Secure; SameSite=Lax
set-cookie: logged_in=no; Path=/; Domain=github.com; Expires=Mon, 27 Jul 2026 14:36:17 GMT; HttpOnly; Secure; SameSite=Lax
x-github-request-id: B6EE:5FFA9:F28694:13E6794:68863961
Slider · palexdev/MaterialFX Wiki · GitHub
Skip to content
Navigation Menu
{{ message }}
-
-
Notifications
You must be signed in to change notification settings - Fork 132
Slider
palexdev edited this page Jan 22, 2022
·
1 revision
-
Style Class: mfx-slider
-
Default Stylesheet: MFXSlider.css
-
Default Skin: MFXSliderSkin.java
| Property | Description | Type |
|---|---|---|
| min | Specifies the minimum value the slider can reach | Double |
| max | Specifies the maximum value the slider can reach | Double |
| value | Specifies the slider's actual value | Double |
| thumbSupplier | Specifies the Supplier used to build the slider's thumb. Attempting to set or return a null value will fallback to the default supplier |
Supplier |
| popupSupplier | Specifies the Supplier used to build the slider's popup. You can also set or return null to remove the popup |
Supplier |
| popupPadding | Specifies the extra gap between the thumb and the popup | Double |
| decimalPrecision | Specifies the number of decimal places for the slider's value | Integer |
| enableKeyboard | Specifies if the value can be adjusted with the keyboard or not | Boolean |
| ranges1 | Returns the first list of ranges | ObservableList |
| ranges2 | Returns the second list of ranges | ObservableList |
| ranges3 | Returns the third list of ranges | ObservableList |
| Property | Description | CSS Property | Type | Default Value |
|---|---|---|---|---|
| sliderMode | Specifies the slider mode. Can be DEFAULT (freely adjust the thumb) or SNAP_TO_TICKS (the thumb will always snap to ticks) | -mfx-slider-mode | SlideMode[Enum] | SliderMode.DEFAULT |
| unitIncrement | Specifies the value to add/subtract to the slider's value when an arrow key is pressed. The arrow keys depend on the slider orientation: HORIZONTAL: right, left; VERTICAL: up, down |
-mfx-unit-increment | Double | 10.0 |
| alternativeUnitIncrement | Specifies the value to add/subtract to the slider's value when an arrow key and Shift or Ctrl are pressed | -mfx-alternative-unit-increment | Double | 5.0 |
| tickUnit | The value between each major tick mark in data units | -mfx-tick-count | Double | 25.0 |
| showMajorTicks | Specifies if the major ticks should be displayed or not | -mfx-show-major-ticks | Boolean | false |
| showMinorTicks | Specifies if the minor ticks should be displayed or not | -mfx-show-minor-ticks | Boolean | false |
| showTicksAtEdges | Specifies if the major ticks at the edge of the slider should be displayed or not. The ticks at the edge are those ticks which represent the min and max values |
-mfx-show-ticks-at-edge | Boolean | true |
| minorTicksCount | Specifies how many minor ticks should be added between two major ticks | -mfx-minor-ticks-count | Integer | 5 |
| animateOnPress | When pressing on the slider's track the value is adjusted according to the mouse event coordinates. This property specifies if the progress bar adjustment should be animated or not |
-mfx-animate-on-press | Boolean | true |
| bidirectional | If the slider is set to be bidirectional the progress bar will always start from 0. When the value is negative the progress bar grows in the opposite direction to 0. This works only if min is negative and max is positive, otherwise this option in ignored during layout. See the warning in the control documentation |
-mfx-bidirectional | Boolean | true |
| orientation | Specifies the slider's orientation | -mfx-orientation | Orientation[Enum] | Orientation.HORIZONTAL |
| popupSide | Specifies the popup side. DEFAULT is above for horizontal orientation and left for vertical orientation. OTHER_SIDE is below for horizontal orientation and right for vertical orientation. |
-mfx-popup-side | SliderPopupSide[Enum] | SlidePopupSide.DEFAULT |
-
.mfx-slider
-
.mfx-slider .track
-
.mfx-slider .axis (for the ticks)
-
.mfx-slider .axis .axis-minor-tick-mark (for the minor ticks)
-
.mfx-slider .tick-even (for even major ticks)
-
.mfx-slider .tick-odd (for odd major ticks)
-
.mfx-slider .bar
-
.mfx-slider .thumb-container
-
.mfx-slider .thumb-container .thumb (font icon)
-
.mfx-slider .thumb-container .thumb-radius (font icon)
-
.mfx-slider .thumb-container .mfx-ripple-generator
Clone this wiki locally
You can’t perform that action at this time.