Step by Step: New Native Windows Mobile Development Features in Visual Studio 2005

 

Microsoft Corporation

June 2006

Applies to:
   Microsoft ActiveX
   Microsoft eMbedded Visual C++
   Microsoft IntelliSense
   Microsoft Visual Studio 2005
   Windows Mobile–based devices

Summary: Get a guided tour through the Microsoft Visual Studio 2005 native device development experience. This HOL will take 40 minutes to complete. (26 printed pages)

Download MEDC06_HOL304.msi from the Microsoft Download Center.

Contents

Introduction
Lab 1: ActiveX Control Creation and Hosting
Summary
Appendix A: Terminating an Application That Is Running on a Device or Emulator
Appendix B: Setting Up Your Computer

The following applications are required to run this HOL:

Introduction

In this self-paced, hands-on lab (HOL), you'll build a Windows Mobile–based C++ application by using application and class wizards, and you will design the UI, digitally sign the application, and debug it—all from within Visual Studio. Upon completion of this HOL, you will be ready to start using Visual Studio 2005 as your new integrated development environment (IDE) for native Windows Mobile application development.

Lab 1: ActiveX Control Creation and Hosting

Many of the typical questions should be covered in What's New in Visual Studio 2005 for Native Developers and Migrating Microsoft eMbedded Visual C++ Projects to Visual Studio 2005.

If you press CTRL+SPACEBAR to get IntelliSense technology to complete a line, the IDE may freeze. If this occurs, understand that it's a known bug, and do not press CTRL+SPACEBAR.

Lab Objective

The objective of this lab is to use Visual Studio 2005 to create an ATL ActiveX control for Pocket PC and an MFC host device application for the ActiveX control. The ActiveX control will be a triangle that has a fill color that changes when you click the control. The hosting application will be a dialog box–based application that hosts the ActiveX control. The control and the hosting applications will also be signed with a test certificate.

In this HOL, you will perform the following exercises:

  • Creating the ATL ActiveX control
  • Creating the MFC ActiveX hosting application

Exercise 1: Creating the ATL ActiveX Control

In this exercise, you will use Visual Studio 2005 to create an ATL ActiveX control for Pocket PC.

To complete the ATL Smart Device Project Wizard

  1. In Visual Studio 2005, click File | New | Project.

  2. Expand Other Languages | Visual C++, and then select Smart Device.

  3. Select ATL Smart Device Project, and then type Ctl1 in the Name box.

  4. Type C:\Program Files\Windows Mobile Developer Samples\HOLs\MED304_New_Native_WM_Features_VS2005\Exercises in the Location box, as shown in Figure 1.

    Figure 1. Creating a new ATL Smart Device project. Click the thumbnail for a larger image.

  5. Click OK.

  6. On the left side of the ATL Smart Device Project Wizard dialog box, click Platforms.

  7. Under Selected SDKs, be sure that Windows Mobile 5.0 Pocket PC SDK and Pocket PC 2003 are listed, as shown in Figure 2. If they are not, select them in the Installed SDKs section, and then click Add selected platform SDK to project button.

    Figure 2. Selecting platforms for the ATL Smart Device project. Click the thumbnail for a larger image.

  8. On the left side of the ATL Smart Device Project Wizard dialog box, click Application Settings.

  9. Under Server type, be sure that Dynamic-link library (DLL) is selected, and be sure that no checkboxes are selected under Additional options, as shown in Figure 3.

    Figure 3. Selecting application settings for the ATL Smart Device project. Click the thumbnail for a larger image.

  10. Click Finish.

To create the ActiveX class

  1. In Solution Explorer, right-click the Ctrl1 project, and then click Add | Class.

  2. Expand Visual C++, and then select SmartDevice.

  3. Under Visual Studio installed templates, select ATL Control, and then click Add, as shown in Figure 4.

    Figure 4. Adding a class to the ATL Smart Device project

  4. On the Welcome to the ATL Control Wizard page, click Names on the left side of the page.

  5. In the Short name box, type MyCtl, as shown in Figure 5.

    Figure 5. Naming the class with the ATL Control Wizard. Click the thumbnail for a larger image.

  6. On the Welcome to the ATL Control Wizard page, click Stock Properties on the left side of the page.

  7. In the Not supported list, select Fill Color.

  8. Click the Add selected property to the supported list button to add it to the Supported list, as shown in Figure 6.

    Figure 6. Adding FillColor support to the class with the ATL Control Wizard. Click the thumbnail for a larger image.

    Note Do not change any other options.

  9. Click Finish.

