Appearance and Styling
14 Jun 2019 / 4 minutes to read
You can customize the color, stroke width, and stroke color of rated and unrated items using the following properties of SfRatingSettings:
RatedFillUnRatedFillRatedStrokeUnRatedStrokeRatedStrokeWidthUnRatedStrokeWidth
Set Fill Color
SfRating control has support to set the fill color for the selected and unselected items.
Selected Items
The RatedFill property fills the rated area with the specified solid color in the SfRating control.
SfRating rating = new SfRating();
rating.Frame = new CGRect(10, 15, this.View.Frame.Width, this.View.Frame.Height);
rating.Value = 3;
SfRatingSettings ratingSettings = new SfRatingSettings();
ratingSettings.RatedFill = UIColor.Red;
rating.RatingSettings = ratingSettings;
Unselected Items
The UnRatedFill property fills the unrated area with the specified solid color in the SfRating control.
SfRating rating = new SfRating();
rating.Frame = new CGRect(10, 15, this.View.Frame.Width, this.View.Frame.Height);
rating.Value = 3;
SfRatingSettings ratingSettings = new SfRatingSettings();
ratingSettings.UnRatedFill = UIColor.Gray;
rating.RatingSettings = ratingSettings;
Set Stroke Color
SfRating control has support to set the stroke color for the selected and unselected items.
Selected Items
The RatedStroke property sets the stroke for the rated area with the specified solid color in the SfRating control.
SfRating rating = new SfRating();
rating.Frame = new CGRect(10, 15, this.View.Frame.Width, this.View.Frame.Height);
rating.Value = 2;
SfRatingSettings ratingSettings = new SfRatingSettings();
ratingSettings.RatedStroke = UIColor.Green;
rating.RatingSettings = ratingSettings;
Unselected Items
The UnRatedStroke property sets the stroke color for the unrated items with the specified solid color in the SfRating control.
SfRating rating = new SfRating();
rating.Frame = new CGRect(10, 15, this.View.Frame.Width, this.View.Frame.Height);
rating.Value = 2;
SfRatingSettings ratingSettings = new SfRatingSettings();
ratingSettings.UnRatedStroke = UIColor.Green;
rating.RatingSettings = ratingSettings;
Set Stroke Thickness
SfRating control has support to set the stroke thickness for the selected and unselected items.
Selected Items
The RatedStrokeWidth property sets stroke thickness to the rated items with the specified value in the SfRating control.
SfRating rating = new SfRating();
rating.Frame = new CGRect(10, 15, this.View.Frame.Width, this.View.Frame.Height);
rating.Value = 3;
SfRatingSettings ratingSettings = new SfRatingSettings();
ratingSettings.RatedFill = UIColor.Red;
ratingSettings.RatedStroke = UIColor.Black;
ratingSettings.RatedStrokeWidth = 5;
rating.RatingSettings = ratingSettings;
Unselected Items
The UnRatedStrokeWidth property sets stroke thickness to the unrated area with the specified value in the SfRating control.
SfRating rating = new SfRating();
rating.Frame = new CGRect(10, 15, this.View.Frame.Width, this.View.Frame.Height);
rating.Value = 3;
SfRatingSettings ratingSettings = new SfRatingSettings();
ratingSettings.UnRatedFill = UIColor.Gray;
ratingSettings.UnRatedStroke = UIColor.Black;
ratingSettings.UnRatedStrokeWidth = 3;
rating.RatingSettings = ratingSettings;