How to display ratings?

I’m planning to add ratings to my app, 1-5. I’ve added a collection like this:

I’ve also thought about doing a number field where the user writes a number between 1-5.

My issue is, how would I display the rating?
I want it to display like this, but having a hard time hiding and showing so many images based on the rating.

I Would guess you’d have a way to use an IF function for this in Adalo (newbie)
if Rank value = 1, display Icon1Star Hide other Icons*
if Rank value = 4, display icon4stars, Hide other icons*

@alexid95 I would do this differently. I would drop the True/False 1-5 star fields from the object collection and add a related collection called “Ratings” with three properties:

Rating (Number)
The 1-5 grape image (Image)
ObjectID (Relational)
UserID (Relational - who submitted the rating)

Write a new record to the ratings collection every time someone leaves a rating.

Then in your card for the wine you make the image type = URL, average the ratings from the ratings table for that wine and have it display the graphic that corresponds with the closest rating that object has. If you need to do fractional ratings and images you can do that using the ROUND() function and make whatever “resolution” you need (10 images if you want to have 3.5 star capability, 20 images if you want to support 3.25 stars, etc). You’ll make use of the “Custom Formula” option in Magic Text to do this. I use this technique to render a “thermometer” image to show completion of funding for a particular project:

That makes it so you can just reference one image rather than having a bunch of complexity with visibility rules hiding showing partial images.
If you have to support infinitely granular star rating images then it might be worth messing with trying to do it via the visibility rules approach.

Also (and this is just personal preference) I would consider breaking out “Likes” into a separate collection as well. It’s generally better to store the raw data rather than derived values in a db (with some exceptions). You can log the data of each like in a separate “Likes” table and it records things like:

LIker UserID
DateTIme
IP address

And then for displaying your likes count you just do SUM on the records in that table linked to that object/wine. That gives you the advantage of being able to wipe all the likes of a malicious liker gaming the system after the fact and be able to do things like mine data on usage patterns, etc later on.

anyways lmk if that makes sense

3 Likes

Perfect! Thank you :smiley:

@alexid95 @Franklin I made a video and wrote up a blog post that shows how to setup the star ratings component from scratch.

I walk through the entire process of building this page and the data collections behind it:

lmk if you have any questions.

2 Likes

Thank you @charitymakeover this would be very helpful!

thanks. Just to be clear it’s already created and accessible via the link above. enjoy.