Developing with an Enhanced PictureBox

  • Article

 

Are you a Microsoft eMbedded Visual Basic developer who needs to have a control to handle picture formats other than the standard Microsoft Windows bitmap format? This article shows the major features of the S309PictureBox control as well as some code samples.

What You Need

Languages Supported

English

Intrinsic PictureBox Control

As you may be aware, the intrinsic PictureBox control has a few limitations. First, and maybe most importantly, it lacks the ability to show any other picture format than the standard Windows bitmap format. One of the disadvantages of using bitmap format images is that the files become large. Another is that there are simply no files stored in bitmap format anymore, so the pictures have to be converted before they can be used.

The most common picture format today, due to the Web, is JPEG (Joint Photographic Experts Group) and GIF (Graphics Interchange Format). What if we had a control that could handle those formats? Well, that is partly the purpose of this article; to show you the use of such a control—the S309PictureBox control.

S309PictureBox Control

In summary, this is what the S309PictureBox Control (version 2.7) can do:

  • Display bitmap (bmp and 2bp), GIF, JPEG, and XBM image files.
  • Display bitmap resources from resource files, including common bitmaps such as FileOpen and FileClose.
  • Capture and display an image of the physical screen.
  • Save an image as a bitmap file.
  • Display and animate playing cards like the ones used in the Solitaire game provided with Windows CE.
  • Clip, invert colors, mirror, resize, and rotate an image.
  • Display any image with a transparent color.
  • Provide access to individual pixels in the image.
  • Specify colors using RGB or QBColor notation.
  • Overlay one image on top of another.
  • Draw lines, rectangles, circles, polygons, and round rectangles.
  • Change the color depth of an image.
  • Refresh the desktop wallpaper.
  • Better support for drawing.
  • Better support for 64-K color displays.
  • Support drawing text.
  • Support command button emulation.
  • Support label emulation.
  • Use scroll bars.
  • Display icon resources from executable files, resource files, and icon (*.ico) files.
  • Support for tap and hold event.

What Can S309PictureBox Do?

Before we look at the code, let's begin with exploring what the S309PictureBox control allows us to do. In the following form I have ported one of the example projects provided with the control to a Microsoft eMbedded Visual Basic (eVB) application.

S309PictureBox demo.

As you can see above, I have loaded a picture (GIF) from the first page of PocketPC.com, captured the screen, and then mirrored it horizontally (see figure).

With this client you can:

  • Open any picture file with the extensions supported by the control (*.2bp, *.bmp, *.gif, *.jpg, *.jpeg, *.jpe, *.xbm).
  • Save the picture in bitmap (.bmp) format.
  • Use predefined button images as buttons.
  • Mirror picture (horizontally and/or vertically).
  • Rotate picture.
  • Align picture (stretch, center, etc.).
  • Get information about a picture (size, color depth).
  • See picture in full screen.
  • Invert colors in picture.
  • Add scroll bars to picture.
  • Capture the screen!

As you can see this application is very capable. Considering that it is only about 300 lines of code, this demo can really be used for doing things. Actually, the screen shot for this article was made by the demo application. With a little effort you would actually be able to write your own screen capture application, sell it, and get rich—just go for it!

Code Walkthrough

Let us start with the most interesting feature that we have seen, the screen capture, and determine how much code is needed for that. Well, here is the code:

picBox.CaptureScreen

It is really too easy! But the fact is that the only screen capture we can do at the moment is of the demo application running. And you might get tired of getting the same screen shots all the time. You will have to implement a way to activate this screen capture application from any other application and a hint is that the hardware buttons can be assigned to do just that.

If you are observant, you may notice another interesting feature; the ability to use some of the button images that are built into the Pocket PC. These images are stored in the Pocket PC ROM (read-only memory) and you can use them to provide standard-looking buttons in your applications. The code for initializing such a button is:

btnSave.AutoSize = True
btnSave.BorderStyle = 1
btnSave.Appearance = 1
btnSave.CommonBitmapType = S309_STD_ENABLE ' =1
btnSave.CommonBitmapID = STD_FILESAVE      ' =8
btnSave.Visible = True
To manipulate the image is as easy. Here is the code to do a rotate; 
picBox.Rotate = 90 ' degrees
picBox.RotateImage
to easily invert colors; 
picBox.Invert = True
picBox.InvertImage
to mirror an image; 
picBox.Mirror = 1 ' Horizontal
picBox.MirrorImage
and to load a picture from a file. 
picBox.Picture = FileName

To save the picture to file, you just:

picBox.SaveImageToFile FileName, 0 ' bitmap

And at the moment, only the bitmap format is available for saving pictures. A detail is that because you have all the playing cards available, you could start to write your favorite solitaire or card game today.

Hints and Tips

Here are a number of hints and tips when using the control:

  • If your image does not load, try setting the property .ImageLoadBufferSize = 4096.

  • Use .DrawMouseMoveLine or .DrawMouseMoveLineEx methods in the _MouseDown, _MouseMove, and _MouseUp events to draw smother lines with the stylus.

  • Set the property .Visible = True in code for each S309Picturebox to get it to display even if you have set it in design mode.

  • Set property .AutoSize = False in the code prior to loading an image. If you need to AutoSize the control see the next item.

  • If you need the S309PictureBox to AutoSize itself you will need to set the property. .AutoSize = True and have a _VBCEAutoSize event for the control and set the .Height and .Width properties in the event procedure.

    Private Sub S309PictureBox1_VBCEAutoSize(ByVal nWidth As Long,  ByVal nHeight As Long)
S309PictureBox1.Width = nWidth
S309PictureBox1.Height = nHeight
End Sub

  • When using the .Height and .Width properties outside of the VBCEAutoSize event, you will need to subtract six pixels in order for eVB to display it in the correct dimensions.

  • The .Hide, .Show, and .Refresh methods do not work with eVB.

  • You can find an updated list.

Deployment

When you are about to deploy your applications that use the S309PictureBox control, and if you are using the eVB Application Installation Wizard, you will not get the S309PictureBox control added to the setup. You will have to add this control yourself by updating the installation information (extension INF) file and rebuild the installation cabinet (extension CAB) files.

In short, the updates to the INF file is:

  • Add S309PictureBox.ocx to the CESelfRegister key in the [DefaultInstall…] section for each processor type.
  • Add a "S309PictureBox.ocx=3" key to the [SourceDisksFiles…] section for each processor type.
  • Add a "S309PictureBox.ocx,,0x80000000" key to the [Files…] section for each processor type.

And then you have to copy the S309PictureBox.ocx for each processor type to the corresponding setup directory. Finally you have to rebuild the cabinet files with the command line supplied in the Readme.txt file created by the Application Installation Wizard and replace the old files in the CD1 subdirectory.

Conclusion

Only the ability to load GIF and JPEG pictures into your eVB application is really enough to use the S309PictureBox control in preference to the intrinsic PictureBox control. Add to that all the features that I have explored above and you have a very easy choice. Start to play around with it today and tell me how you like it.