How to display the star rating from google sheet?

hi, i have developed a star rating system in google sheet, but how do display this rating in my app? here is an example i have created in google sheet.

please advise with thanks

0 22 3,474
22 REPLIES 22

Hi @Beauchic_Sdn_Bhd! Welcome to the community!

Perhaps you could combine the stars in your Google spreadsheet using concatenate and then bring that into your app.

By the way, how do you get half stars and the empty stars? Could you share the formula you are using?

I got interested in this and found that half stars are available in newer UNICODE but I donโ€™t seem to be able to display the half stars on my Mac. So, I suspect that they will not display easily on various devices. Still, Iโ€™m very interested in how you are doing this on Google sheets.

hi @Kirk_Masden, i dont think is possible to combine the stars into 1 cell by using concatenate. i have tried the formula, but is not showing up the stars.

here is the link to the file for the stars, you can see the formula an you can try it out too (please make a copy and customize it for yourself):

Please do share with me if you have the solution, thank you

Thanks but you need to share the sheet. I got the following error:

3X_d_9_d9b2a7508875bf113d01b0416722ff54ae2960a7.png

I made a little app with a virtual column that has the following expression:

concatenate(ifs(floor([yournumber])=1,"โ˜…",
floor([yournumber])=2,"โ˜…โ˜…",
floor([yournumber])=3,"โ˜…โ˜…โ˜…",
floor([yournumber])=4,"โ˜…โ˜…โ˜…โ˜…",
floor([yournumber])=5,"โ˜…โ˜…โ˜…โ˜…",),
if(floor([yournumber])=[yournumber],"","โ˜†"))

Here is what the result looks like:

3X_d_6_d6af3858be8380de11e6149a0d7579d76b6b46df.png 3X_6_3_63b4e745f89c9caac7589591fff3e1464a20b0af.png

Itโ€™s not the same as yours because I couldnโ€™t find a half-star character.

Also, I donโ€™t think that AppSheet has the equivalent of a rept() function. That would be convenient in such circumstances.

Try:

left(
  concatenate(
    left(
      "โ˜…โ˜…โ˜…โ˜…โ˜…",
      floor([yournumber])
    ),
    "โ˜†โ˜†โ˜†โ˜†โ˜†"
  ),
  5
)

Brilliant! I knew there had to be a better solution but couldnโ€™t think of it. The double use of left() is something that I couldnโ€™t imagine but will try to remember. The left at the top just fills the spots that are "left"over from the second left. Now, if only there were a half star!

oppsโ€ฆ try this>>

hoping with this, i can get a better solution on how to appear this stars in the app. thanks.

I see. Youโ€™ve combined images. Personally, I think @Steveโ€™s solution is the best one for you, but it doesnโ€™t have the half stars.

If you want a graphic solution, the SVG solution might be good. Or, you could make 11-images, one for each point on your scale (0.0, 0.5., 1.0, 1.5 etc) and use an expression to invoke the proper image based on the value.

Another option is based on the tip and trick mentioned below and given by @Rene_Casana_Amaya

The AppSheet icon set has half star icons. So that may be used. However to show combination of empty, half and full stars, the workaround does require around 13 format rules. So this option will also take a bit longer to set up The test appโ€™s screen with with those many format rules shown below.

Wow! Thanks! Do you have a sample app? The original sample app seems to have been taken down.

Hi @Kirk_Masden,

Thank you. As you can see in the screen, I had added that star rating configuration to the sample app โ€œOrder Captureโ€. It basically revolves around just two columns and a bunch of similar but numerous format rules, each one for a rating.

I will be glad to share the details of all the format rules and other configuration. I plan to add that as an addendum post in that tips and tricks post thread by @Rene_Casana_Amaya referred above. That I believe will be a proper thread since it expands on idea in the thread.

Hope that will suffice. I will be glad to put together a sample app just in case required.

Great! Iโ€™ll follow the thread!

It seems that the half star isnโ€™t quite ready for prime time yet, in terms of general adoption.

But, SVG might work for you. SVG can be used in AppSheet:

Please see

Phong_Lam1
Participant V

Hi all, I Donโ€™t know why my app just show 1 star only, [D/A size 1-5] type Decima (display name how important It is), I created 5 format rule 1 star to 5 star

Lynn
Participant V

Hi @Phong_Lam
I dont believe you can do that using formatting. You could use an enum with star icons copy pasted in.

Phong_Lam1
Participant V

Hi @Lynn, How can I made It have colors ? I donโ€™t know where I can find the icons to copy so I take the stars above from @Steve , thanks

Lynn
Participant V

Hi @Phong_Lam
I didnt read back through the thread, I dont know how you colour those ones.

I wish there were a sample app. At this point, I think one would need to go back to the following to figure it out (Suvrutt has already shared this link):

Thatโ€™s right, @Suvrutt_Gurjar already shared link. But I did not follow the instructions very well. Now I understood. Basicly we we to have over 10 format rules to get It done

In this article, I will explain the following two methods to create a Star Rating System in Google Sheets- 

  1. Method 1โ€“ Using the CHAR function
  2. Method 2โ€“ Using the emoji keyboard
Top Labels in this Space