How to set various heights between SfRatingItems?
The SfRating control enables to change the height of the SfRatingItem. The following code enables SfRating control having items with different heights.
XAML
<syncfusion:SfRating Height="50" VerticalAlignment="Center" HorizontalAlignment="Center" VerticalContentAlignment="Center" Value="3"> <syncfusion:SfRatingItem Height="20"/> <syncfusion:SfRatingItem Height="18"/> <syncfusion:SfRatingItem Height="16"/> <syncfusion:SfRatingItem Height="14"/> <syncfusion:SfRatingItem Height="12"/> </syncfusion:SfRating>
You can also provide similar height using the ItemContainerStyle property of the SfRating control. The following code implements the ItemContainerStyle property.
XAML
<syncfusion:SfRating Height="50" Width="300" ItemsCount="10" Value="4"> <syncfusion:SfRating.ItemContainerStyle> <Style TargetType="syncfusion:SfRatingItem"> <Setter Property="Height" Value="12"/> </Style> </syncfusion:SfRating.ItemContainerStyle> </syncfusion:SfRating>
You can also provide the height for the SfRatingItem in code behind as follows.
C#
ratingItem.Height = 20;
