SliderProps — Kuito Documentation

Utilisation

Adjust volume and show its percentage

Ce type est utilisé par Slider

tsx

import { Slider, Text, VStack, signal } from 'kuito';

export default function Volume() {
  const volume = signal(0.5);

  return (
    <VStack gap={8} padding={16}>
      <Slider label="Volume" value={volume} height={40} />
      <Text>{Math.round(volume.value * 100) + '%'}</Text>
    </VStack>
  );
}

Déclaration du type

export type SliderProps = {
  /** Two-way when given a signal: the slider writes it as the user drags. */
  value?: number;
  /** 0 by default. */
  min?: number;
  /** 1 by default. */
  max?: number;
  /** The value snaps to multiples of `step` from `min`; 0 slides freely. */
  step?: number;
  disabled?: boolean;
  /** The track before the thumb. */
  fillColor?: string;
  /** The track after the thumb. */
  trackColor?: string;
  /** The value, while the user drags. */
  onChange?: (value: number) => void;
  /** When the user lets go. */
  onChangeEnd?: (event: SliderEvent) => void;
};

Membres 9

Nom	Type	Requis	Description
`value`	`number`	Non	Two-way when given a signal: the slider writes it as the user drags.
`min`	`number`	Non	0 by default.
`max`	`number`	Non	1 by default.
`step`	`number`	Non	The value snaps to multiples of `step` from `min`; 0 slides freely.
`disabled`	`boolean`	Non	—
`fillColor`	`string`	Non	The track before the thumb.
`trackColor`	`string`	Non	The track after the thumb.
`onChange`	`(value: number) => void`	Non	The value, while the user drags.
`onChangeEnd`	`(event: SliderEvent) => void`	Non	When the user lets go.

onChange — signatures de méthode

Signatures

(value: number): void

Paramètres

Nom	Type	Requis	Description
`value`	`number`	Oui	—

Retourne

void

onChangeEnd — signatures de méthode

Signatures

(event: SliderEvent): void

Paramètres

Nom	Type	Requis	Description
`event`	`SliderEvent`	Oui	—

Retourne

void

Généré depuis les déclarations TypeScript publiques : signatures, props et valeurs par défaut viennent de la source vérifiée, les descriptions de sa JSDoc. Aucune valeur par défaut n'est inventée.