nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

using CSS3 to create progress bar in Flex

XintaoLiu

Is it possible to create a GMail like progress bar (see attached picture) in Flex? Thanks!

[ATTACH=CONFIG]19693[/ATTACH]

gmprogress.png

Finde mehr Beiträge mit dem Tag

Accepted answers

IvanBespalov

For ms.controls.ProgressBar you can change it's interface by customizing skins [ATTACH=CONFIG]19740[/ATTACH] (copy skins to your app and customize them)

<mx:ProgressBar id="progressBar1"          barSkin="your.company.assets.skins.MyProgressBarSkin"         ...

or change it's interface by customizing css styles

<fx:Style>     @namespace s "library://ns.adobe.com/flex/spark";     @namespace mx "library://ns.adobe.com/flex/mx";        .progressBarSyle     {         /* TODO: define style here */     }     </fx:Style> ... <mx:ProgressBar id="progressBar2"      styleName="progressBarSyle"

Good luck

skins.png

All comments

IvanBespalov

For ms.controls.ProgressBar you can change it's interface by customizing skins [ATTACH=CONFIG]19740[/ATTACH] (copy skins to your app and customize them)

<mx:ProgressBar id="progressBar1"          barSkin="your.company.assets.skins.MyProgressBarSkin"         ...

or change it's interface by customizing css styles

<fx:Style>     @namespace s "library://ns.adobe.com/flex/spark";     @namespace mx "library://ns.adobe.com/flex/mx";        .progressBarSyle     {         /* TODO: define style here */     }     </fx:Style> ... <mx:ProgressBar id="progressBar2"      styleName="progressBarSyle"

Good luck

skins.png

XintaoLiu

Not sure what is different about a "Gmail" style, but have you looked here:

http://forums.arcgis.com/threads/57341-how-to-implement-a-quot-Loading-quot-message-after-a-layer-is-checked-in-the-TOC?highlight=progress+bar

Thanks! But how to change the style, e.g. color, of the indetermined progressbar? Thank you again!

RhettZufelt

Not sure what is different about a "Gmail" style, but have you looked here:

http://forums.arcgis.com/threads/57341-how-to-implement-a-quot-Loading-quot-message-after-a-layer-is-checked-in-the-TOC?highlight=progress+bar

Nimm an der Unterhaltung teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

Alle Communities
Neueste Beiträge
Gefolgter Inhalt
Community-Hilfe

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.