Rotate Progress component in Flex Container

I want a Progress component that is vertical rather than horizontal, and am struggling to find a way to do this. All the other forum threads and google answers have resulted in "it's not possible" (as of a year ago or more) or "use the rotation option" which appears to only be available in vision. The only solution I've found so far is to use a coordinate container, but that seems to get messy quickly if the view is dynamic for screen size variations. I want to have 7 of these bars, each next to their own graphic and in close proximity to each other.

Has anyone found any other options or solutions for this?

you could try css:
transform: rotate(90deg)

But it can get a bit messy with some components. Try and see.

"build your own" using a small flex column container with a label inside it that dynamically sizes to the proper % of the height of the flex container..

You can rotate like pascal said. This will work really strangely inside a flex container.

Another option is to build your own.
Vertical Progress Bar.zip (1.8 KB)

Here's a quick and dirty one I made using a flex container and a label. I did inline styling for simplicity but I generally recommend making style sheets for this sort of thing. It's just an example of how you could make one relatively easily.

Edit: ^^^ What he said :slight_smile: