Car Inventory Using a Slider

Car Inventory

Introduction

This small application uses a dialog box on which the user can review a list of cars.

Prerequisites:

 

Creating the Application

This application was used to study or review the slider control. We simply expand it here to include other controls that can provide more information about the car that is displaying.

 

Practical Learning: Starting the Exercise

  1. Start Microsoft Visual C++ and create a new project named CarInventory1
  2. Create the project as a Dialog Based with no About Box
  3. Set the Dialog Title as Car Inventory
  4. Delete the TODO line and the OK button
  5. Change the caption of the Cancel button to Close
  6. Move the Close button to the bottom-right section of the dialog box
  7. Save the following pictures to your hard drive:
     
  8. On the main menu, click Insert -> Resource or Project -> Add Resource…

  9. On the Add Resource dialog box, click Import… and import the above pictures. If you are using MSVC 6, you may receive a message box when you import each picture, simply click OK

  10. Change the ID of the new bitmaps to IDB_CIVIC, IDB_ELANTRA, IDB_ESCAPE, IDB_ESCORT, IDB_FOCUS, IDB_MARQUIS, IDB_MYSTIQUE, IDB_NAVIGATOR, IDB_SENTRA, and IDB_SEPHIA respectively

  11. Design the dialog box as follows:
     
    Control ID Caption Additional Properties
    Group Box Group Box   Car Description  
    Static Text Static Text   Make:  
    Edit Box IDC_MAKE    
    Static Text   Model:  
    Edit Box IDC_MODEL    
    Static Text   Year:  
    Edit Box IDC_YEAR    
    Static Text   Doors:  
    Edit Box IDC_DOORS   Align Text: Right
    Picture IDC_PREVIEW   Type: Bitmap
    Image: IDB_CIVIC
    Slider IDC_SLIDER   Auto Ticks: True
    Tick Marks: True
    Point: Top/Left
    Tooltips: True
    Button IDCANCEL Close  
  12. Using either the ClassWizard or the Add Member Variable Wizard, add the following member variables to the controls:
     
    Identifier Value Variable Control Variable
    IDC_MAKE CString m_Make  
    IDC_MODEL CString m_Model  
    IDC_YEAR CString m_Year  
    IDC_DOORS CString m_Doors  
    IDC_PREVIEW   m_Picture
    IDC_SLIDER   m_CarSlider
  13. To store the values for the controls on the dialog box, in the header file of the dialog box, create a structure named LisOfCars and declare a private array for it in the dialog’s class as follows:
     
    // CarInventory1Dlg.h : header file
    //
    
    #pragma once
    // A class for each car
    struct CListOfCars
    {
    	CString Make;
    	CString Model;
    	UINT CarYear;
    	UINT Doors;
    	UINT CarPicture;
    };
    // CCarInventory1Dlg dialog
    class CCarInventory1Dlg : public CDialog
    {
    // Construction
    public:
    	CCarInventory1Dlg(CWnd* pParent = NULL); // standard constructor
    
    	// Dialog Data
    	enum { IDD = IDD_CARINVENTORY1_DIALOG };
    
    . . .
    
    private:
    	CListOfCars Car[10];
    };
  14. To initialize the array and the slider, type the following in the constructor and the OnInitDialog event:
     
    CCarInventory1Dlg::CCarInventory1Dlg(CWnd* pParent /*=NULL*/)
    	: CDialog(CCarInventory1Dlg::IDD, pParent)
    	, m_Make(_T("Honda"))
    	, m_Model(_T("Civic"))
    	, m_Year(_T("1998"))
    	, m_Doors(_T("4"))
    {
    	m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
    }
    
    . . .
    
    BOOL CCarInventory1Dlg::OnInitDialog()
    {
    	CDialog::OnInitDialog();
    
    	// Set the icon for this dialog. The framework does this automatically
    	// when the application's main window is not a dialog
    	SetIcon(m_hIcon, TRUE); // Set big icon
    	SetIcon(m_hIcon, FALSE); // Set small icon
    
    	// TODO: Add extra initialization here
    	Car[0].Make = "Honda";
    	Car[0].Model = "Civic";
    	Car[0].CarYear = 1998;
    	Car[0].Doors = 4;
    	Car[0].CarPicture = IDB_CIVIC;
    
    	Car[1].Make = "Hyundai";
    	Car[1].Model = "Elantra";
    	Car[1].CarYear = 1996;
    	Car[1].Doors = 4;
    	Car[1].CarPicture = IDB_ELANTRA;
    
    	Car[2].Make = "Ford";
    	Car[2].Model = "Escape";
    	Car[2].CarYear = 2003;
    	Car[2].Doors = 5;
    	Car[2].CarPicture = IDB_ESCAPE;
    
    	Car[3].Make = "Ford";
    	Car[3].Model = "Escort";
    	Car[3].CarYear = 1997;
    	Car[3].Doors = 2;
    	Car[3].CarPicture = IDB_ESCORT;
    
    	Car[4].Make = "Mercury";
    	Car[4].Model = "Grand Marquis";
    	Car[4].CarYear = 2001;
    	Car[4].Doors = 4;
    	Car[4].CarPicture = IDB_MARQUIS;
    
    	Car[5].Make = "Mercury";
    	Car[5].Model = "Mystique";
    	Car[5].CarYear = 2000;
    	Car[5].Doors = 4;
    	Car[5].CarPicture = IDB_MYSTIQUE;
    
    	Car[6].Make = "Lincoln";
    	Car[6].Model = "Navigator";
    	Car[6].CarYear = 2003;
    	Car[6].Doors = 5;
    	Car[6].CarPicture = IDB_NAVIGATOR;
    
    	Car[7].Make = "Nissan";
    	Car[7].Model = "Sentra";
    	Car[7].CarYear = 1997;
    	Car[7].Doors = 2;
    	Car[7].CarPicture = IDB_SENTRA;
    
    	Car[8].Make = "Ford";
    	Car[8].Model = "Focus";
    	Car[8].CarYear = 2002;
    	Car[8].Doors = 4;
    	Car[8].CarPicture = IDB_FOCUS;
    
    	Car[9].Make = "Kia";
    	Car[9].Model = "Sephia";
    	Car[9].CarYear = 2003;
    	Car[9].Doors = 4;
    	Car[9].CarPicture = IDB_SEPHIA;
    	
    	m_CarSlider.SetRange(1, 10);
    	m_CarSlider.SetTicFreq(1);
    
    	return TRUE; // return TRUE unless you set the focus to a control
    }
  15. To display the picture of the car selected, we will use the OnPaint() event of the dialog box. That way, the picture will be updated whenever necessary.
    In the OnPaint() event of the dialog box, type the following:
     
    void CCarInventory1Dlg::OnPaint() 
    {
    	int CurPos = m_CarSlider.GetPos() - 1;
    	CBitmap Bmp;
    
    	Bmp.LoadBitmap(Car[CurPos].CarPicture);
    
    	m_Picture.SetBitmap(Bmp);
    	UpdateData(FALSE);
    
    	if (IsIconic())
    	{
    		. . .
    	}
    }
  16. When the user slides the track bar, we will update the values of the selected car and we will call the OnPaint() event of the dialog box to change the picture of the car.
    Using either the ClassWizard (MSVC 6) or the Messages button, for the dialog, generate the WM_HSCROLL message and implement it as follows:
     
    void CSlider1Dlg::OnHScroll(UINT nSBCode, UINT nPos, CScrollBar* pScrollBar) 
    {
    	// TODO: Add your message handler code here and/or call default
    	int CurPos = m_CarSlider.GetPos() - 1;
    
    	m_Make.Format("%s", Car[CurPos].Make);
    	m_Model.Format("%s", Car[CurPos].Model);
    	m_Year.Format("%d", Car[CurPos].CarYear);
    	m_Doors.Format("%d", Car[CurPos].Doors);
    
    	CRect Recto;
    
    	m_Picture.GetWindowRect(&Recto);
    	InvalidateRect(&Recto);
    
    	CDialog::OnHScroll(nSBCode, nPos, pScrollBar);
    }
  17. Test the application
  18. Close it and return to MSVC
 
 
 

Home Copyright © 2004-2005 FunctionX, Inc.