Home

SPIN CONTROL

A spin button is a control equipped with two buttons and each button displays an arrow. The spin button allows the user to navigate through a range of value using the arrow buttons to increase or decrease the value held by the control.

To create a spin button, you can use the Spin button from the Controls toolbox. Alternatively, Visual C++ provides the Microsoft UpDown Control as an ActiveX control.

  1. Use AppWizard to create a Dialog based app. Call it: ExoSpin
  2. Once you are in the Visual Studio, press the following combination:
            Alt -> b -> o to access the Set Active Configuration... dialog box.
            Click ExoSpin - Win32 Release and press Enter
  3. Pick up an Edit box from the Control toolbox and drop it in your dialog
  4. Change the identifier of that Edit to IDC_EDITSPIN.
  5. Get a Spin control from the Controls toolbox, drop that Spin control on
            your dialog, preferably next on the right of the Edit box.
            Press Alt+Enter to access the Spin Properties dialog.
            from the General tab, change the Spin's ID to IDC_SPIN. From the Styles
            tab, specify the Alignment as Right, check the Set buddy integer.

        c)  To build and execute your app now, press Ctrl+F5.

    3.      The Spin control works fine but like most users, you might not like its
            orientation.

        a)  Press Ctrl+W to access the ClassWizard. Click the Member Variables tab.
            Make sure that the Class name: is CExoSpinDlg.
            Double-click IDC_SPIN and Add Member Variable as: m_Spin, press Enter.

        b)  While you are still in the MFC ClassWizard,
            and the Class name: is CExoSpinDlg, click the Message Maps.
            In the Member functions: listbox,
            double-click OnInitDialog to access its implementation.
            The default range of a SpinCtrl is from 0 to 100 (actually, it's
            awkwardly from 100 to 0.
            So, we will change that range to make it look better, we will use the
            CSpinButtonCtrl::SetRange() function. That function simply requires a
            lower and an upper integers. For demonstration purposes, use 0 and 54.
            Edit it as follows:


    // TODO: Add extra initialization here

    m_Spin.SetRange(0, 54);


        c)  After you build and execute your app now, do you like it, now that the
            upper arrow gives positive values?

        d)  To make it a little interesting, let's see how you can make the Edit
            dislay a certain value at startup.
            Press Ctrl+W to access the ClassWizard. Click the Member Variables tab.
            In the Class name combo box, choose CExoSpinDlg and double-click
            IDC_EDITSPIN. Add the member variable m_EditSpin of type CString and
            press Enter. Then, click OK in the ClassWizard.
            Our current spin range is from 0 to 54. In the OnInitDialog() function,
            change it to be 5 to 86.


    // TODO: Add extra initialization here

    m_Spin.SetRange(5, 86);


            Let's configure the Edit box  to display a certain value at startup, namely 12.
            In the CExoSpinDlg constructor, ClassWizard initialized the m_EditSpin
            variable you created as empty. Modify that initialization to look like
            this:


    //{{AFX_DATA_INIT(CExoSpinDlg)
    m_EditSpin = _T("12
    ");
    //}}AFX_DATA_INIT


        e)  Those are the minimum requirements you need to specify when you are
            creating a CSpinCtrl object.

4. Now,  you can control the incremental values of the spin button by using the CSpinButtonCtrl::SetAccel() function. The SetAccel() function takes/uses two arguments. The first is an integer that uses the clock to specify the number of seconds that will elapse before performing the incrementing (if I were you, I would not bother understanding, just look ahead at how the function is implemented). The second argument is a structure that controls the incrementing value in seconds at clock speed. This structure, called UDACCEL, needs two values, the first is a clock time in seconds that specifies the rate value (?!?) of acceleration. The second argument, which is our interest, is actually the real incrementing value of the spin button.

To implement it, or to see how it is done, we will declare a UDACCEL structure, call it AccellValue; then we will set its clock speed to 1000 and the spin button incrementing value to 5 (our example uses 5, you can use any (reasonable, of course) value you want); and finally call the CSpinButtonCtrl::SetAccel() function with our defined arguments.
Modily your OnInitDialog function as follows:

// TODO: Add extra initialization here
UDACCEL AccellValue;
AccellValue.nSec = 1000;
AccellValue.nInc = 5;
m_Spin.SetRange(6, 82);
m_Spin.SetAccel(1, &AccellValue);

//m_Spin.SetRange(6, 82);
//m_Spin.SetAccel(1, &AccellValue);
This section was modified and improved with help from 
 

Copyright © 2003-2005 FunctionX, Inc.