Introduction
The StarRating control provides you with the possibility to show a rating in a graphical way. It's doesn't do a lot but I haven't found something similiar so I decided to publish it. There is also not much to explain but someone may still like it.
I'm using this control in a sales opportunity application where it's now easier to see which acquisition we have to prioritise.
Features
- Selecting the images that will be displayed
- Setting the maximum
- Changing the value
Public properties
ImageEmpty | This is the image that is displayed for non-available stars. |
ImageChecked | This is the image that shows the selected stars |
MaxStars | The maximum number of stars that a user can selected |
Stars | The number of stars that currently are selected |
Using the code
Everything is written be using the Express edition of Visual Studio 2005. Currently there is not project file available for older version as I don't have access to it. Backporting shoulnd't be a big problem as there are only two files needed (StarRating.cs and StarRating.Designer.cs).
Paint method
All drawing functions are in the Paint
method. A simple loop to the maximum number checks whether the empty or the checked image has to be drawn. Make sure not to create an extra Graphics instance be calling this.CreateGraphics()
. The Paint method provides you with a reference to a Graphics object.
if (imageChecked == null || imageEmpty == null) return;
for (int i = 0; i < maxStars; i++)
{
Point newPoint = new Point(imageChecked.Width * i, 0);
if (i < (tempStars == -1 ? stars : tempStars))
{
e.Graphics.DrawImage(imageChecked, newPoint);
}
else
{
e.Graphics.DrawImage(imageEmpty, newPoint);
}
}
Temporary Selection
Whenever the user moves the mouse over the control the stars are temporary drawn
to the point the mouse is. This is done in MouseMove
double tempStarsD = (e.X + imageChecked.Width - 5) / imageChecked.Width;
int newTempStars = Convert.ToInt32(Math.Floor(tempStarsD));
if (!newTempStars.Equals(tempStars))
{
tempStars = newTempStars;
this.Invalidate();
}
The "-5" is necessary because otherwise it wouldn't be possible to select 0 as the
first star is drawn at the point 0,0.
It's also possible to draw a blank are by changing this line in the
Paint</code method:
</p>
<pre>
Point newPoint = new Point(imageChecked.Width * i, 0);
</pre>
<p>
to something like that
</p>
<pre>
Point newPoint = new Point(imageChecked.Width * i + 5, 0);
</pre>
<h3>Selection</h3>
<p>
The actual selection is done in <code>MouseDown
which is also pretty simple
double sStarsD = (e.X + imageChecked.Width - 5) / imageChecked.Width;
int newStars = Convert.ToInt32(Math.Floor(sStarsD));
if (!newStars.Equals(stars))
{
stars = newStars;
if (stars > maxStars)
{
stars = maxStars;
}
this.Invalidate();
}
Data Binding
It's also possible to use this control in a data bound way. This can be done in
the same way as I have to when using a CheckBox
starcontrol.DataBindings.Add("Stars", dataSet, "probability");
History
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.