I have searched everywhere and can't find any information on this... So I hope you can help me.
How do I make a dynamic star rating system/bar in Adobe XD?? I would like to use the Hover effect.
I am inspired by the rating system that Goodreads use (see video attached)
Thanks for your help.
You'd need multiple hovers, but when I tried layering them you couldn't see the ones underneath. So I don't think you can do this, but I'm curious to see if anyone else comes up a tricky idea to get this to work.
Thanks for trying.
Yes it's a tricky one indeed...
Hope someone have a good solution
I want to create this effect with the stars:
2 rectangles (2 colours) in a component, the component is a scroll horizontall bar. I keep only the dark part visible usinng the sliders.
Then I crop the starts on a rectangle who has the same colour as the BG
I put the stars on top of the scroll component
component probably needs some explanation...
you can create a component that has a star on it, when click star changes its color; so that's for the first star.
For the second and next stars, you can copy past the component and deplace in next position, on click you can add a nnew star where prvious star was and change its color.
Here's an example setup, it's a bit fiddling around, but it works nicely - stars change on hover, and you can click the selected rating to "set" it permanently.