To add a property to the ActiveX class

  1. In Solution Explorer, click the Class View tab, and then expand Ctl1.

  2. Right-click IMyCtl, click Add | Add Property. The Add Property Wizard dialog box opens.

  3. In the Property type box, select SHORT.

  4. In the Property Name box, type Sides, as shown in Figure 7.

    Figure 7. Adding the Sides property to the class with the Add Property Wizard. Click the thumbnail for a larger image.

  5. Click Finish.

To add code to the ActiveX class

  1. In Solution Explorer, expand Ctl1 | Header Files, and then double-click MyCtl.h.

  2. Find the following code at the end of the IMyCtl interface.

    public:
    STDMETHOD(get_Sides)(SHORT* pVal);
    public:
    STDMETHOD(put_Sides)(SHORT newVal);
    
  3. Add the following code after the code in Step 2. These members are used for drawing the sides of the control.

    private:
    short m_nSides;
    POINT m_arrPoint[100];
    int m_currentColor;
    
  4. Add the following code to the CMyCtl() constructor body. This code initializes the control with three sides and a fill color. m_currentColor is used to track the current color, so the control can switch to a different color when it's clicked.

    m_nSides = 3;
    m_clrFillColor = RGB(0, 0xFF, 0);
    m_currentColor = 2;
    
  5. Delete the body of the OnDraw(ATL_DRAWINFO& di) method, including the opening and closing braces.

  6. Add a semicolon to the end of the method declaration (because you will be implementing your own OnDraw method). The OnDraw method should look like the following code example.

    HRESULT OnDraw(ATL_DRAWINFO& di);
    
  7. Insert the following message handler inside and at the beginning of the message map section, BEGIN_MSG_MAP(CMyCtl). This code allows the ActiveX control to handle its own user clicks and react accordingly.

    MESSAGE_HANDLER(WM_LBUTTONDOWN, OnLbuttonDown);
    
  8. Verify that the complete message map section for the CMyCtl class looks like the following code example.

    BEGIN_MSG_MAP(CMyCtl)
        MESSAGE_HANDLER(WM_LBUTTONDOWN, OnLbuttonDown);
        CHAIN_MSG_MAP(CComControl<CMyCtl>)
        DEFAULT_REFLECTION_HANDLER()
    END_MSG_MAP()
    
  9. Add the following handler prototype below the MessageMap section.

    LRESULT OnLbuttonDown(UINT, WPARAM, LPARAM, BOOL&)
    {
        switch(m_currentColor)
        {
        case 1:
            m_currentColor = 2;
            m_clrFillColor = RGB(0, 0xFF, 0);
            break;
        case 2:
            m_currentColor = 1;
            m_clrFillColor = RGB(0xFF, 0xFF, 0);
            break;
        }
    
        put_FillColor(m_clrFillColor);
        return 0;
    }
    
  10. In Solution Explorer, under Ctl1 | Source Files, double-click MyCtl.cpp.

    In the following steps, you will copy and paste code from a text file into MyCtl.cpp to save time.

  11. In Visual Studio, click File | Open | File.

  12. Browse to C:\Program Files\Windows Mobile Developer Samples\HOLs\MEDC06_HOL304\Setup Files.

  13. Select the code.txt file, and then click Open.

  14. In the Visual Studio text editor, select all of the text by pressing CTRL+A, and then copy it to the Clipboard by pressing CTRL+C.

  15. Click File | Close to close the text file.

  16. Paste the clipboard contents into MyCtl.cpp by pressing CTRL+V. A good place to paste this code would be immediately following the // CMyCtl comment line. The code that you have just pasted into MyCtl.cpp, which is shown here, draws the ActiveX control.

    #define GSC_MASK 0x80000000L
    #define GSC_SETBIT 0x04000000L
    
    inline HRESULT wce_OleTranslateColor(OLE_COLOR clr, HPALETTE, COLORREF *retClr)
    {
        *retClr = (clr & GSC_MASK) ? GetSysColor(clr & (~GSC_MASK) | GSC_SETBIT) : (COLORREF)(clr & 0x00FFFFFF);
        return S_OK;
    }
    
    HRESULT CMyCtl::OnDraw(ATL_DRAWINFO& di)
    {
        RECT& rc = *(RECT*)di.prcBounds;
        HDC hdc  = di.hdcDraw;
    
        COLORREF  colFore;
        HBRUSH    hOldBrush, hBrush;
        HPEN    hOldPen, hPen;
    
        // Translate m_colFore into a COLORREF type
        wce_OleTranslateColor(m_clrFillColor, NULL, &colFore);
        // Create and select the colors to draw the circle
        hPen = (HPEN)GetStockObject(BLACK_PEN);
        hOldPen = (HPEN)SelectObject(hdc, hPen);
    
        const double pi = 3.14159265358979;
        POINT    ptCenter;
        double  dblRadiusx = (rc.right - rc.left) / 2;
        double  dblRadiusy = (rc.bottom - rc.top) / 2;
        double  dblAngle = 3 * pi / 2;      // Start at the top
        double  dblDiff  = 2 * pi / m_nSides;  // Angle each side will   // make
        ptCenter.x = (rc.left + rc.right) / 2;
        ptCenter.y = (rc.top + rc.bottom) / 2;
    
        // Calculate the points for each side
        for (int i = 0; i < m_nSides; i++)
        {
            m_arrPoint[i].x = (long)(dblRadiusx * cos(dblAngle) + ptCenter.x + 0.5);
            m_arrPoint[i].y = (long)(dblRadiusy * sin(dblAngle) + ptCenter.y + 0.5);
            dblAngle += dblDiff;
        }
    
        // Create and select the brush that will be used to fill the     // polygon
        hBrush    = CreateSolidBrush(colFore);
        hOldBrush = (HBRUSH)SelectObject(hdc, hBrush);
        SelectObject(hdc, hBrush);
        Polygon(hdc, &m_arrPoint[0], m_nSides);
    
        // Select back the old pen and brush and delete the brush you     // created
        SelectObject(hdc, hOldPen);
        SelectObject(hdc, hOldBrush);
        DeleteObject(hBrush);
    
        return S_OK;
    }
    
  17. Find the following Property get function.

    STDMETHODIMP CMyCtl::get_Sides(SHORT* pVal)
    
  18. Add the following code to the function body (before the return S_OK).

    *pVal = m_nSides;
    
  19. Find the following Property put function.

    STDMETHODIMP CMyCtl::put_Sides(SHORT newVal)
    
  20. Add the following code to the function body (before the return S_OK).

    ATLASSERT(newVal > 2 && newVal < 101);
    m_nSides = newVal;
    FireViewChange();
    
  21. In Solution Explorer, under Ctl1 | Header Files, double-click stdafx.h.

  22. Near the top of stdafx.h, under #pragma once, add the following code. This code prevents the #error that ATL 8.0 for devices throws at compile time when compiling projects with a threading model for non-DCOM platforms.

    #define _CE_ALLOW_SINGLE_THREADED_OBJECTS_IN_MTA
    
  23. Click Build | Build Solution to build the project. Ensure there are no compile or link errors.

