Siirry pääsisältöön

ProgressBar

Avaa ChatGPT:ssä
Shadow dwc-progressbar 24.02
Java API

ProgressBar on komponentti, joka näyttää visuaalisesti jonkin tehtävän edistymisen. Kun tehtävä etenee kohti valmistumista, edistymispalkki näyttää tehtävän valmistumisprosentin. Tämä prosenttiosuus esitetään visuaalisesti suorakulmiona, joka alkaa tyhjänä ja täyttyy vähitellen, kun tehtävä etenee. Lisäksi edistymispalkki voi näyttää tekstimuotoisen esityksen tästä prosentista.

Näytä koodi

Käyttötavat

ProgressBar-komponentti on hyödyllinen tehtävien valmistumisasteen visualisoimiseksi. Se tukee:

  • Konfiguroitavia vähimmäis- ja enimmäisarvoja.
  • Määrittelemätöntä tilaa jatkuville tehtäville, joilla ei ole määritellyt loppua.
  • Mahdollisuuksia tekstin näkyvyydelle, animaatiolle ja raidallisille muotoiluille paremman visuaalisen palautteen saamiseksi.

Arvojen asettaminen

ProgressBar-komponentilla voi asettaa ja saada sen nykyisen arvon, vähimmäis- ja enimmäisrajat.

ProgressBar bar = new ProgressBar();
bar.setMin(0);
bar.setMax(100);
bar.setValue(50);

Suuntaus

ProgressBar voidaan suunnata vaakasuoraan tai pystysuoraan.

Näytä koodi

Määrittelemätön tila

ProgressBar tukee määrittelemätöntä tilaa tehtäville, joiden valmistumisaikaa ei tiedetä.

Näytä koodi

Teksti ja tekstin näkyvyys

Oletuksena, kun se luodaan, edistymispalkki näyttää prosenttiosuuden valmiina muodossa XX%. Käyttämällä setText()-metodia voit käyttää paikkaa {{x}} saadaksesi nykyisen arvon prosentteina. Lisäksi voit käyttää paikkaa {{value}} saadaksesi raakamuotoisen nykyarvon.

ProgressBar bar = new ProgressBar(15, "Lataus: {{x}}%");

Tyylit

Teemat

ProgressBar-komponentti sisältää teemoja , jotka on rakennettu nopeaa tyylittelyä varten ilman CSS:n käyttöä. Nämä teemat ovat ennalta määriteltyjä tyylejä, joita voidaan soveltaa painikkeisiin niiden ulkonäön ja visuaalisen esityksen muuttamiseksi. Ne tarjoavat nopean ja johdonmukaisen tavan mukauttaa ProgressBarien ulkoasua sovelluksessa.

Näytä koodi

Loading...

Parhaat käytännöt

  • Käytä asianmukaisia vähimmäis- ja enimmäisarvoja: Aseta vähimmäis- ja enimmäisarvot tarkasti heijastamaan tehtävän rajaa.
  • Päivitä edistymistä säännöllisesti: Jatkuvasti päivitä edistymisarvoa tarjotaksesi reaaliaikaista palautetta käyttäjille.
  • Hyödynnä määrittelemätöntä tilaa tuntemattomille kestolle: Käytä määrittelemätöntä tilaa tehtäville, joiden kesto on ennakoimaton, osoittaaksesi jatkuvaa edistymistä.
  • Näytä tekstiä parempaa käyttäjäpalautetta varten: Näytä teksti edistymispalkissa tarjotaksesi lisäkontekstia tehtävän edistymiselle.