# Slider

The **Slider** is a **GUI** **2D Object** that allows the user to create a customizable slider selector. The customization is done through the [**Attributes**](#attributes).

![Slider.](https://4263346935-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLnh3x8s9fddWeG8TaAug%2Fuploads%2Fgit-blob-b6d15847c5d4c1e2420331fdf278dde9da2cb0f5%2Fsliderimage120241.png?alt=media)

## Attributes

The **Object's** **Attributes** can be used to fully customize the **Object**. Explained below, they are:

* [**Transformation**](#transformation)
* [**Slider**](#slider)
* [**Style**](#style)
* [**Tag**](#tag)

### Transformation

![Transformation Attributes.](https://4263346935-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLnh3x8s9fddWeG8TaAug%2Fuploads%2Fgit-blob-3226bc98da164b49db5ce084924c62dbbf9873c7%2Fdropdowntransformation20241.png?alt=media)

The `Transformation` **Attributes** deal with placement, rotation, and size in *XY* space. More information can be found [here](https://docs.incari.com/incari-studio/2024.1/objects-and-types/attributes/common-attributes/transformation).

### Slider

The **Slider Attributes** offer the user options to customize the **Slider**:

![Slider Attributes.](https://4263346935-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLnh3x8s9fddWeG8TaAug%2Fuploads%2Fgit-blob-d99dd8bc0a3fb1f6c14d47c9273677b64bed7695%2Fsliderimage320232.png?alt=media)

* `Value` determines where the handle will appear on the track on start.
* `Minimum` is the leftmost value that occurs on the track.
* `Maximum` is the rightmost value that occurs on the track.
* `Step` is the amount the values increase to the next.

### Style

The **Style Attributes** offer the user options to customize further visual aspects of the **Slider**:

![Style Attributes.](https://4263346935-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLnh3x8s9fddWeG8TaAug%2Fuploads%2Fgit-blob-272ec83c00ed1f8997fe00cc61be3c044c478417%2Fsliderstyleimage20232.png?alt=media)

* `Handle color` is the color of the handle (the sliding object along the track)
* `Handle size (px)` is the size of the handle.
* `Track Color` is the color of the track (the line that appears as part of the **Slider**).
* `Track thickness (px)` is how thick the track appears.
* `CSS Classes` contain the *CSS* class names of the **Object**.
* `Stylesheet` contains the *CSS* stylesheet of the **Object**. This can override any stylesheet provided in the [**Project Settings**](https://docs.incari.com/incari-studio/2024.1/modules/project-settings/style) or a [**Scene2D**](https://docs.incari.com/incari-studio/2024.1/objects-and-types/project-objects/scene2d). To address these in the **Logic**, please refer to the [**Object 2D Nodes**](https://docs.incari.com/incari-studio/2024.1/toolbox/incari/object2d).

Finally, the **Slider** works like this when the **Project** is run:

![Slider example.](https://4263346935-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLnh3x8s9fddWeG8TaAug%2Fuploads%2Fgit-blob-d461615798b61df96679d0d2a1d1a3c48aca91e8%2Fslider-example.gif?alt=media)

### Tag

![Tag Attributes.](https://4263346935-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLnh3x8s9fddWeG8TaAug%2Fuploads%2Fgit-blob-dc4f375e34ce9bdd2bebc3e93ff34c8680ab55bb%2Fbuttonattstag.png?alt=media)

This **Attribute** manages the *tags* for the **Slider**. See more on *tags* [here.](https://docs.incari.com/incari-studio/2024.1/objects-and-types/attributes/common-attributes/tag)