To sign the ActiveX project

  1. In Solution Explorer, right-click the Ctl1 project, and then click Properties.

  2. Under Configuration Properties, expand Authenticode Signing, and then select General.

  3. Change the Authenticode Signature property value to Yes.

  4. In the Certificate list, click the Ellipsis button, as shown in Figure 8:

    Figure 8. Ellipsis button

  5. In the Select Certificate dialog box, click Manage Certificates.

  6. In the Manage Certificates dialog box, click Import. The Certificate Import Wizard opens.

  7. Click Next.

  8. On the File To Import page, click Browse.

  9. Browse to C:\Program Files\Microsoft Visual Studio 8\SmartDevices\SDK\SDKTools\TestCertificates.

  10. In the Files of Type combo box, change the file type to Personal Information Exchange (*.pfx,*.p12), as shown in Figure 9.

    Figure 9. Importing test certificate. Click the thumbnail for a larger image.

  11. Select TestCert_Privileged.

  12. Click Open.

  13. On the File to Import page, click Next.

  14. Leave the password blank, and then click Next.

  15. Be sure that the Place all certificates in the following store option is selected, and be sure that the Certificate Store property is set to Personal.

  16. Click Next.

  17. Click Finish.

  18. When the Import was successful dialog box appears, click OK.

  19. Close the Managed Certificates dialog box.

  20. In the Select Certificate dialog box, you should now see the Smartphone 2003 Privileged Test certificate. Select it, and then click OK. Every time the project is built, it is signed with this certificate.

  21. On the Ctl1 Property Pages dialog box, in the Provision Device list, select Privileged Certificate Store, as shown in Figure 10.

    Figure 10. Provisioning a certificate to a device's Privileged Certificate Store

  22. Click OK.

    Every time the project is deployed, the selected certificate is provisioned to the device's Privileged Certificate Store.

