I wonder if using some CSS you could target a specific progress bar to change the color of just one component.
1 Like
Bravo 
Yes @Robert_Petitto, you can.
Put this code in a Rich Text component:
<div style ="position: fixed;
top: 32%;
width: 65%;
height: 2%;
opacity: 1.9;
left: 20%;;
background-color: white;
border-radius: 10px;
border: 2px solid #ffffff;">
<div style ="position: fixed;
top: 32%;
width: 45%;
height: 2%;
opacity: 1.9;
left: 20%;;
background-color: red;
border-radius: 10px;
border: 2px solid #ffffff;">
and later, test it by changing the red bar’s width value manually (from 1 to 65%)
The problem here is you can do it only when position= fixed otherwise, you must use a 2nd component to get the visual effect.
Saludos!
1 Like
@ThinhDinh and @Laurent_Maleville
here you can see my custom progress bars working using basic CSS code
I hope Glide can give us this feature in a native way soon.
Saludos!
5 Likes
please give me the code
the code is above @Glider, put the code in a Rich Text component and adjust the bar’s width/height setting (later you can use a template and modify the values automatically).
Saludos
the one in the picture is different can i have the code o that one
Hello!
You are a GENIUS!
I will try to make this like you, it’s awesome!!
Thanks a lot!
See you next
Laurent
2 Likes
me too
use a dark background on your APP to see bars better @Laurent_Maleville
Esto también te puede servir para otras cosas @SantiagoPerez
1 Like
Ok, I use a dark background
Then, i have this :
So, i try to understand your work. You give me a code with a bar fixed. Now, i would like to make a dynamic progress bar like.
Do you create a relation between the rich text and a number entry maybe.
I see in your app like if the dynamic progress bar is manipulated by a “number entry” component.
Thanks for your work and your sharing!
I progress with you (like a progress bar 
)
1 Like
Check this out:
Separate Red and Pink Progress bars! Very specific CSS to your app. Mine was:
<span><style> div:nth-child(3) .iCpUZF {background-color:red}</span></style>
child(3) because the progress bar that I wanted to change was the 3rd component from the top
5 Likes
Hello @gvalero,
Can you share your app with different progress bar because i want to know how you are make it?
Thanks a lot
Laurent
Sure @Laurent_Maleville but give me some time.
I use it as an internal APP where I carry out tests and it’s a little disaster of course.
I’m going to replicate all this in a new test app and erase many useless settings and data to help to understand it better.
I will notify you!
Saludos
1 Like
Hello Robert!
Thanks a lot for your help!
This is awesome!
Laurent
1 Like
Oh!!! Ya me estoy haciendo ideas de donde y cómo puedo usarlos.
Hello @gvalero,
Do you have the time to explain me what are you making the progress bar dynamic?
Thanks!
Laurent
Hi @Robert_Petitto , could I take a look at this Pokemon app? I’m really curious about the battle system, I was planning to do something similar, but more like an RPG, and get stuck on battles, more specifically on how to generate an AI response from my turn. I thought in a bunch of options that will trigger randomly, but I would like to see an pro app like yours to take some ideas.
Thanks in advice 