Pocket PC Developer Network / Articles /

Creating a new project with GapiDraw

Johan Sanneblad (johan.sanneblad@home.se), July 09, 2002.

Summary

GapiDraw makes it possible to create games that run on Stationary PCs, Smartphones as well as Pocket PCs. Because different development tools are required to target each device, some work has to be done to create an easy to manage solution for cross platform projects.

This document discusses how to create a folder hierarchy suitable for targetting multiple devices using the same code base and resources. It also shows how easy it is to create new games and applications with the new CGapiApplication base class.

What You Need

Getting Started

I will assume that GapiDraw is installed into the folder "C:\Source\GapiDraw". We will create our new project in the folder "C:\Source\MyProject".

Begin by creating the following folders using the Windows Explorer:

Adding content

Create a new text file called "myproject.cpp" in the folder "C:\Source\MyProject\Common". Add the following text to the file:

#ifndef STRICT #define STRICT #endif #include <windows.h> #include <tchar.h> #include <stdio.h> #include "GapiDraw.h" #include "GapiDrawApplication.h" #include "resource.h" class CMyApplication : public CGapiApplication { public: CMyApplication(const GDAPPCONFIG& config) : CGapiApplication(config) {}; virtual HRESULT ProcessNextFrame(CGapiSurface& backbuffer, DWORD dwFlags) { // Clear the back buffer backbuffer.FillRect(NULL, RGB(128, 128, 128), 0, NULL); // Draw some text DWORD dwXCenter = (backbuffer.GetWidth()>>1); DWORD dwYCenter = (backbuffer.GetHeight()>>1); TCHAR str1[] = TEXT("Welcome to GapiDraw!"); backbuffer.DrawText(dwXCenter, (dwYCenter-4), str1, RGB(255, 255, 255), GDDRAWTEXT_CENTER | GDDRAWTEXT_BORDER, 0, NULL); return S_OK; }; virtual HRESULT KeyDown(DWORD dwKey, GDKEYLIST& keylist) { // Exit main loop on any key press Shutdown(); return S_OK; }; virtual ~CMyApplication() {}; }; int APIENTRY WinMain(HINSTANCE hInst, HINSTANCE hPrevInst, LPTSTR pCmdLine, int nCmdShow) { GDAPPCONFIG config; ::ZeroMemory(&config, sizeof(GDAPPCONFIG)); config.hInstance = hInst; config.pAppTitle = TEXT("Welcome to GapiDraw!"); config.dwTargetFPS = 30; config.dwWindowIcon = IDI_APP; config.dwDisplayMode = GDDISPMODE_LANDSCAPE1; // Create the application CMyApplication simple(config); // Start main loop return simple.Run(); }

Let's add a windows icon as well (so the program looks nicer on Stationary computers). Right click on the icon below and choose "Save Target As...". Pick the folder "C:\Source\MyProject\Common\Res".


GapiDraw.ico

Microsoft Visual C++ 6.0

Let's begin by creating the necessary files for Visual C++ 6.0. Start Visual C++ and choose "File->New...". Choose "Win32 Application" and enter "MyProject" as name. Enter the folder "C:\Source\MyProject\WinXP" as target location. Do not use the file selector since Visual Studio will then append "MyProject" to the file path.

Creating a new Win32 Application
Creating a new Win32 Application

When you click on [OK] you get to choose the kind of Windows application you want to create. Leave the default "An empty project" selected and click [Finish]. Click on [OK].

Adding the code

Source files. In Visual Studio, switch to the "File View" which should be available in a panel to the left. Expand "MyProject files" by using the [+] next to the text label, and right click on the folder called "Source Files". Choose "Add Files to Folder...". Navigate to "C:\Source\MyProject\Common" and double click on the file "myproject.cpp".

Header files. Right click on the folder called "Header Files" and choose "Add Files to Folder...". Navigate to "C:\Source\GapiDraw\include" and select all files. Click on [OK].

Adding the resources