To deploy and register the ActiveX control

  • In Solution Explorer, right-click the Ctl1 project, and then select Deploy. The device emulator opens, and Visual Studio both deploys and registers the ActiveX control.

Exercise 2: Creating the MFC ActiveX Hosting Application

In this exercise, you will use Visual Studio 2005 to create an MFC application for Pocket PC that hosts the ActiveX control that you created in Exercise 1 of this HOL.

To complete the MFC Smart Device Project Wizard

  1. In the solution that contains the Ctl1 project, right-click Ctl1, and then click Add | New Project.

  2. Expand Other Languages | Visual C++, and then select Smart Device.

  3. Select MFC Smart Device Application, and then type MyHostApp in the Name box, as shown in Figure 11.

    Figure 11. Adding a new MFC Smart Device Application. Click the thumbnail for a larger image.

  4. Click OK. The MFC Smart Device Application wizard opens.

  5. On the left side of the MFC Smart Device Application Wizard dialog box, click Platforms.

  6. Under Selected SDKs, be sure that Pocket PC 2003 and Windows Mobile 5.0 Pocket PC SDK are listed. If they are not, select them in the Installed SDKs section, and then click the Add selected platform SDK to project button, as shown in Figure 12.

    Figure 12. Selecting platforms for the MFC Smart Device application. Click the thumbnail for a larger image.

  7. On the left side of the MFC Smart Device Application Wizard dialog box, click Application Type.

  8. Change Application Type to Dialog based, as shown in Figure 13.

    Figure 13. Selecting a dialog-based MFC Smart Device application. Click the thumbnail for a larger image.

  9. On the left side of the MFC Smart Device Application Wizard dialog box, click Advanced Features.

  10. Select ActiveX controls, as shown in Figure 14.

    Figure 14. Selecting the ActiveX controls advanced features for the MFC Smart Device application. Click the thumbnail for a larger image.

  11. Click Finish.

To add the ActiveX control to the dialog box

  1. In Solution Explorer, under Ctl1 | Resource Files, double-click MyCtl.rgs.

  2. Select the MyCtl Class CLSID and press CTRL+C (be sure that the braces are selected), as shown in Figure 15.

    Note The GUID that you will have in your project is different from the one shown in the figure.

    Figure 15. Copying the ActiveX control CLSID to the Clipboard

  3. In Solution Explorer, under MyHostApp | Resource Files, double-click MyHostAppppc.rc.

  4. In the Resource View pane, expand MyHostApp | MyHostAppppc.rc | Dialog.

  5. Double-click IDD_MYHOSTAPP_DIALOG.

  6. In the dialog editor, select the default static text control, as shown in Figure 16, and then press Delete.

    Figure 16. Deleting the default static text control

  7. From the Toolbox, drag the Custom Control to the upper-left corner of the dialog.

  8. Click in the bottom-right corner of the custom control, and then resize it to occupy the entire area of the dialog box, as shown in Figure 17.

    Figure 17. Placing a Custom Control in the MyHostApp dialog. Click the thumbnail for a larger image.

  9. Right-click the Custom Control, and then select Properties.

  10. In the Properties dialog box, click the Class property box, and then press CTRL+V.

    The ActiveX control MyCtl Class CLSID is pasted in from the Clipboard.

  11. In Solution Explorer, under MyHostApp | Resource Files, right-click MyHostAppppc.rc2, and then select View Code.

  12. In the Add Manually Edited Resources Here section, paste the following code. The Custom Control requires a Dialog Init section to display correctly. The contents of the actual Dialog Init section are not used.

    IDD_MYHOSTAPP_DIALOG DLGINIT
    BEGIN
        IDC_CUSTOM1, 0x376, 22, 0
    0x0000, 0x0000, 0x0800, 0x0000, 0x094d, 0x0000, 0x043d, 0x0000, 0x0013, 
    0xcdcd, 0xcdcd, 
        0
    END 
    

