How to achieve a custom status bar

bubbleerx · 2024-10-22T06:25:10.800Z

Hi All,

In our project, we have a requirement to display a custom status bar for prescriptions, similar to the one shown in the attached image. Could anyone provide guidance on how to achieve this custom design in Bubble, along with the necessary logic implementation?

Thank you in advance for your support!

Request_sent1512×880 35.9 KB

tylerboodman · 2024-10-22T07:06:28.988Z

Yes that can be done with the Shape element (with a roundness of 100 it makes it a circle) and an Icon element both in a group set to Align to Parent layout so they are stacked on top of each other.

The vertical line is just another shape element but 1px wide. Then have conditions on all the elements to change color (or icon) based on the current status

autom8 · 2024-10-22T23:49:58.251Z

@bubbleerx this is a simple design and workflow to set up in Bubble.

I recommend you watch Gregory’s videos on YouTube which shows practical examples.

Anyway, I started building a quick demo as I was bored but quickly got busy lol. But it shows most of what you want to achieve.

Bubble

Bubble - Visual Programming

Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications.

You can also checkout the editor here prescription-request | Bubble Editor

system · 2024-12-31T06:26:10.571Z

This topic was automatically closed after 70 days. New replies are no longer allowed.