Telerik RadControls for Windows Phone – Article #5 – RadRating – Rating Control

Telerik RadControls for Windows Phone provides the RadRating , a rating control that enables the developers to implement the rating mechanism in their Windows Phone Application .

The RadRating control allows the user to rate something by tapping and selecting the value from the range of values .

To add the RadRating control to your Windows Phone Page , Just drag and drop the RadRating Control from the Visual Studio Toolbox to the Page .

This will add the references of the following assembly files to the Windows Phone Project

Telerik.Windows.Controls.Input
Telerik.Windows.Controls.Primitives
Telerik.Windows.Core

This step will also add the corresponding XAML entries to the Windows Phone Page .

You can also add the RadRating Control manually via the following ways

1. XAML

Add the following namespace entry in the xaml page

xmlns:telerik=”clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input”

Declare the RadRating control with the following entry

<telerik:RadRating Name="ratingControl1"/>

2. Code behind

Create an instance of RadRating add it to the Page or the Panel.

RadRating rating = new RadRating();
ContentPanel.Children.Add(rating);

By default , the RadRating Control adds 5 rating items (stars) from which the user can select the value . You can modify this by setting the correct value to the property AutoGeneratedItemsCount or by adding the RadRatingItem to the RadRatingControl

RadRating rating = new RadRating();
rating.AutoGeneratedItemsCount = 3;

Now , how about having a different shape for the rating control items instead of starts (default) ? . RadRating includes a simple property called “ItemShapeStyle” that lets you change the shape of the items .

You can modify the shape by setting the property ItemShapeStyle with the predefined values like below .

<telerik:RadRating Height="61" Name="radRating1" ItemShapeStyle="Hearts1" />

CodeBehind

radRating1.ItemShapeStyle = ShapeStyle.Hearts1;

ItemShapeStyle has 5 predefined values as described below

• Hearts1
• Hearts2
• Hearts3
• Stars1
• Stars2