KonsolScript:Tutorials:Graphics

From GPWiki
Jump to: navigation, search

Graphics

We will try to load an external image then attempt to display it in a viewing screen.

You can try this tutorial at home. Download the File:Kw graphics.zip.

Below is a sample code that will load a "myship.bmp" image file to an image buffer.

Screenshot of the sample program.


function main() {
  Var:Number imgShip;
 
  Image:Load("myship.bmp", imgShip)
 
  Image:Blit(150, 200, imgShip, screen)
 
  Screen:Show()
 
  while (B1 == false) {
    Screen:Render()
  }
}

Provided that "myship.bmp" is existing, the sample code above should work. The screenshot shows how should it look like.

Dimension of the ship image used in KonsolScript tutorial in graphics.


The little square-looking image is "myship.bmp". It actually measures 15 by 9 (width by height).

Let's have a closer look on how did this happen.

  Var:Number imgShip;

So before anything else, let's not forget to declare a Number variable to be used as an image buffer.

  Image:Load("myship.bmp", imgShip)

By then, we can load "myship.bmp" into our image buffer using Load function of Image class.

  Image:Blit(150, 200, imgShip, screen)

We can start placing our buffer of myship.bmp to the primary image buffer of KonsolScript, the screen.

320x240 viewing screen and an image displayed on it.


In the code, we wanted the image to be displayed on 150th of X and 200th of Y.

 Screen:Show()

Next, we need a viewing screen. So, let's make it visible using Show function of Screen class.

Note that screen is an image buffer, while the viewing screen is the visible window itself. More over, screen is not the same with Screen (which is a KonsolScript class). Please don't get confuse.

  while (B1 == false)

We, then, enter into a while loop. The B1 in our condition, "B1 == false", is a Boolean variable that is hooked into ESCAPE KEY. Once ESCAPE KEY is pressed, the value of B1 becomes true. And false, otherwise.

    Screen:Render()

We need to loop because we have to repeatedly copy the picture of imgShip to "screen" using the Render function of Screen class.

So, there you have it! -- A KonsolScript program of displaying an external image file.

Last Words

We could actually remove the rectangular-pink around the ship. Instead of Blit function, we can use TBlit function which means Transparent Blit.

As for the confusing screen and Screen, I suggest that you declare another variable that will point to screen. Try "Var:Number buffer=screen;" then Blit or TBlit everything on buffer.

function main() {
  Var:Number imgShip;
 
  Var:Number buffer = screen;
 
  Image:Load("myship.bmp", imgShip)
 
  Image:TBlit(150, 200, imgShip, buffer)
 
  Screen:Show()
 
  while (B1 == false) {
    Screen:Render()
  }
}

Notice the changes made? Test it on your PC and see the difference.


Sources