Progress Bar-komponent progress-bar-component

Komponenten Core Component Progress Bar representerar visuellt förloppet mot ett mål.

TIP
Har du övervägt Edge Delivery Services för AEM?
Du kan fortsätta använda metoderna som beskrivs i det här dokumentet för befintliga projekt. För nya projekt rekommenderar Adobe att du drar nytta av Edge Delivery Services.

Användning usage

Med Progress Bar-komponenten kan innehållsförfattaren enkelt skapa en förloppsindikator genom att definiera en procentandel av slutförandet, vilket ger en intuitiv visuell visning av förloppet mot ett mål.

Version och kompatibilitet version-and-compatibility

Den aktuella versionen av Progress Bar-komponenten är v1, som introducerades i version 2.9.0 av Core Components i maj 2020, och som beskrivs i det här dokumentet.

Följande tabell visar alla versioner av komponenten som stöds, de AEM-versioner som komponenterna är kompatibla med samt länkar till dokumentation för tidigare versioner.

Komponentversion
AEM 6.4
AEM 6.5
AEM 6.5 LTS
AEM as a Cloud Service
v1
Kompatibel med
version 2.17.4 och tidigare
Kompatibel
Kompatibel
Kompatibel

Exempel på komponentutdata sample-component-output

Om du vill visa Progress Bar-komponenten och exempel på dess konfigurationsalternativ samt HTML- och JSON-utdata går du till komponentbiblioteket.

Teknisk information technical-details

Den senaste tekniska dokumentationen om Progress Bar-komponenten finns på GitHub.

Mer information om hur du utvecklar kärnkomponenter finns i dokumentationen för kärnkomponentutvecklare.

Konfigurera dialogruta configure-dialog

Förloppsindikatorkomponentens redigeringsdialogruta

  • Slutförande - förloppet representerat av en procentandel

  • ID - Med det här alternativet kan du styra den unika identifieraren för komponenten i HTML och i datalagret.

    • Om inget anges genereras ett unikt ID automatiskt åt dig och du hittar det genom att granska den resulterande sidan.
    • Om ett ID anges är det författarens ansvar att se till att det är unikt.
    • Om du ändrar ID:t kan det påverka spårningen av CSS, JS och datalager.

Designdialogruta design-dialog

I designdialogrutan kan mallskaparen definiera de format som ska användas för Progress Bar-komponenten.

Fliken Format styles-tab

Förloppsindikatorkomponenten stöder AEM Style System.

Adobe Client Data Layer data-layer

Förloppsindikatorkomponenten stöder Adobe-klientdatalagret.

recommendation-more-help
d2be9096-a81e-404b-9952-d8925af7219c