+- The VG Resource (https://www.vg-resource.com)
+-- Forum: Archive (https://www.vg-resource.com/forum-65.html)
+--- Forum: July 2014 Archive (https://www.vg-resource.com/forum-139.html)
+---- Forum: Creative Zone (https://www.vg-resource.com/forum-86.html)
+----- Forum: Games Development (https://www.vg-resource.com/forum-22.html)
+----- Thread: tSR GameDev Tutorials: Qt C++ - Sprite Drawing (/thread-15553.html)
tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Sengir - 10-13-2010
tSR GameDev Tutorial: Qt C++ - Sprite Drawing
Before you Begin: The Basics of the Basics
Because a lot of you have never programmed before I'm going to explain the most basic elements of C++. Here's a brief list of vocabulary:
Variable: Variables are like boxes that hold different values. Each box has a different name and a different type. You can't mix what type a variable is and the type the value is on most occasions. You'll be using variables a lot.
Value: Whatever you can shove in a variable is a value. They can be almost anything from numbers to letters to classes. Make sure that before you use a variable you assign it a value; while it may seem kinda dumb to miss that it's a fairly common mistake.
Int/Integer: Ints are a type of variable that hold whole positive or negative numbers. If you give it a decimal value it will round down to the nearest whole number, so 9.99 would become 9
Float: Floats are a lot more useful, as they can hold everything an int can, but also decimal values.
Bool/Boolean: Bools are a binary variable, they can only be true or false (aka 1 or 0). Pretty basic stuff.
String: Strings are string of characters. You know us creative programmers, always thinking outside the box when it comes to naming.
Function: Functions are like the maids/manservants of code. Give it a list of what to do, maybe some resources to do it with, and tell it what type of value to return. But not all funtions return values, some return 'void', or nothing.
Class: Classes are objects that have two parts, the header and the source. In the header you tell the class what variables or functions will be in it and in the source you will further define them
Constructor: Constructors are the code that gets called when a class is created as an instance. They only get run once per instantiation. It includes stuff like loading the graphics and position for sprite classes or receiving numbers for physics classes.
Instance: For a class to be used outside of its header and source you have to instantiate it as a variable. Pretty much you have to give the second class the first class' name, what you'd like to call this class variable, and then any constructor code after the parentheses.
Properties: Properties of a class are it's variables and functions. They can be accessed by using a '.' after the class' instance.
Setting up the IDE
An IDE, or Integrated Development Environment, contains useful tools for creating software. They come with a code editor, compiler, and in most cases a set of libraries. In this series we will be using Qt (pronounced "cute"). Qt is a multi-platform IDE and has its own set of libraries that we will learn how to use. Download the LGPL license of Qt here and install it. Don't worry about the commercial version, it just means that you're allowed to edit and redistribute the source code to Qt's IDE.
Now you need to start a new project. Just go to "File>New File or Project" and at the prompt select "Qt4 Gui Application". This'll take you to the next screen where you have to enter the project name and location. At the next few screens just press "Next" and "Finish", you don't want to mess with the settings for this project.
Press the green debug arrow and you'll start building, or compiling, the project. When it's finished you should see a empty grey window with a weird little grey bar. If you feel the need to remove it go into the mainwindow.ui file in the Forms folder. Right-click on the top bar and remove it, and you can to the same to the status bar on the bottom.
Basic C++ and Drawing a Sprite
C++ is an object-oriented programming language. That means it uses objects like classes to be better organized. A class is generally composed of two files, a source file and a header file. Header files are where you declare what a class can do and source files are where you define what a class can do. It's like a pair of bizarre dictionaries. The "header dictionary" has a list of words without their definition, only the page number of the "source dictionary" where the definition is found. This might seem weird at first, but as we progress into other lessons you'll see its usefulness.
The next important things to learn are functions. Functions are pretty much just lists of commands that generally return a value. Say you want to get a random number, you would use a function that generates a random number. However, there are functions that are 'void' that do not return values but correspond to different actions the application can do, like a function that is triggered by pressing a key on the keyboard. For our application we are going to need a void paintEvent function that will draw graphics onto the screen. Go into the header file and right below the changeEvent function type the following to declare the paintEvent function:
Code:
void paintEvent(QPaintEvent *pE);Hopefully you noticed that this function has a set of parentheses. All functions have to have parentheses, but not all have to have stuff in-between them. The 'stuff' inside a function's parentheses are called parameters. They are used to pass variables to be used by the function. Here we are passing a pointer to a QPaintEvent. What's a pointer? Well, you see that asterisk? That means when we activate or 'call' this method we will create a variable called "pE" that will hold not the passed QPaintEvent, but a pointer that tells the code to look at the source of this passed value. Now that we have declared this function in the header file we must define it in the source file like so:
Code:
void MainWindow::paintEvent(QPaintEvent *pE)
{
}We had to put "MainWindow::" to let our class know that this method was declared in mainwindow.h. Also, whatever we put in those parentheses is going to be called when paintEvent is called. The next thing to do is to make a QPainter, an object that will draw things on the screen, like programmed geometry or sprites. When we create it we will need to pass a parameter for what the QPainter will be drawing on. Because we are drawing on mainwindow.ui we will tell the QPainter that 'this' is what we will draw on:
Code:
void MainWindow::paintEvent(QPaintEvent *pE)
{
QPainter painter(this);
}Next on the agenda is to create a QPixmap, named after the fact that a sprite is a map of where each pixel is. Before we create it in-code, we need to create "sprite.png" and place it in the project's debug folder through Windows Explorer or Finder. To create the Pixmap you'll have to pass a string for the file location relative to the executable. Since we placed the sprite in the executable's folder we just have to pass the filename:
Code:
void MainWindow::paintEvent(QPaintEvent *pE)
{
QPainter painter(this);
QPixmap sprite("sprite.png");
}We have everything all set up now, all we have to do is tell the QPainter to draw the QPixmap with painter's "drawPixmap" function. This time we're passing multiple variables, one for where on the x-axis we're placing the sprite, one for the y-axis we're placing the sprite, and the last for the QPixmap we'd like to draw:
Code:
void MainWindow::paintEvent(QPaintEvent *pE)
{
QPainter painter(this);
QPixmap sprite("sprite.png");
painter.drawPixmap(0, 0, sprite);
}Now press the debug button and watch your sprite appear on the screen. There you go, you've successfully drawn a sprite in C++!
Also, after every 5th lesson I'm probably going to challenge you guys to make a sample app using what the 5 lessons were about.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - GrooveMan.exe - 10-14-2010
Not in a position to download the software at the moment, but that all seems easy enough to understand. You don't seem to have included any links yet. Screenshots would be useful too - but I assume you're getting round to both of those.
Does Int stand for Integer, by any chance? Since an Integer is a whole number and stuff. Also maybe mention something about the relationships of Variables and Values? Can't have one without the other, etc. etc.
(10-14-2010, 09:12 AM)Murderbeard Wrote: fffffffffff it usually takes like 3 chapters to get to this part.Also this. Some of the stuff you're explaining I get since I suppose most code shares basic concepts; but there are probably some coding basics you'll need to cover in case there are people who are entirely unfamiliar.
trying when i'm not busy (i'm not just saying that)
And even if everyone does get the basics; it doesn't hurt to go over them.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - LeleleleMAXIMUM - 10-14-2010
fffffffffff it usually takes like 3 chapters to get to this part.
trying when i'm not busy (i'm not just saying that)
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Nindo - 10-14-2010
I'm still not quite sure what to download in order to do this.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Sengir - 10-14-2010
@nindo/grooveman: whoops, i hyperlinked in the word processor but not here :<
@grooveman/murderbeard: Yeah, I think I forgot to make note of the really really basic stuff. Give me a sec to edit that and the link it.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Vipershark - 10-14-2010
If you really want to start with the basics, I would suggest Hello World.
Just saying.
Also fully commented code that tells exactly what each function does.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Sengir - 10-15-2010
(10-14-2010, 12:15 PM)Vipershark Wrote: If you really want to start with the basics, I would suggest Hello World.
Just saying.
Also fully commented code that tells exactly what each function does.
"Hello World" is the same thing but changing the 2 sprite lines into 3 text lines
But yeah, I'll try getting commented code up
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Azu - 10-19-2010
Is this an actual lesson/class on programming in C++? Because if it is....
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Asther - 11-01-2010
I tried this a while ago, but delayed posting hoping some one else might ask. Guess not?
I created a new project as your instructions said, but in the header file I can't find the changeEvent function or any function and I don't know where to put the paintevent function.
I tried entering the paintevent function anyway, under "public", and it gave me some issues.
on
QPainter painter(this);
it says "variable 'Qpainter painter' has initializer but incomplete type."
dont get why no one else has posted about this
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Nindo - 11-01-2010
I haven't posted anything about this because I still don't know where to download the program we are supposed to be using.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Vipershark - 11-02-2010
http://get.qt.nokia.com/qtsdk/qt-sdk-win-opensource-2010.05.exe
Sengir linked it in the OP.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Nindo - 11-02-2010
I still don't see it up there in that first post, but thank you for the link here Vipershark.
I'll start into working on it.
RE: tSR GameDev Tutorials: Qt C++ - Sprite Drawing - Sengir - 01-17-2011
Whoops, forgot to include the #include step. Writing isn't my strong suit, so if there are any good writers out there that would be willing to have a 1-on-1 lesson and convert that into a tutorial please PM me. But for now I'm gonna unpin this...