Begin by adding a resource script to your project. Choose the menu "File->New..." and pick "Resource Script". Enter "MyProject" as a name for the script. Leave the other settings at the default. Click on [OK].

Adding a resource script to the project
Adding a resource script to the project

Close the window that opens using "Window->Close". Right click on the folder "Resource Files" and choose "Add Files to Folder...". Navigate to "C:\Source\MyProject\WinCE" and select the file "resource.h". Click on [OK].

The procedure for adding an icon to the project is the same as adding images or other resources to your project. The main difference is that the file selector in Visual Studio does not recognize PNG, GIF and JPG images, so you have to enter "*.*" as file mask in the selector when adding that type of images.

Choose the menu "Insert->Resource", or click "CTRL+R". Click on [Import] and navigate to "C:\Source\MyProject\Common\Res". Double click on the file "gapidraw.ico". The icon should now be visible on screen. Close this window using the menu "Window->Close". Right click on "IDI_ICON1" and choose properties. You should now see something similar to the following (the language of the resource may differ).

The imported resource
The imported resource

Visual Studio assumes that all resources always are to be placed in the same folder as the project. We do not want that, so change the "File name" into "..\Common\Res\GapiDraw.ico". At the same time, change the ID of the icon into "IDI_APP". Do not bother to change the language of the resource. You should now have a dialog that looks like the following:

The resource after we have changed the file path
The resource after we have changed the file path

Close the property dialog and click "CTRL+S" to save the resource script.

Linking to GapiDraw

Now comes the tricky part. We must change many of the project settings to make the compiler know that we want to include GapiDraw with the build. Start by switching to the "File View" panel in the workspace. Select the text label "MyProject files", and choose the menu "Project->Settings...".

Common settings

Click the combo box in the top left corner and choose "Settings For - All Configurations". Choose the tab "C/C++ and pick the category "Preprocessor". Enter ".,..\Common,..\..\GapiDraw\include" in the text area called "Additional include directories". Choose the tab "Link" and add the module "gd103.lib " in front of the other modules listed in the text area "Object/library modules". Make sure that there is a space between "gd103.lib" and the next lib listed. Pick the category "Input" and enter "..\..\GapiDraw\lib\xp" into the text field called "Additional library path".

Debug settings

Click the combo box in the top left corner and choose "Settings For - Win32 Debug". Choose the tab "C/C++ and pick the category "Code Generation". In the combo box called "Use run-time library", select the "Debug Multithreaded" library.

Release settings

Click the combo box in the top left corner and choose "Settings For - Win32 Debug". Choose the tab "C/C++ and pick the category "Code Generation". In the combo box called "Use run-time library", select "Multithreaded".

Copying the DLL

To run our application we finally need the GapiDraw DLL in the same folder as our application. Compile the project using the menu "Build->Build MyProject.exe". Then copy the file "gd103.dll" from the folder "C:\Source\GapiDraw\dll\xp" to the folder "C:\Source\MyProject\WinXP\Debug".

Testing the application

Start the application using the menu "Build->Execute MyProject.exe". You should now see a screen that looks like the following:

Our project is up and running on Stationary computers.
Our project is up and running on Stationary computers.

Microsoft Embedded Visual C++ 3.0

Let's now create the project files for Embedded Visual C++. Start Embedded Visual C++ and choose "File->New...". Choose "WCE Pocket PC Application" and enter "MyProject" as name. Enter the folder "C:\Source\MyProject\WinCE" as target location. Do not use the file selector since Embedded Visual C++ will then append "MyProject" to the file path. Scroll through the "CPUs" list and make sure that every selectable check box is marked.

Creating a new Pocket PC Application
Creating a new Pocket PC Application

When you click on [OK] you get to choose the kind of Windows application you want to create. Choose "An empty project" and click [Finish]. Click on [OK].

Adding the code

