Home

MFC ActiveX Controls - UpDown
 
 

Overview

Besides the spin button, Visual C++ ships with an ActiveX control that provides the same functionality. To use this object, you can right-click the form or dialog box and click Insert ActiveX Control. Then, on the Insert ActiveX Control dialog box, click Microsoft UpDown Control. If there are two versions provided, you should select the latest, which usually has a higher version number.

The Microsoft UpDown control is simply a spin button but with true visual accessibility and rapid application development (RAD) concept. Like the spin button, it is equipped with two buttons. Each button has a small picture (a bitmap) that displays an arrow.

The application we are about to develop is for a CD publishing small business. This company manufactures compact discs for self-promoting musicians and small business that want to sell their own CDs. When taking an order of a new CD, the company charges:

  • $20/CD if the customer is ordering less than 20 units

  • $15/CD if the customer is ordering up to 50 units

  • $12/CD if the customer is ordering up to 100 units

  • $8/CD if the customer is ordering up to 500 units

  • $5/CD for any order over 500 units

 

  1. You can start by creating a new Dialog-based application named CDPublisher

  2. Set its title to Compact Disc Publisher

  3. You can also delete the TODO line and the OK button

  4. Change the Caption of the Cancel button to Close. Add a Picture control to the dialog box

  5. Set its Color property to Etched and check its Modal Frame check box or set it to True.

  6. Without adding the updown control, design the dialog box as on the above picture. The names of the edit boxes from left to right are IDC_EDIT_QTY, IDC_UNITPRICE, and IDC_TOTALPRICE

  7. Add a CString variable for the IDC_EDIT_QTY control and name it m_EditQuantity

  8. Add a CString variable for the IDC_ UNITPRICE control and name it m_UnitPrice

  9. Add a CString variable for the IDC_ TOTALPRICE control and name it m_TotalPrice

  10. Access the source code of the CCDPublisherDlg class and, in its constructor, initialize the edit boxes to 1 or $20.00
     

    CCDPublisherDlg::CCDPublisherDlg(CWnd* pParent /*=NULL*/)
	: CDialog(CCDPublisherDlg::IDD, pParent)
{
	//{{AFX_DATA_INIT(CCDPublisherDlg)
	m_EditQuantity = _T("1");
	m_UnitPrice = _T("$20.00");
	m_TotalPrice = _T("$20.00");
	//}}AFX_DATA_INIT
	// Note that LoadIcon does not require a subsequent DestroyIcon in Win32
	m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
}

  11. Save All

Using an UpDown Control

To provide an updown control to your application, display the Insert ActiveX Control dialo box, select Microsoft UpDown Control 6.0 and click OK. If you plan to refer to the control in your code, you can add a variable for it. When you do this, Visual C++ would create and even implement its class, giving all of its code (its header and source files). You can then find out that the updown control is based on the CUpDown class which itself is based on CWnd, making it convinient to use CWnd properties and methods.

Like the spin button, the updown control cannot display its value to the user. If you want an accompanying control to play that role, you should place the new updown control next to a text-based control such as an edit box. You have the option of positioning the updown control to the left or the right side of its buddy control.

After placing the updown control on the parent window, by default, its arrow buttons point up and down. If you want the arrows to point left and right, change the value of the Orientation property. 

To make the updown control easier to configure, you can set its range value visually. The minimum value is set using the Min edit box the maximum value is set on the Max edit box. To programmatically change the minimum value, call the SetMin() method. In the same way, the maximum value can be changed by calling the SetMax() method. Here is an example: 

void CDlgSpin::OnConfigureUpDown() 
{
	// TODO: Add your control notification handler code here
	m_UpDown.SetMin(12);
	m_UpDown.SetMax(250);
}

To get the minimum value of an updown control, call the GetMin() method. To get the maximum value of an updown control, call the GetMax() method.

After setting the minimum and the maximum values, you can specify the initial value the updown control would hold when the application comes up. This value is set using the Value edit box and it must be in the range (Min, Max). To change the value with code, call the SetValue() method and pass it the desired but valid value. Here is an example: 

void CDlgSpin:: OnConfigureUpDown() 
{
	// TODO: Add your control notification handler code here
	m_UpDown.SetMin(12);
	m_UpDown.SetMax(250);

	m_UpDown.SetValue(88);
}

To get the value of an updown control, call its GetValue() method.

When using the updown control by clicking one of its buttons buttons, its value increases or decreases by one. If you want a different incremental value, specify it using the Increment edit box.


To programmatically set an incremental value, call the SetIncrement() method. Here is an example: 

void CDlgSpin:: OnConfigureUpDown() 
{
	// TODO: Add your control notification handler code here
	m_UpDown.SetMin(12);
	m_UpDown.SetMax(250);

	m_UpDown.SetValue(88);

	m_UpDown.SetIncrement(5);
}

  1. To know what increment value an updown control is using, call its GetIncrement() method.

  2. Right-click in the middle of the dialog box and click Insert ActiveX Control and click OK

  3. Position the new control to the right side of the Number of CDs edit box and resize it:
     

  4. Using the Properties window, change its ID to IDC_QUANTITY

  5. Set the values of the Min edit box 1 and the Max edit box to 5000

  6. Add a variable to the updown control. You may receive a message box informing you that the control needs to be inserted into your project. Click OK. Click OK again 

  7. Set the name of the variable to m_Quantity

  8. Click OK twice

  9. In Class View, expand CUpDown and double-click it to display its source code

 

 

The UpDown Control Events

The updown control makes an object distinction between its button components. For example, when the user clicks the up pointing arrow button, the control fires the UpClick() event. On the other hand, when the user clicks the down pointing arrow button, the control sends a DownClick() event. These allow you to treat each event separately if you want.

If you are more interested in the value of the updown control, when the users clicks either of its button, the value of the control changes. Once the value of the control has been modified, it fires a Change() event.

The updown control provides bonus events related to the mouse. When the mouse arrives to passes over this control, the MouseMove() event is fired. If the user presses a mouse button on the control. It fires the MouseDown() event. When the user releases the mouse button, the MouseUp() event is fired.

  1. If you are using MSVC 6, display the ClassWizard and the Message Maps property page. Click the IDC_QUANTITY. In the Messages section, double-click Change, click OK and click Edit Code
    If you are using MSVC 7, display the dialog box and click the updown control. On the Property window, click the Control Events button . Click the arrow of the Change combo box and select the only item in the list

  2. Implement the event as follows:
     

    void CCDPublisherDlg::OnChangeQuantity() 
{
	// TODO: Add your control notification handler code here
	int Quantity;
	double UnitPrice, TotalPrice;

	Quantity = m_Quantity.GetValue();

	if( Quantity < 20 )
		UnitPrice = 20;
	else if( Quantity < 50 )
		UnitPrice = 15;
	else if( Quantity < 100 )
		UnitPrice = 12;
	else if( Quantity < 500 )
		UnitPrice = 8;
	else
		UnitPrice = 5;

	TotalPrice = Quantity * UnitPrice;

	m_EditQuantity.Format("%d", Quantity);
	m_UnitPrice.Format("$%.2f", UnitPrice);
	m_TotalPrice.Format("$%.2f", TotalPrice);

	UpdateData(FALSE);
}

  3. Test the application

  4. Close it and return to MSVC

 
 
Copyright © 2003-2005 FunctionX, Inc.