To sign the ActiveX project

  1. In Solution Explorer, right-click the MyHostApp project, and then select Properties.

  2. Under Configuration Properties, expand Authenticode Signing, and then select General.

  3. Change the Authenticode Signature property value to Yes.

  4. Click Certificate, and then click the Ellipsis button, as shown in Figure 18:

    Figure 18. Ellipsis button

  5. In the Select Certificate dialog box, select the Smartphone 2003 Privileged Test certificate, and then click OK.

    Every time the project is built, it is signed with this certificate.

  6. Select Provision Device, and then click Privileged Certificate Store, as shown in Figure 19.

    Figure 19. Provisioning certificate to device's Privileged Certificate Store. Click the thumbnail for a larger image.

  7. Click OK.

    Every time the project is deployed, the selected certificate is provisioned to the device's Privileged Certificate Store.

To deploy the solution

  1. In Solution Explorer, right-click the MyHostApp project, and then click Set As Startup Project.
  2. Press F5.
  3. After the dialog box appears, click the control and note the color change.
  4. When you are satisfied that the application is functioning properly, click OK to close the application.

Summary

In this lab, you performed the following exercises:

  • Creating the ATL ActiveX control
  • Creating the MFC ActiveX hosting application

In this lab, you created an ATL ActiveX control by using the Visual Studio 2005 application and class wizards. You also created an MFC dialog box–based application to host the control, and you used the Resource Editor and the Custom Control to provide a design-time experience for the ActiveX hosting. You also signed the two projects with a test certificate, which was also provisioned to the device, allowing your application (and control) to run in Privileged mode on Windows Mobile–based devices that have a security model.

Appendix A: Terminating an Application That Is Running on a Device or Emulator

This appendix describes how to terminate an application that is running on a device or emulator. This is useful for cases where an application has been started without having the debugger attached and the application needs to be terminated so a new copy of the application can be deployed. You will terminate the application by using the Remote Process Viewer remote tool in Visual Studio.

Before you can terminate a process, you need to know the name of the executable file. In most cases, this is the same name as the Visual Studio project. If you are uncertain about the name of the executable file, you can find it in the project's properties.

To terminate an application that is running on a device or emulator by using the Remote Process Viewer remote tool

  1. In Visual Studio, click Project | xxx Properties, where xxx represents the name of the current project.

  2. In the Project Properties dialog box, note the value in the Assembly Name field. This is the name that the executable file will be running on the device or emulator.

  3. Close the Properties dialog box.

    Now, you can terminate the process.

  4. On the desktop computer, click Start | Microsoft Visual Studio 2005 | Visual Studio Remote Tools | Remote Process Viewer.

  5. When prompted by the Select a Windows CE Device dialog box, select the emulator or device where the application is running, as shown in Figure 20, and then click OK.

    Figure 20. Select a Windows CE Device dialog box

  6. After the connection to the emulator or device completes, select the application that you want to terminate in the top pane of the Remote Process Viewer, as shown in Figure 21.

    Figure 21. Selecting the application to terminate. Click the thumbnail for a larger image.

    You may need to widen the Process column (the leftmost column) to fully view the process names.

  7. In Windows CE Remote Process Viewer, click File | Terminate Process to terminate the process.

    Note Be certain that the correct process is selected before you click Terminate Process. Terminating the incorrect process may render the device or emulator unusable, requiring it to be reset before you can use it again.

  8. Verify that the process is terminated by selecting Target | Refresh. Scroll to the top pane of Windows CE Remote Process Viewer again. If the application name still appears, the process was not terminated, and you need to repeat these steps.

    Note Most processes terminate in one try; however, depending on the state of the application, terminating a process occasionally takes two attempts.

Appendix B: Setting Up Your Computer

The following lab files are required to set up your computer to run this HOL:

  • Pre-existing Visual Studio 2005 project, code, and data files.

To install these files to the correct path, download and run the following installation program: MEDC06_HOL304.msi.

Note If you used an emulator in a previous HOL, you should do a hard reset on the emulator before starting this HOL. (On the emulator, click File | Reset | Hard.)

Note If you receive an error during deployment that indicates that the process or file is in use, this means that the program is still running on the emulator and must be closed before a new copy can be deployed and run. This error may appear anytime in the lab that you deploy the emulator. See Appendix A in this HOL for instructions about exiting a running application.