> For the complete documentation index, see [llms.txt](https://docs.thunkable.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.thunkable.com/snap-to-place/rating.md).

# Rating

## Rating Overview

The Rating component is a visible component which can be used to display the rating of a product or content in your app, and allow the user to leave their own rating.

A Rating component is made up of 5-10 *icons*. An icon can be filled, partially filled, or empty, as seen below:

![A Rating component displaying a rating of 3.5/5](/files/-MGxK6G1nzFoNDTdK8Uy)

## Event Blocks

### On Rate

This block fires when a user enters a rating in the Rating component.

![](/files/-MHBIJY9FgiRkI09Q-OP)

## Properties

### Count

Maximum rating that can be given. Can be an integer between 5 and 10, selected from a drop-down menu.

![](/files/-MWdG_LN1gAgFdDiwyL6)

### Direction

Select how the Rating component is displayed: as a **row** (left-right), **row-reverse** (right-left), **column** (top-bottom), or **column-reverse** (bottom-top).

![](/files/-MWdGi5JZUygyGpNePut)

### Font Size

Change the size of the icons that make up the Rating component.

![](/files/-MWdGrtmh2psoYhHCxCq)

###

### Height 

Set or get the `height` of the rating component in pixels.

![](/files/-MWdHIMWJXuRW0Jcfo4q)

### Icon Margin 

Get or change the size of the margin between the icons of the Rating component.

![](/files/-MWdHCAefg1JphCOLH5P)

### Icon

You can select an image from the list available. All of the image options are suitable for any platform. You can preview the image options [here](https://icons.expo.fyi/).

You can upload your own images to be displayed for filled and empty icons.

![](/files/-MWdH7zN0Z3MOK9_YB4N)

### Read Only

Toggle whether the user can edit the value displayed on the Rating component. If read-only is true, the value cannot be edited. If read-only is false, the value can be edited.

![](/files/-MWdIOrTGLMqvCXkh5nK)

### Rating Background Color

Select the color of an unfilled icon.

![](/files/-MWdIWLWnrURFMi1Liym)

### Rating Color

Select the color of a filled icon.

![](/files/-MWdIYMfHzObjb6KDz8K)

### Value

Initial value displayed on the Rating component. Can be any number between 0 and the maximum value, including decimals.

![](/files/-MWdI_ppIUEI9prHd8_5)

### Visible

Toggle whether your Rating component is visible.

![](/files/-MWdIcYt9bR5XRxqWivM)

### Width 

Set or get the `width` of the rating component. Given in Pixels.

![](/files/-MWdHgNUqfCGDwcwPhlW)

### X 

Set or get the horizontal position of the rating component on the screen. 

![](/files/-MWdHoiZfVUE7G9jdKjc)

### Y

Set or get the vertical position of the rating component on the screen.

![](/files/-MWdHtOZDY2kXFF9wnDX)

###