Rückmeldung

Zeigt den Fortschritt oder Countdown an und bewegt sich von rechts nach links.

"Verwendung"
"Eigenschaften"

import { ProgressBar } from "twenty-ui/feedback";

export const MyComponent = () => {
  return (
    <ProgressBar
      duration={6000}
      delay={0}
      easing="easeInOut"
      barHeight={10}
      barColor="#4bb543"
      autoStart={true}
    />
  );
};

”Eigenschaften”	Typ	Beschreibung	Standard
Dauer	nummer	Die Gesamtdauer der Fortschrittsbalken-Animation in Millisekunden	3
Verzögerung	nummer	Die Verzögerung beim Starten der Fortschrittsbalken-Animation in Millisekunden	0
Easing	string	Easing-Funktion für die Fortschrittsbalken-Animation	easeInOut
Balkenhöhe	nummer	Die Höhe des Balkens in Pixeln	24
Balkenfarbe	Zeichenkette	Die Farbe des Balkens	gray80
AutoStart	boolesch	Wenn `true`, startet die Animation des Fortschrittsbalkens automatisch, wenn die Komponente gemountet wird.	`wahr`

Zirkularer Fortschrittsbalken

Zeigt den Fortschritt einer Aufgabe an, wird häufig auf Ladebildschirmen oder in Bereichen verwendet, in denen Sie laufende Prozesse an den Benutzer kommunizieren möchten.

Verwendung
Eigenschaften

import { CircularProgressBar } from "@/ui/feedback/progress-bar/components/CircularProgressBar";

export const MyComponent = () => {
  return <CircularProgressBar size={80} barWidth={6} barColor="green" />;
};

Eigenschaften	Typ	Beschreibung	Standard
größe	nummer	Die Größe des zirkularen Fortschrittsbalkens	50
Balkenbreite	nummer	Die Breite der Fortschrittsbalkenlinie	5
Balkenfarbe	Zeichenkette	Die Farbe des Fortschrittsbalkens	currentColor

Welcome

Core Concepts

Zirkularer Fortschrittsbalken

​Zirkularer Fortschrittsbalken

Zirkularer Fortschrittsbalken