Siirry pääsisältöön

ProgressBar

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

ProgressBar-komponentti esittää visuaalisesti operaation valmistumisasteen. Kun työ etenee, suorakulmio täyttyy vähitellen heijastaakseen nykyistä prosenttiluku. Baarissa voi myös olla tekstiesitys sen arvosta, ja se tukee sekä määrätietoisia että määrättömiä tiloja tehtäville, joiden kestoa ei tiedetä.

Käyttöönotot​

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

  • Määritettäviä vähimmäis- ja enimmäisarvoja.
  • Määrättömän tilan käyttöä jatkuville tehtäville, joilla ei ole selvää loppua.
  • Mahdollisuuksia tekstin näkyvyyteen, animaatioon ja raidallisiin muotoiluihin paremman visuaalisen palautteen saamiseksi.

Seuraavassa esimerkissä on raidallinen, animoitu edistymispalkki, jossa on alku-, tauko- ja nollausohjaimet:

Näytä koodi

Arvojen asettaminen​

ProgressBar-komponentti mahdollistaa sen nykyisen arvon, minimirajan ja enimmäisrajan asettamisen ja hakemisen.

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

Suunta​

ProgressBar voidaan asettaa vaakasuoraan tai pystysuoraan.

Näytä koodi

Määrättömässä tilassa​

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

Näytä koodi

Teksti ja tekstin näkyvyys​

Oletuksena, kun progressiivinen palkki luodaan, se näyttää prosenttiprosentin muodossa XX%. Käyttämällä setText()-metodia voit käyttää täytemerkkiä {{x}} saadaksesi nykyisen arvon prosentteina. Lisäksi voit käyttää täytemerkkiä {{value}} saadaksesi raakavälin nykyisen arvon.

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

Tyylittely​

Teemat​

ProgressBar-komponentti tulee sisäänrakennettujen teemojen kanssa nopeaa tyylittelyä varten ilman CSS:n käyttöä. Nämä teemat ovat määritettyjä tyylejä, joita voidaan soveltaa painikkeisiin niiden ulkonäön ja visuaalisen esityksen muuttamiseksi. Ne tarjoavat nopean ja johdonmukaisen tavan mukauttaa ProgressBarien ilmettä sovelluksessa.

Näytä koodi

Loading...

Parhaat käytännöt​

  • Käytä sopivia vähimmäis- ja enimmäisarvoja: Aseta vähimmäis- ja enimmäisarvot tarkasti heijastamaan tehtävän arvoaluetta.
  • Päivitä edistystä säännöllisesti: Päivitä jatkuvasti edistymisarvo käyttäjille reaaliaikaisen palautteen tarjoamiseksi.
  • Hyödynnä määrättömiä tiloja tuntemattomille kestolle: Käytä määrätöntä tilaa ennakoimattomille kestolle, jotta voidaan indikoida jatkuvaa edistymistä.
  • Näytä tekstiä paremman käyttäjäpalautteen tarjoamiseksi: Näytä teksti edistymispalkissa tarjotaksesi lisäkontekstia tehtävän edistymisestä.