Dynamic loading material icons from database

Hi all,

please I have question about dynamicaly loading icons from database and than showing these icons (by names from database).

Now I can’t use material icons dynamicaly.

Any idea please?

Thank you

Hello! You can add the images you want to display in the database then use the image element and search in that database for a random item.

Regarding showing the current image’s name, I am trying to find a solution for that but it is hard since it is choosing the image randomly.

Okay so I was trying to display the name that I choose for each image. According to my knowledge, I think it is impossible if it is a random picture. What you can do is name the file as you want before uploading the image in the database.

Check this link:

Hope this helps.

Solved it. Just group them in one group. Check the link in the previous post. I update it. You can check both solutions.

Hi @grace.hallak,

first, thank you for your quick answer. But I don’t know if I explaned my use case correctly.

My reservation status structure is here:

I need alternative for this (dynamicaly insert icon name):

Because I need:

  • change color of icon (not possible when I upload an image)
  • easy administration of these statuses (add icon’s name from material.io)

it’s some way please?


So from what you have said:

  1. You want to change the icon color depending on “Reservation Status’ Color”?
  2. Depending on the progress or name, lets say you want to change the “<” icon to “>” icon?

Am I correct ?

yes, that’s correct.

Okay. I am setting up right now an example for you.

Regarding changing the icon by name:

  1. Since the “Material icon” plugin doesn’t give you back the name of the icon . You need to specify the name of each icon you want to use.
  2. Depending on the way, you are changing the value of title…you need to configure it so it works with your way.
  3. I have set up two states since I am changing the color and the icon by two inputs only (you can add more).
  4. The “material icon” checks if the current value of the “Choose icon” state is…it changes the icon to… You need to specify all of these in the conditional tab of the “material icon”. Lets say if the state’s value=“left”, the icon displayed is “<”.

Regarding changing the color:

  1. Same as how it changes the icon. The “material icon” checks if the current value of the “Icon color” state is…it changes the color to… You need to specify all of these in the conditional tab of the “material icon”

Here is the link:

1 Like

Many thanks for your answer, it function great, but when will be added new status to the database I’ll must change the app and the condition.

it is doable. Do you want to save all the statuses (logs) or you want to save one status and depending on this one status, the changes will occur?

I have collection reservation and collection reservation statuses. Reservation has only one status from the collection reservation statuses. The statuses will be possible to change in the settings tab. For example add new status (with color, with icon) etc.

1 Like

Check the link

Thank you so much

1 Like

What’s up Bubble community. I’m taking the AirDev certification course and needed a little help with icon changing it’s state. In the screenshot provided, the goal is to change the icon to an X icon if the guest was not attending the party. Any advice would be extremely helpful. Thanks and I appreciate any help that the community can provide a bubble student :slight_smile:

Steve @ Gozy Mobile Solutions