ShaperRater - A Rating Control

• Download source code - 63.5 KB

Introduction

The ShaperRater is a simple bindable ratings control to graphically show a rating value. We've all used something similar before in rating music or movies.

Here is a list of its features:

1. If you don't like stars, this control has other shapes to choose from.
2. A label is available to display different text for each value.
3. Separate border and fill colors for each state: empty, filled, or being hovered over.
4. Value numbers (all or just selected value) can be displayed with the shape.

Background

I was writing a DVD movie database program, and wanted to have a rating control like what I have seen elsewhere. I started out using little images, and although it did work, I wanted more versatility, so I started over and began drawing the shapes directly. This made design-time better, and made the control more dynamic.

Control Properties

Here is a list of the primary properties:

• CurrentRating

This is the bindable ratings value.

• MaxRating

How many shapes to draw.

• Shape

Star, Circle, Square, Triangle, Heart, and Diamond.

• RadiusOuter

Radius size for shape.

• RadiusInner

The second radius of the Star shape.

• ShapeGap

Set gap between each shape.

• ShapeBorderEmptyColor, ShapeBorderFilledColor, ShapeBorderHoverColor

Color of the border for each state.

• ShapeColorEmpty, ShapeColorFill, ShapeColorHover

Color to fill the shape for each state.

• HighlightRateFill, HighlightRateHover

Changes the behavior of the fill and/or hover to highlight all the shapes or just the value shape.

• ShapeNumberShow

Whether to show the number: None, All, or RateOnly.

• ShapeNumberColor, ShapeNumberFont

Format the number shown.

• ShapeNumberIndent

Tweak the position of the number.

• LabelAlignment, LabelIndent, LabelShow

Label formatting options.

• LabelText

Base text to display and 0 value text.

• LabelTextItems

Text to display for each selected rating.

• LabelFormatString

String.Format where {0} = rate being hovered over and {1} = the MaxRating.

• LabelTypeHover, LabelTypeText

What type of text to display while hovering and after selection.

Using the Code

Once you get the ShaperRater designed the way you want, there isn't really any code. Just get the CurrentRating and use it the way you want:

Private Sub Rater1_CurrentRatingChanged(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles Rater1.CurrentRatingChanged

    MessageBox.Show(Rater1.CurrentRating)
End Sub

Using the Control

• Left click the control to select the CurrentRating.
• Right click to reset the CurrentRating back to 0 during runtime.

History

• Version 1.0 - March 2008.