Visual Basic Concepts

Drawing the MyData Control

See Also

A data control needs a user interface to allow the user to move back and forth through the data. In this case, we'll duplicate the functionality and appearance of the familiar Data control using four CommandButtons and a Label control, with a PictureBox to act as a container.

Note   This topic is part of a series that walks you through creating sample data source components. It begins with the topic Creating Data Sources.

To add constituent controls to the MyData control

1. In the Project Explorer window, double-click MyData to open its designer.
   
   
2. In the Toolbox, double-click the PictureBox control to place a PictureBox control on the MyData designer. Move it near the upper left-hand corner of the designer.
   
   
3. In the Properties window, set the following property values for the PictureBox control:

   Property	Value
   BackColor	&H80000005 (Window Background)
   Width	4500

   
   
4. With the PictureBox control selected, select the CommandButton control in the Toolbox and draw a CommandButton control on top of Picture1. Repeat the process to add a total of four CommandButton controls (but don't create a control array).
   
   
5. In the Properties window, set the following property values for the CommandButton controls. Where multiple values are shown, values represent settings for Command1 through Command4; otherwise, the value applies to all four CommandButton controls:

   Property	Values
   (Name)	cmdFirst; cmdPrev; cmdNext; cmdLast
   Caption	(Empty)
   Picture	First.bmp; Prev.bmp; Next.bmp; Last.bmp
   Style	1 - Graphical
   Width	300

   
   

   Note   The bitmaps for the Picture property can be found in the same directory as the AXData sample application.

6. In the Toolbox, select the Label control draw a label on top Picture1. In the Properties window, set the following property values for the Label control:

   Property	Value
   (Name)	lblCaption
   BackStyle	0 - Transparent
   Caption	MyData

   
   
7. Rearrange the Shape and Label controls to look similar to the example shown below. Don't worry about precise placement because the code in the Resize event will take care of that. Select the MyData control and use the grab handles to resize it slightly larger than the area containing the controls.

8. Double-click the MyData designer to bring the code window to the front, and add the following code to the UserControl_Resize event procedure:

   Private Sub UserControl_Resize()
      Picture1.Move 0, 0, Width, Height
      cmdFirst.Move 0, 0, cmdFirst.Width, Height - 60
      cmdPrev.Move cmdFirst.Left + cmdFirst.Width, 0, _
         cmdPrev.Width, Height - 60
      cmdLast.Move (Width - cmdLast.Width) - 60, 0, _
         cmdLast.Width, Height - 60
      cmdNext.Move cmdLast.Left - cmdNext.Width, 0, _
         cmdNext.Width, Height - 60
   
      lblCaption.Height = TextHeight("A")
      lblCaption.Move cmdPrev.Left + _
         cmdPrev.Width, ((Height - 60) _
         / 2) - (lblCaption.Height / 2), _
         cmdNext.Left - (cmdPrev.Left _
         + cmdPrev.Width)
   End Sub
   

   This code will execute when the MyData is initialized or whenever it is resized to rearrange the constituent controls and provide a consistent appearance.

9. Add a pair of Property Let / Property Get procedures to expose the Caption property of lblCaption:

   Public Property Get Caption() As String
      Caption = lblCaption.Caption
   End Property
   
   Public Property Let Caption(ByVal NewCaption As String)
      lblCaption.Caption = NewCaption
      PropertyChanged "Caption"
   End Property
   

10. In the Object box, select (General). In the Procedure box, select (Declarations) to position yourself at the top of the code module. Add the following code:

    Option Explicit
    
    ' Enumerations for the BOFAction Property.
    Public Enum BOFActionType
       adDoMoveFirst = 0
       adStayBOF = 1
    End Enum
    
    ' Enumerations for the EOFAction Property.
    Public Enum EOFActionType
       adDoMoveLast = 0
       adStayEOF = 1
       adDoAddNew = 2
    End Enum
    
    ' Declare object variables for ADO connection 
    ' and Recordset objects.
    Private cn As ADODB.Connection
    Private WithEvents rs As ADODB.Recordset
    
    ' Default Property Values:
    Const m_def_RecordSource = ""
    Const m_def_BOFAction = BOFActionType.adDoMoveFirst
    Const m_def_EOFAction = EOFActionType.adDoMoveLast
    Const m_def_ConnectionString = ""
    
    'Property Variables:
    Private m_RecordSource As String
    Private m_BOFAction As BOFActionType
    Private m_EOFAction As EOFActionType
    Private m_ConnectionString As String

11. In the Object box, select UserControl. In the Procedure box, select the InitProperties event. Add the following code to the UserControl_InitProperties event procedure:

    Private Sub UserControl_InitProperties()
       m_RecordSource = m_def_RecordSource
       m_BOFAction = m_def_BOFAction
       m_EOFAction = m_def_EOFAction
       lblCaption.Caption = Ambient.DisplayName
       m_ConnectionString = m_def_ConnectionString
       Set UserControl.Font = Ambient.Font
    End Sub
    

12. Before we move on, now would be a good time to save your changes. Choose Save Project from the File menu to save your project.

For More Information   See "Drawing the ShapeLabel Control" and "Adding an Event to the ShapeLabel Control" in "Creating an ActiveX Control."

Step by Step

This topic is part of a series that walks you through creating sample ActiveX data sources.