Creating a Window

First step to any game: create a window for drawing. This will also initialize the Gosu library, so it'll be ready to poll for input, play sound, etc. This article will also introduce the basic framework for games that will be used in all further articles.

The following is the most basic Gosu program you can imagine. The MyWindow class inherits from the Gosu::Window class. It creates a new window, gives it a name, and runs the game loop. At the very last line of the program, an instance of this class is created and the game loop is run.

#!/usr/bin/env ruby
require 'rubygems'
require 'gosu'

class MyWindow < Gosu::Window
 def initialize
    super(640, 480, false)
    self.caption = "My Gosu Window"
 end
end

MyWindow.new.show

All of the code related to window creation is in the initialize method. To create the window, Gosu::Window's initialize method must be called with the width and height in pixels, as well as whether you want to run in fullscreen or not. Optionally, you can assign to the caption attribute to set the window title.

Something More Interesting

This wasn't very interesting though, all it does is display an empty window. The following code adds the update and draw methods. The update method is called every frame, as is the draw method. There's nothing much there yet, but we use this to calculate a delta, or the time (in seconds, usually a small fraction of a second) since the last time the update method was called. The draw method will "clear" the screen by drawing a blue rectangle over the whole thing. Also, you can see a few things have been refactored, such as the width, height and title of the window no longer being hard-coded.

#!/usr/bin/env ruby
require 'rubygems'
require 'gosu'

class MyWindow < Gosu::Window
 WIDTH = 640
 HEIGHT = 480
 TITLE = "My Gosu Window"

 TOP_COLOR = Gosu::Color.new(0xFF1EB1FA)
 BOTTOM_COLOR = Gosu::Color.new(0xFF1D4DB5)



 def initialize
    super(WIDTH, HEIGHT, false)
    self.caption = TITLE
   
    @last_frame = Gosu::milliseconds
 end



 def update
    calculate_delta
 end

 def calculate_delta
    @this_frame = Gosu::milliseconds
    @delta = @this_frame - @last_frame
    @last_frame = @this_frame
 end



 def draw
    draw_background
 end

 def draw_background
    draw_quad(
     0,     0,      TOP_COLOR,
     WIDTH, 0,      TOP_COLOR,
     0,     HEIGHT, BOTTOM_COLOR,
     WIDTH, HEIGHT, BOTTOM_COLOR,
     0)
 end
end

MyWindow.new.show

Most of this should be pretty straightforward. The update method is keeping track of when the last frame was rendered, and subtracting it from the current time (in milliseconds). It's dividing that by 1000.0 to get the time since the last frame in seconds, which is going to be used for time-based movement.

The draw method is doing something that looks complicated, but is quite simple. Since it's a long method call, the code for drawing the background was isolated in the draw_background method. It has a single call, draw_quad, which takes 13 arguments. These are (in order), the X and Y coordinates of the top-left corner of the rectangle to draw, its color, the coordinates and color for the top right, bottom left and bottom right and finally the Z layer for the quad (more on that later, leave it at 0 for now). It's a long method call, but it's just drawing a colored rectangle.

One final thing to note, the colors used are in "HTML hex code" format. You can pick any colors you like with a color picker such as this one, or anything else that provides these hex-type color codes.

With that, we have a good framework on which we can build. We'll be able to easily copy and paste this into our projects, plug in code to load images, and you'll be programming games in no time!

This article is part of a series. Read more articles about Rapid Game Prototyping in Ruby