Rating Control

The FioriRating is a composable layout used to display the score assigned to the layout in the form of stars.

Setting up a Rating Control

Create a rating control:

FioriRating(
    modifier = Modifier // This modifier is assigned to the very outside container of the rating control.
        .height(20.dp) // The height of the rating control.
        .padding(vertical = 1.dp) // The vertical padding of the rating control content.
        .wrapContentWidth(),

    enabled = true, //This is to set the status of Rating control.

    editabled = true, //This is to allow user to change the rating.

    ratingConfiguration = RatingConfiguration.Builder().build(), //The rating configuration is allow user to set leading label,trailing label,max line ,size,customize icon and if support half icon

    rating = Rating.rating(3.1f),  // The score assigned to the control. This is an enumerable object, indicating how the stars are displayed in the control. The float number will be rounded to the closest rating score.

    onRatingChanged = {}, //This is the callback when rating changed.

    colors = FioriRatingDefaults.color(), // Customize the colors assigned to the rating control.

    labelStyle = FioriRatingDefaults.typography(), // Customize the typography assigned to the label.
)

An accent color is also available to developers:

FioriRating(
    ...
    colors = FioriRatingDefaults.color(
                    tint = accentColor() // Apply the accent color to the tint.
                )
)

---

Last update: March 11, 2025