Making an ActiveX Control for Dice

Lesson #1 - Concept & Design Overview

This tutorial does assume you have a basic grasp of some VB concepts otherwise this tutorial would have to be many time larger to define all related issues. In particular we use one of VB's wizards to generate some code. If I was to create all the code by hand, or explain it line by line, I'd be writing a book instead of a few short lessons. So if you know that the 'wizard' I'm talking about isn't a funny little guy living in Oz you should be ok. Feel free to ask any questions in the ActiveX forum in the VB Forums section of this site.

For the record:  The word "dice" is actually the plural form of the word "die".  Since the control will represent a single object, it is more properly called a die control.  However, naming the control UDie just doesn't sound as pleasant as UDice.  Because of this, I've chosen to take a little artistic license and have named the object UDice.

Let's start by outlining some basic features and functionality that we'll want the dice control to provide.  For purposes of this project, we'll assume a standard, six-sided cube with values ranging from one to six.  At the very least, the control should display the appropriate number of "spots", which represent the ordinal values on each face of the dice.  Additionally, these spots should be placed in a familiar pattern.  I've chosen the following spot placements for each of the six ordinal values:

To keep it interesting we can add some color properties.  We'll allow the users of the control (called "clients") to assign color values for the border, background, spots and the inside of each spot.  We'll call these properties BorderColor, BackColor, SpotColor and FillColor, respectively.  This will allow us to make some colorful dice:

We'll use an enumeration to assign values to the BorderStyle property.  We'll call the enumeration EBorderStyles and include the members bsNone and bsSolid.

An enumeration is a way to group special related named constants that have values of type Long.  Instead of using values like 1 and 2, we'll use an enumeration to assign names to these values - like bsNone and bsSolid.  If the users of the control had to use numeric values, it would be hard to remember which value should be used to tell the control to display a border and which value will make the border disappear.  By assigning names to these values, it makes it clear which value should be used. Here's a sneak peek at how the enumeration we'll be using is defined: 'An enumeration of border styles for the dice control. Public Enum EBorderStyles   bsNone   'No border.   bsSolid  'Draw a border. End Enum When a property's type is declared as an enumeration, Public Property Get BorderStyle() As EBorderStyles   '... End Property Public Property Let BorderStyle(ByVal NewValue As EBorderStyles)   '... End Property VB uses the member names in the drop-down combo box of the Properties Window.  VB will also display the member names when the Auto List Members option is enabled:

We'll implement two events - Click and DblClick.  As expected, the control will raise these events when the user clicks or double-clicks the mouse while over the dice control.  To disable click events, we'll also include an Enabled property.  When set to False, this will prevent any click events from firing.

The last feature we'll implement is the ability to re-size the control.  As the dice get bigger, the spots should get bigger and the border should get thicker.  This feature will be the most difficult to implement.  We'll talk more about it when we add this feature to the control.  For now, take a look at a small sampling of what the dice control can be sized to look like:

Design Summary

Properties:

BackColor

The color of the dice's background.

BorderColor

The color of the dice's border.

BorderStyle

Determines if the dice displays a border.

Enabled

Determines if either of the mouse click events can be fired.

FillColor

The color of the inside of the dice's spots.

SpotColor

The color of the border of the dice's spots.

Value

The ordinal dice value - in the range of 1 to 6.

Methods:

Random

A function that randomly selects a value from 1 to 6, assigns it to the Value property and returns the value.

Events:

Click

Fired when the user clicks the dice control.  This event won't fire if the Enabled property is set to False.

DblClick

Fired when the user double-clicks the dice control.  This event won't fire if the Enabled property is set to False.

What's Next?

© 2000, Brian P. Duckworth

[Dice 1] [Dice 2] [Dice 3] [Dice 4] [Dice 5] [Dice Bitmaps] [Dice Project]