# RatingBar

A RatingBar is a component that shows a rating in stars. The user can touch/drag or use arrow keys to set the rating:

![](https://3777451846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L93-jOwVwLojc0B0kcn%2F-L9BuJyLkdYbNvBFGfWc%2F-L9BuS4uhAAqSia3LRPv%2FtutRatingbar1.png?generation=1522782578008206\&alt=media)

This is a User Interface component that can be added to screen layout. It contains default properties such as number of stars, the current selection, color, etc:

![](https://3777451846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L93-jOwVwLojc0B0kcn%2F-L9BuJyLkdYbNvBFGfWc%2F-L9BuS5Cg_6zAetJi_4F%2FtutRatingBar2.png?generation=1522782568628915\&alt=media)

For this tutorial, as shown above, we are setting defaults NumStars to 5, a start-up Rating of 4.5, StepSize of .5 (half stars selection) , StarColor of Red, and AllowSelection to true, allowing user to touch & drag & select number of stars for rating.

## Blocks

Event block AfterSelecting gets triggered when user touches and drags the stars. As dragging is done, this block will return the Rating (number of stars) selected.

![](https://3777451846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L93-jOwVwLojc0B0kcn%2F-L9BuJyLkdYbNvBFGfWc%2F-L9BuS5OA05R_KO68ttG%2FtutRatingBar3.png?generation=1522782569280716\&alt=media)

In this event-block, we can add other blocks to display additional information:

![](https://3777451846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L93-jOwVwLojc0B0kcn%2F-L9BuJyLkdYbNvBFGfWc%2F-L9BuS5X1gAwtxGSfwSn%2FtutRatingbar1.png?generation=1522782578037571\&alt=media)

This component includes many other blocks that can be used to programatically set or update the component settings:

![](https://3777451846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L93-jOwVwLojc0B0kcn%2F-L9BuJyLkdYbNvBFGfWc%2F-L9BuS5iEHLd2OAvRF_b%2FtutRatingBar4.png?generation=1522782567777686\&alt=media)