Slider

Learn how to use the Slider component in your applications

Example Usage

#An Example Slider: 
from zero_true import Slider


example = Slider(min=0, max=1, step=0.01, value=0.5, label="Sample_Range")

Example Output

Overview

pydantic model zero_true.Slider

Slider can provide unique range of values that can be inputed and used elsewhere.

JSON Schema

Field Defenitions

{
   "title": "Slider",
   "description": "A slider component that allows you to capture numeric input from a user",
   "type": "object",
   "properties": {
      "id": {
         "description": "Unique id for a component",
         "title": "Id",
         "type": "string"
      },
      "variable_name": {
         "default": "",
         "description": "Optional variable name associated with a component",
         "title": "Variable Name",
         "type": "string"
      },
      "component": {
         "default": "v-slider",
         "description": "Vue component name",
         "title": "Component",
         "type": "string"
      },
      "value": {
         "anyOf": [
            {
               "type": "integer"
            },
            {
               "type": "number"
            }
         ],
         "default": 0,
         "description": "Current value of the slider",
         "title": "Value"
      },
      "min": {
         "anyOf": [
            {
               "type": "integer"
            },
            {
               "type": "number"
            }
         ],
         "default": 0,
         "description": "Minimum value of the slider",
         "title": "Min"
      },
      "max": {
         "anyOf": [
            {
               "type": "integer"
            },
            {
               "type": "number"
            }
         ],
         "default": 100,
         "description": "Maximum value of the slider",
         "title": "Max"
      },
      "step": {
         "anyOf": [
            {
               "type": "integer"
            },
            {
               "type": "number"
            }
         ],
         "default": 1,
         "description": "Step increment of the slider",
         "title": "Step"
      },
      "thumb_label": {
         "default": false,
         "description": "Displays the thumb label",
         "title": "Thumb Label",
         "type": "boolean"
      },
      "thumb_size": {
         "default": 0,
         "description": "Size of the thumb",
         "title": "Thumb Size",
         "type": "integer"
      },
      "tick_labels": {
         "default": "always",
         "description": "Displays the tick labels",
         "title": "Tick Labels",
         "type": "string"
      },
      "ticks": {
         "default": [],
         "description": "Displays the ticks",
         "items": {},
         "title": "Ticks",
         "type": "array"
      },
      "color": {
         "default": "primary",
         "description": "Color of the range slider. Can be custom or standard Material color",
         "pre": true,
         "title": "Color",
         "type": "string"
      },
      "size": {
         "default": "large",
         "description": "Size of the slider",
         "title": "Size",
         "type": "string"
      },
      "label": {
         "anyOf": [
            {
               "type": "string"
            },
            {
               "type": "null"
            }
         ],
         "default": null,
         "description": "A label for your slider",
         "title": "Label"
      },
      "rounded": {
         "default": true,
         "description": "Determines if the slider has rounded edges",
         "title": "Rounded",
         "type": "boolean"
      },
      "triggerEvent": {
         "default": "end",
         "description": "Trigger event for when to run the slider",
         "title": "Triggerevent",
         "type": "string"
      }
   },
   "required": [
      "id"
   ]
}

Bellow are the various attributes you can assign to the component. Utlizing them can allow for modifications to the pre-created object.

zero_true.Slider

Zero True Component

Show properties

field color

field color: str = ‘primary’

Color of the range slider. Can be custom or standard Material color.

VALIDATED BY: validate_color

field components

field component: str = ‘v-slider’

Vue component name.

field label

field label: str | None = None

A label for your slider.

field max

field max: int | float = 100

Maximum value of the slider.

field min

field min: int | float = 0

Minimum value of the slider.

field rounded

field rounded: bool = True

Determines if the slider has rounded edges.

field size

field size: str = ‘large’

Size of the slider.

field step

field step: int | float = 1

Step increment of the slider.

field thumb_label

field thumb_label: bool = False

Displays the thumb label.

field thumb_size

field thumb_size: int = 0

Size of the thumb.

field tick_labels

field tick_labels: str = ‘always’

Displays the tick labels.

field ticks

field ticks: list = []

Displays the ticks.

field triggerEvent

field triggerEvent: str = ‘end’

Trigger event for when to run the slider.

field value

field value: int | float = 0

Current value of the slider.

Methods

classmethod get_value_from_global_state(value, values)