Desktop-as-a-Service Designed for Any Cloud ? Nutanix Frame
In this article we are going to look at Bitmap Animations in VB.NET. In VB6 we had to make extensive use of API's in order to load and initialize large quantities of smaller images. Now in .NET we have the GDI+ dynamic library that has a large selection of graphic classes and functions. This means that we no longer require the use of API's to manipulate images.
The GDI+ has the Bitmap class that allows us to create, load and manipulate images. This class takes place of all the API's previously required to allocate memory resources for images and bitmaps. The most important API was BitBlt, which allowed you to draw images just about anywhere and any size in your Application. This API is now replaced with the Bitmaps DrawImage function.
FloorDC = CreateCompatibleDC(0&) SelectObject FloorDC, LoadPicture(App.Path & "\floor.bmp") LadderDC = CreateCompatibleDC(0&) SelectObject LadderDC, LoadPicture(App.Path & "\ladder.bmp") OilDC = CreateCompatibleDC(0&) SelectObject OilDC, LoadPicture(App.Path & "\oil.bmp") Buffer.Bmp = CreateCompatibleBitmap(Screen.hdc, Screen.ScaleWidth, Screen.ScaleHeight) Buffer.DC = CreateCompatibleDC(0&) SelectObject Buffer.DC, Buffer.Bmp
Let's start with declaring our images and buffers. In VB6, apart from declaring all the API's, the memory allocations were like the above code.
In .Net we simply use the following:
Floorimg = New Bitmap(My.Application.Info.DirectoryPath & "\floor.bmp") Ladderimg = New Bitmap(My.Application.Info.DirectoryPath & "\ladder.bmp") Oilimg = New Bitmap(My.Application.Info.DirectoryPath & "\oil.bmp") BufferBmp = New Bitmap(Screen.Width, Screen.Height) BufferObj = Graphics.FromImage(.Bmp)
As you can see. one command takes care of several API functions. In addition, we do not run the risk of Memory leaks if we do not dispose of the DC's properly.
If you remember, in the previous article we covered Masking, a method used to apply irregularly shaped images over each other. We used masking in VB6 because Transparency was not available but now in .NET, transparency is available, and you can set any single colour to be transparent. For the purpose of this article and to differentiate from Masking we will use WHITE for the transparent color in our project.
Floorimg.MakeTransparent(Color.White) Ladderimg.MakeTransparent(Color.White)Just remember that if any pixel is just off white (IE: RGB 254,254,254) it will not be made transparent.
Here is a sample of images used for the Donkey Kong game.
Sample of images used for the Donkey Kong game
Note: Black will work just as well for transparency, however I used white to differentiate the two methods.
Now that we have all of our images loaded into our small application, let's look at how to use the DrawImage function to create the animations. DrawImage has 30 overloads, however they almost all require only two things.
1: Source Image.
2: Target location.
Our target image is the image used to call the DrawImage function.
BufferObj.DrawImage(Heroimg, HeroX, HeroY)An Additional feature of the DrawImage function is that you can specify the Source location as well, rendering only part of the source image onto the target. This works very similar to how the BitBlt API worked. To render only a small section of the source image to our buffer we could use the following:
BufferObj.DrawImage(Heroimg, HeroX, HeroY, FrameRectangle, GraphicsUnit.Pixel)The Source location has to be a Rectangle Typed variable, with an X,Y cord for the top left corner within the source, and a width and length of the desired image. At this time you will also have to specify what unit these cords are, so that the GDI can correctly calculate the section of the image you're using. I prefer having all my images on the same scale and using the pixel unit.
Finally after having put all our animations into the buffer we can display it. This is quick and easy.
Screen.Image = BufferBmp
The attached download is the Upgraded version of the VB6 Donkey Kong starter game, and as before, it's only the base of the game to demo the methods and get you started with animation.