You may have seen in a number of my classes that they come with a built in builder which makes it easy to set the correct properties and gives you a correct view of how the object will look with the properties set.

Recently one of the Foxite guys created a spinner class suitable for large fingers and touch and I sent him a Builder for it. He requested a tutorial as to how to create a Builder like that and as I had also been thinking that this would be useful, I decided to document the process here. We will be using the spinner class created by Tony Vignone for this [All included in the download ] or you can use any class you want.

A custom Visual class may have a number of properties that need setting-up and it is useful for the end user to have all these in one place rather than in a long list. So the first thing to do is to add the properties a user can change to the Favourites tab. This way the changeable ones are separate from the internal and non-changeable properties.

To do this the class needs to have MemberData. So this is the first step in setting up the class.

  1. Open the class and add a custom property - _memberdata [underscore-memberdata]
    1. In the Property sheet, select each property to be added to the Favourites tab, Right Click on it and from the popup select "Add to Favourite"
    2. Add another custom property to your class and call it    _BigSpinnerBuilder. Give it an initial value of 0 [zero]. Right click on it and add it to the favourites tab.
    3. Right click on this new _BigSpinnerBuilder property and select "MemberData Editor" from the popup and the MemberData Editor opens. Set it up as in the image below, click on the magnify icon and in the code window that opens paste this code:
    nControls = ASelObj(aObjects)
    If nControls # 0
       oObject = aObjects(1)
       Set Classlib To (oObject.ClassLibrary)
        IF VARTYPE(_screen.oWiz) = "U"
           _screen.addproperty("oWiz","")
        ENDIF
       _screen.oWiz = Createobject("BigSpinnerBuilder", oObject)
       _screen.oWiz.Show()
    EndIf

    See the image below:

Click OK to close the Editor and save the changes.

You can now close the custom class.

Time to create our builder. For most builders we need a simple form where we can set properties as needed. So simply create a new VFP form - File-> New-> Form. This will be our builder. So with the form selected, from the file menu:

File Save As Class and save the form as a class into the same classlib that our above class is stored. Give it the same name as in the code we entered above - BigSpinnerBuilder.

We can now close the form without saving it and open the Form class - BigSpinnerBuilder from the Class browser.

Add an instance of the class - in this case - bigspinner - to the form by dragging & dropping it from the class browser. Decide on what properties you want to add to the builder and add appropriate controls. Here I have added just 3 properties but for this class there are a number of other properties that could be added to the builder. I leave that up to you.

I have chosen to allow the user to change the colours of the spinner and the Spinner Caption.

 

When the "bigspinner" class is placed on a new form and the _bigspinnerbuilder property is selected and the button clicked, this form is instantiated. So as usual the first thing we do is add the _memberdata property. It also requires the following code:

Create 3 new methods:

LoadClassProps()
SaveChanges()
UpdatePreview()

 

2 Properties

_memberdata
  • oSource - to hold an instance of the class from your form.

 

INIT() - stores an instance of the class on the form and calls the LoadClassProp()

Parameters oSource
If Vartype(oSource) = "O"
      This.oSource = oSource
      This.LoadClassProps()
Endif

 

LoadClassProps() - this simply sets the builder objects same as the class being edited

With This As Form
      .shpLightColour.BackColor = .oSource.shape2.FillColor
      .shpDarkColour.BackColor = .oSource.shape1.FillColor
      .txtButtonCaption.Value = .oSource.lblTitle.Caption
ENDWITH
 * update the preview
ThisForm.updatepreview()

 

UpdatePreview() - This code simply updates the class on the builder with the current settings.

* update the preview
WITH This.Bigspinner1
      .shape2.FillColor = ThisForm.shpLightColour.BackColor
      .Arrows.shape4.FillColor = ThisForm.shpLightColour.BackColor
      .lblTitle.Caption = ALLTRIM(ThisForm.txtButtonCaption.Value)
      .lblTitle.Forecolor = ThisForm.shpDarkColour.BackColor
      .shape1.FillColor = ThisForm.shpDarkColour.BackColor
      .Arrows.Shape3.FillColor = ThisForm.shpDarkColour.BackColor
ENDWITH

SaveChanges() - this simply updates the control being edited using the stored instance

With This as Form
      * light
      .oSource.shape2.FillColor = .shpLightColour.BackColor
      .oSource.Arrows.shape4.FillColor = .shpLightColour.BackColor
      * dark
      .oSource.shape1.FillColor = .shpDarkColour.BackColor
      .oSource.lblTitle.Caption = ALLTRIM(.txtButtonCaption.Value)
      .oSource.lblTitle.Forecolor = .shpDarkColour.BackColor
      .oSource.Arrows.shape3.FillColor = .shpDarkColour.BackColor
Endwith

 

* update the preview
ThisForm.updatepreview()

 

The objects also have their own code:

shpLightColour.Click() / shpDargColour.Click()

LOCAL nCol
nCol = GETCOLOR(This.BackColor)
IF nCol > -1
      This.BackColor = nCol
ENDIF

cmdApply.Click() - apply the changes

 

With ThisForm
     .SaveChanges()
EndWith

cmdCancel.Click()

ThisForm.Release

And that is all there is for creating your builder.

 

Adding another property to the builder

Now suppose you wanted to add the property of the class - arrowspersist to the builder. This is a logical property that if set to .T. will always show the Arrow and idf .F. the arrow is hidden till the control is touched. So we can use a checkbox.

On the builder form add a checkbox as shown and set its initial value = .F.

The code changes needed will be:

LoadClassProps()

* set the builder control value to our control value
.chkPersist.Value = .oSource.arrowspersist

SaveChanges()

*Update the control being edited with the value we set on the builder form
.oSource.arrowspersist = .chkPersist.Value

 

UpdatePreview()

*Update the onscreen preview. This is a "LIVE" instance since the form is running
.arrowspersist = ThisForm.chkPersist.Value

That is all that is needed.

Hope this helps you create builders for your classes.

Downloads

BigTouchCtrlsFull.zip - The complete latest version of Tony's classes.

BigTouchCtrlsTutorial.zip - The files used in the above tutorial.

Download both and use the Tutorial zip for following this post, but use the BigTouchCtrlsFull as it has been updated.

Original files and link to the Foxite discussion is here - http://www.foxite.com/archives/another-big-control-revision-3-0000411778.htm

BigTouchCtrlsFull

BigTouchCtrlsTutorial

 

Leave a Reply

Your email address will not be published. Required fields are marked *