| HOME >> Tutorials >> Tutorial 6: Advanced Graphics |
|
Part 1: Introduction
First of all, your probably wondering what exactly advanced programming is. For our purposes, we can define advanced programming as the ability to use all the available facits of the TI-Basic to create quality and technicaly complex games. In order to do this you must understand how the calculator uses the commands on a very low level. To use TI-Basic to make quality games you have to know what your doing. Since ASM programming is very fast, you have to be able to program very intelligently to make quality games that will compete with them. The purpose of these tutorials is to explain several advanced programming techniques. By starting at game design and ending at 3-D programming. It explains mainly the theorys behind these techniques and not the exact syntax of things.
For these tutorials it is assumed that you already know how basic basically works. If you don't know the syntax and how to use things like 'If' statements or 'Lbl's' then you should go read the many other Basic Tutorials out there on the web.
Part 2: Who needs Graphics?
Explanation:
If you think that graphics are not important for a game, then you will never be a good game programmer (Text based RPGs and such dont count!). It doesnt matter if you have the BEST engine ever made, if the user doesn't see any thing good, they won't care. So basically, the only thing that matters is that the user SEES a good program. Doing this requires knowledge of several features on the calc that aren't always used to their greates extent. The previous tutorials have been for just about any calc, but this one will be specific to the TI-83 and TI-83+, but you can still use some of these ideas on other calcs.
Where are Advanced Graphics commands:
Just look under the DRAW menu to see all the commands!
Part 3: Where to get started
When using the graph screen, you shouldn't use the Y variable, the calc will often reset the Y variable to 0 when you clear the screen or use Text and stuff
Screen dimensions:
The screen is 95 pixels by 63 pixels (don't forget the 0 pixel!). One very important part to making making graphics easy, is to set the screen to the right dimensions. The way I always do the graphics is as follows: |
0->Xmin 94->Xmax -62->Ymin (thats the negative sign) 0->Ymax |
This makes it so that you dont need any eguations to go from a line command to a pxl-test( ). All you have to do is put a negative in front of the Y in the line command. For example: |
|
| syntax of line= line(X1,Y1,X2,Y2) syntax of pxl-Test=pxl-Test(Y1,X1) dont ask me why TI switched some of the commands, you'll just have to look it up in your manual if you're not sure. set window vars as stated above :1->X:2->Y :3->S:4->T :Line(X,-Y,S,-T :pxl-Test(Y,X |
|
When it finishes go to the homescreen, hit Ans, and a 1 will show up. |
|
The one means that the pxl test found that that pxl was on. If it was zero, then the pixel would have been off.
Like I said, using those window dimensions is just what I prefer, it makes it easier. Now that you have the window set, you need something to use to put up graphics.
Changing Pixles Quickly:
In the world of gaming, speed is almost always the top priority. There are several ways to turn pixels on and off quickly.
The standard command to easily turn many pixels on quickly is the Line( command. It is the absolute fastest way to turn on AND OFF pixels. It is very simple to utilize the Line command to turn pixels off, here's a sample program: |
|
| set window vars as above 0->A While 1 not(A)->A Line(0,0,94,-62,A) End |
This program will flash a line across the screen. The not(A) changed the 0 to 1 and back agian every time it loops. |
The second fastest way to turn pixels on and off is with the Text( command. Sprites are just about impossible to do in BASIC so that they go fast. So instead, Text is used in the place of sprites. While your are only limited to the standard charachter set, it is an easy way to turn 10-15 pixels in one milli second. Don't forget that you can Text(0,0,"_____" using spaces like this is the fastest way to turn off a big block of pixels in a very short amount of time.
Part 4: Special Effects
The absolute fastest way to turn on a lot of pixels is with the RecallPic command. But unfortunatly, Pics are static, and stay the same. However, Pics are used in many advanced things such as grayscale and layering.
Layered Graphics:
Wouldn't it be cool if you could have a background that an object moved across, and the background never changed? You can! A Pic, when recalled, simply turns on the pixels, and does not turn them off. Here's a sample program so you can see what it does.
| same window set as above ClrDraw For(A,0,400) Pxl-On(RandInt(0,62),RandInt(0,94) Text(55,0,A) End StorePic 1 10->X:10->Z While 1 or Repeat 0, they are the exact same 0 Repeat Ans getKey->K:End X+(K=26)-(K=24)->X Z+(K=34)-(K=25)->Z Line(X,-(Z+6),X+28,-(Z+6),0) Text(Z,X,"SiCoDe") RecallPic 1 End |
The Line off command is to erase the trail that would other wise appear. As you can see, it looks very cool to have something moving over on top of the background. And many awesome looking intros could be made using this technique. |
Wipes:
One really easy, and good looking effect, is to wipe the screen clear. You do this using a Line off command. If you used only one line off command, it would go slow, but you can use several and double the speed of the wipe. Here's an example that wipes horizontally:
| set window vars as above For(X,0,94,3 Line(X,0,X,-62,0) Line(X+1,0,X+1,-62,0) Line(X+2,0,X+2,-62,0) End |
Here's an example that wipes diagonally: |
| set window vars as above For(X,0,80) Line(X,0,0,-X,0) Line(94-X,-62,94-X+62,0,0) End |
The possibilties for the different wipes are limitless, you could have it wipe vertically, wipe diagonally from each country. A cool wipe, could really impress the person playing your game.
Grey Scale:
While grey scale in BASIC isnt exactly as good as in ASM, it still does look grey. This algorithm is from Jonathan W. Capps (PieMan2000@aol.com). The basic idea is to recall 3 Pics in successive order, the one recalled at the beginning will be darker than the one recalled last. So here's the example:
| ZStandard ZDecimal For(A,3,1.5,-.5) Circle(0,0,A) If A=2.5 StorePic 1 If A=2 StorePic 2 End StorPic 3 Repeat 0 ClrDraw RecallPic 1 RecallPic 2 RecallPic 3 End |
As you can see, it does look like grey scale, and thats basically how they do it in ASM, it just goes slowerrr in BASIC. |
Graphical Menus:
Perhaps one of the easiest things to do to make your game look better, is to have a graphical menu. If you have just the standard Menu( menu, your game looks dull and boring. If you want to see a very impressive menu, just download Nibbles Arcade(sicode.ticalc.org/games). The Nibbles Arcade Menu, has instant key-press response, but inverses the current menu selection also. It isnt very hard at all to make your menu and it only takes up about 200-300 more bytes, a custom menu will add a lot to your game.
Next Tutorial: Trigonometric Functions on the Calc and Relevant Uses
Written by Brandon Green.
Tutorial is property of Brandon Green, © 2000. Do not use without permision. Algorithms are property of Brandon Green, e-mail for permision to use.