Source files. In Embedded Visual C++, switch to the "File View" which should be available in a panel to the left. Expand "MyProject files" by using the [+] next to the text label, and right click on the folder called "Source Files". Choose "Add Files to Folder...". Navigate to "C:\Source\MyProject\Common" and double click on the file "myproject.cpp".

Header files. Right click on the folder called "Header Files" and choose "Add Files to Folder...". Navigate to "C:\Source\GapiDraw\include" and select all files. Click on [OK].

Adding the resources

Begin by adding a resource script to your project. Choose the menu "File->New..." and pick "Resource Script". Enter "MyProject" as a name for the script. Leave the other settings at the default. Click on [OK].

Adding a resource script to the project
Adding a resource script to the project

Close the window that opens using "Window->Close". Right click on the folder "Resource Files" and choose "Add Files to Folder...". Navigate to "C:\Source\MyProject\WinCE" and select the file "resource.h". Click on [OK].

The procedure for adding an icon to the project is the same as adding images or other resources to your project. The main difference is that the file selector in Visual Studio does not recognize PNG, GIF and JPG images, so you have to enter "*.*" as file mask in the selector when adding that type of images.

Choose the menu "Insert->Resource", or click "CTRL+R". Click on [Import] and navigate to "C:\Source\MyProject\Common\Res". Double click on the file "gapidraw.ico". The icon should now be visible on screen. Close this window using the menu "Window->Close". Right click on "IDI_ICON1" and choose properties. You should now see something similar to the following (the language of the resource may differ).

The imported resource
The imported resource

Visual Studio assumes that all resources always are to be placed in the same folder as the project. We do not want that, so change the "File name" into "..\Common\Res\GapiDraw.ico". At the same time, change the ID of the icon into "IDI_APP". Do not bother to change the language of the resource. You should now have a dialog that looks like the following:

The resource after we have changed the file path
The resource after we have changed the file path

Close the property dialog and click "CTRL+S" to save the resource script.

Linking to GapiDraw

Linking to GapiDraw is a bit more work on Windows CE since we have so many devices to target. Start by switching to the "File View" panel in the workspace. Select the text label "MyProject files", and choose the menu "Project->Settings...".

Common settings

Click the combo box in the top left corner and choose "Settings For - All Configurations". Choose the tab "C/C++ and pick the category "Preprocessor". Enter ".,..\Common,..\..\GapiDraw\include" in the text area called "Additional include directories". Choose the tab "Link" and add the module "gd103.lib " in front of the other modules listed in the text area "Object/library modules". Make sure that there is a space between "gd103.lib" and the next lib listed.

Individual assignments

The procedure for linking to each CPU platform is identical, so I will only discuss how to link GapiDraw to the ARM platform and let the reader do the rest. Click the combo box in the top left corner and choose "Settings For - Win32 (WCE ARM) Release". Choose the tab "Link". Pick the category "Input" and enter "..\..\GapiDraw\lib\arm" into the text field called "Additional library path".

Copying the DLL

To run our application we finally need the GapiDraw DLL in the same folder as our application. Copy the correct GapiDraw DLL for your device from the folder "C:\Source\GapiDraw\DLL\<platform>" to the folder "\Windows\Start Menu" on your device.

Testing the application

Enable the Windows CE target toolbar by right clicking on any toolbar and choosing "WCE Configuration". Choose your target platform from this toolbar and be sure to change "Pocket PC Emulation" into "Pocket PC (Default Device)" unless you intend to use the emulator. Use Release build unless you intend to debug your application. Enable automatic downloading using the menu "Tools->Options->Download" and select all three check boxes. Compile the project using the menu "Build->Build MyProject.exe" and it should automatically be copied to your device. You will most probably receive a warning that the target device does not match the currently selected target platform. This is due to a bug in Embedded Visual C++ and is nothing to worry about.

Start the application from the Start menu of your device. You should now see something like this:

Our project is up and running on Pocket PCs
Our project is up and running on Pocket PCs

Where to go next?

Now when the project is finished, it is time to add some content. This will be covered in future tutorials.

Related resources: