Dynamically change number of icons

In building a review site, if an Object’s AvgRating attribute is 2 then I want 2 full star icons and 3 outline star icons. If an Object’s AvgRating attribute is 4, then I want 4 full star icons and 1 outline star icons.

For ease of this exercise, assume half stars don’t matter. Is this possible to do in Bubble? Can’t figure it out.

Yes, this is possible in Bubble.

First you would want to allow the users to add their star ratings to a product or something in your database like this:

Editor: testApp42wCleanDB | Bubble Editor
Preview: https://testapp42wcleandb.bubbleapps.io/version-test/star_rating?debug_mode=true

Then you can use that to calculate the average for the product.

Does that help?

oh interesting - this is helpful please dont’ delete yet. but i’m not at this step. i’m at the step where I want to display the rating of an item where the rating is already a database attribute.

but the rating may be 2 star, or 4 star, etc., and based on how many stars the item has on average, i want to be able to show that many filled stars, followed by remaining empty stars.

so in your example, there’s another view where an onlooker sees that the jacket has 2 filled stars because it has a rating of 2. and i want to make this 2 filled stars dynamic, because next to to the jacket, there may be pants with a rating of 4. I need to use the dynamic icons in a repeating group. let me know if that makes sense.

So, it should be the same way that I am showing you. Can you share an example with a picture at where you are getting stuck? :blush:

In addition of the approach suggested by @J805 you could use some plugin like Star Rating maintained by Bubble (documentation here).

This doesn’t allow much customization as the approach above, but it might be enough for most use cases.

1 Like