Ok, the next step in my tutorial, drawing something to the screen. I'll be using Ruby SDL this time, so sorry if anyone already installed Rubygames (it's not that different).
But first, something new about programming in Ruby.
When programing, you are writing in a language that is made to be easy to understand by the computer,
but which may sometimes be less clear to a human later on. That's why it's important to "document"
your programs. To document your programs simply means, to add a human-readable text
to the program that explains what you are doing. Such human-readable texts are called comments.
The programming language will ignore the contents of the comments, but humans can read them,
and certain tools can be used to extract them from the program for further documentation.
Now, how to add comments to your program? In Ruby there are two ways to write coments.
The first one is like this:
=begin
This is a comment. It can consist of many lines.
Note that both = signs have to be at the very beginning of the line,
so you can't put anything before them
=end
The second way to write comments is like this
# This is a one line comment. It begins with a hash sigh. You cannot write it over many lines,
# unless if you write another # sign in front of the comment for the next line.
puts "Hello" # This is another comment. You are allowed to put non-comment stuff in front of this comment.
From now on, I'll explain what I am doing in my ruby program inside the program itself, using comments.
That way, it's more easy for me to explain, and I hope, more easy to understand what each step does,
and also, you can copy the program as a whole and run it easily.
So, let's begin and draw something on the screen already!
require 'rubygems'
# Load the rubygems library. Most Ruby programs need the functionality of this library.
require 'sdl'
# Load the SDL library. We'll use it for accessing the screen.
screen = SDL::Screen.open(640, 480, 0, 0)
# With this, we open the screen in a 640 pixels wide by 480 pixels high.
# For now you should just get a window. I'll explain how to make a full-screen apllication later.
# Hint: it has to do with the last two zeroes. ^_~
# As you may know, a computer screen has many very small points on it, each of them called "pixels".
# A computer can only draw on the screen by changing the color of a pixel.
# When drawing to the screen in 2D, you have to decide how many pixels you want for your screen or window.
# How many pixels a screen has is the "resolution" of that screen.
# A high resolution allows you to draw very finely, because the pixels are "smaller", but it is slower.
# For a modern computer 640x480 pixels should get very nice speeds without being too coarse.
yellow = screen.map_rgb(255,255,0)
red = screen.map_rgb(255, 0,0)
# Create some colors from their RGB values. You're pixel artists, so you should know RGB already. ^_^
# Why do we need to make colours like this? Because the way the screen uses colours is different,
# and may be different for different people and different screens.
# from how humans use them. you need to "map" the rgb value to something the screen will understand.
screen.fill_rect(10, 20, 110, 120, yellow )
# Now, we draw a filled rectangle on the screen, using the yellow color
# What's are the numbers before the color? Well, the first two are the x and y coordinates of the
# rectangle that is drawn. A coordinate is a way to describe the position of a pixel or
# another object on the screen using numbers. The pixel in the top left corner of our screen has
# the coordinates x = 0 and y = 0. The pixel on the bottom left is at x = 0 and y = 479 (that is 480 - 1).
# The pixel on the top right is at x = 639 and y = 0. The pixel on the bottom right is at x = 639 and y = 479.
# This all assuming our screen is 640 by 480. As you can see. x increases from left to right,
# and y increases from top to bottom.
# What are the next tow numbers? Well, they are simply the width and height of the rectangle in pixels.
screen.fill_rect(50, 50, 150, 150, red)
# And now draw a red rectangle.
screen.fill_rect(-10, -10, 50, 50, red)
# Can you guess what this will do? If you youse negative coordinates, the rectangle will be partially outside the window.
screen.flip
# Finally, show on the screen what we have been drawing.
# Any changes to the screen will not be shown until you "flip" the screen, that is , display the changes.
# This is so because, it would be very slow to always change the screen for every time we are drawing.
# Like this, you can do all your drawing first, and then show the result when you are finished.
sleep(10)
# Finally wait 10 seconds, so we have the time to see what was drawn, because after this the program will end
# and the screen will be closed automatically.
There you have it! the first rectangles are on the screen. You can already start making Atari 2600-style drawings
on the screen using rectangles. ^_^ In the next installment, at how to handle keyboard input
(Edit: Used code tags for for Ruby program. Scroll down to read it at your own pace.)