2012


TSE-VGA Technical document VGA Compiled by Ovi2wise (). Jan 2012

TSE-27 [Type the company name] 1/1/2012

TSE-VGA Technical document
Table of contents Page number 4 4 5 5 6 7 7 8 9 9 9 9 10 11 11 13 13 13 14 15 22 23 23 23 23 23 25 27 33 34 34 35 35 35 37 37 39 40 41 43 43 43 45 51 54

Chapter 1 – Overview of project 1) Introduction 2) Problem Statement 3) User Requirement Specification 4) Definitions 5) Importance and Benefits of the Study 6) Budget 7) Conclusion Chapter 2 – Resources and Case Studies 1) Introduction 2) List of Studies 3) The Arduino Development Board 4) Gameduino Shield 5) Tile Studio 6) Conclusion Chapter 3 – TSE-VGA V1.5 1) Introduction 2) Operation Principles 3) Sprite Graphics 4) Functions 5) Conclusion Chapter 4 – TSE-VGA V2.2 1) Introduction 2) Upgrade Info 3) Principle of Operation 4) Sprite Graphics 5) Background 6) Functions 7) Conclusion Chapter 5 – Bibliography 1) List of web sites Appendix A – Arduino Programming Tutorial 1) Introduction 2) Schematics 3) I/O Pins 4) The Arduino Platform 5) Basic and Relevant Programming commands 6) Additional Exercises 7) Debugging Tools Appendix B – Gameduino Essentials 1) Introduction 2) The Gameduino Shield 3) Memory Map and Background 4) Sprites (Foreground) 5) Text in Gameduino

Page 2

TSE-VGA Technical document
Appendix C – Tile Studio 1) Introduction 2) Tile Studio Download 3) The Tile Studio User Interface 4) An Example 5) Conclusion 55 55 55 55 59 64

Page 3

TSE-VGA Technical document
Chapter 1 – Project Overview 1) Introduction On the year 2012, in Tshwane University of Technology, as a part of our year practicals, we, the P1 (Practicals 1) students were invited to participate in a project that our training facility, Technology Station in Electronics, had planned for us. We, as a team of P1students, were to modify a mechanical (BIREL) Go-Kart such that it would run entirely electrically. Tasks had been divided and assigned to each student or groups of students. These tasks included the following sub systems • Mechanical chassis modification o Disassemble the entire Go-Kart o Mount battery harnesses on the frame o Rectify all mechanical errors on the following parts Steering Rear wheel axle Front wheel alignment Motor sprocket alignment with rear axle gears Enhance seats and pedals o Mount brackets for necessary sub systems and electrical harnesses o Produce a heat sink for the motor speed controller o Produce other parts for the Go-Kart Chassis • Electrical systems o Design a charging station for the 4X12V SLA (sealed lead Acid) o Design a motor speed controller or adapt from chosen motor controller o Connect all batteries with adequate connectors to and from all systems relevant to the Go-Kart drive system • Electronics subsystems o Acceleration sensor using a Accelerometer to measure actual acceleration o Digital Compass using a magnetometer o Acceleration meter used to sense the intended acceleration despite losses o Character display on VGA screen using the Gameduino Shield with the Arduino UNO REV3 development board (this document is based on this project) o Wi-Fi link to and from different Arduino boards using the Wi-Fly Arduino shield o GPS acceleration and speed measurement using the GPS receiver shield o Battery voltage measurement using ADCs from the dev board o RPM measurement using counter and a magnetic sensor chip mounted on rear axle All systems had been assigned to students and I, Ovi2wise , had been assigned the duty of programming the VGA character display using the Gameduino shield and Arduino UNO REV 3 board. The Arduino UNO REV3 dev board serves as a very basic and user friendly board with easy compiler software that allows the user many short cuts. Using basic C++ programming and example programs, anybody can get easily acquainted with the interface. The Gameduino shield is a complex shield that should not be taken lightly, although the use of an Arduino board simplifies the task of programming this board, there is much theory that one must learn before attempting to create a program. The example projects provide good resources that can

Page 4

TSE-VGA Technical document
be adapted to almost any use that the programmer may want but creativity and problem solving skills come in handy when using this board. A graphical display can be adapted once the programmer has mastered the use of the Arduino UNO and experiment thoroughly with the Gameduino shield. As this project requires, the specifications were to utilize these boards to drive a VGA screen where it would receive data either serially or through UART (Wi-Fi), although this document does not cover the process of receiving the data, it surely explains how to display data in a very visual fashion 2) Problem statements During test drives for this Go-Kart, it is essential to observe the performance and record them into a chart. These charts will aid in determining the quality and life span of the product. Degrading factors and glitches can be found and rectified or improved. A problem arises when data capturers capture information whilst they are driving; it is very unsafe and inaccurate. A method of observing the vehicle from a distance had to be developed such that the driver can concentrate on pushing the limits of the kart whilst engineers observed key information from a distance even if the kart were to drive far away. Using a Wi-Fly shield, information would be sent to a remote station where data can be analyzed. The Wi-Fi shield project has been appointed to another group member; therefore in this project, the data is required to be displayed for analysis in a graphical fashion. 3) User requirements and specification According to our supervisors, the following data is necessary to display • Speed • Motor temperature • Acceleration • Temperature • Battery life • GPS coordinates • Digital compass bearing All these elements have to be displayed graphically and the data must change in real time, thus animation of the data is necessary. During the course of the entire project, modifications to the specification were insisted according to the progress shown which will be shown in later versions of the program. In the following chapters, key versions will be shown in sequence of the development of the VGA controller and certain versions will be skipped.

Page 5

TSE-VGA Technical document
4) Definitions Throughout the document, there are key words that are used often which may be recognized by technically literate readers, the list of definitions below offer a brief explanation on some terms used in this document that users should familiarize themselves with. • TUT – Tshwane University of Technology • P1 – Practical 1, a 6 month period practical training compulsory for all national diploma students in engineering. • VGA – Video Graphics Array, a port used to connect screens and monitors to high speed graphics controllers • SLA – Sealed Lead Acid, a type of battery, sealed airtight for protection in case of extreme agitation dealt to the battery physically. • Accelerometer - gravitational force sensor, this component can sense gravitational weight in 3 dimensions • Magnetometer - electronic device used to generate coding showing true north and horizontal tilting • Arduino - company based in Finland, this company develops and distributes easy DIY, open source and hack-able microcontroller development boards • Arduino UNO REV 3 - a standard Arduino development board (revision 3) that utilizes an Atmel atMega328 microcontroller • uController - abbreviation for a micro controller, microchip with processor used for controlling circuits digitally depending on programmed coding • dev board - abbreviation for development board, a board used for microcontroller testing and debugging applications • FPGA - field programmable gate array; microcontrollers that are programmable by users instead of manufacturers, internal hardware is arranged such that components can be rearranged as user defined • Bootloader - default program loaded into Atmel microcontroller to detect the Arduino standards. all Arduino boards are loaded a bootloader to ensure simplicity of common commands • sketch - an Arduino project is referred to as a sketch, it is similar to a C++ source code but it is adapted for Arduino use only, it does not include vital functions such as main() or header files that are usually included by default. • Arduino.h - header file included in the boot loader of all Arduino programs that include predefined functions for simpler access • Arduino shields - extension boards that are mounted onto your normal Arduino board, that are called shields. different shields provide different extensions such as Bluetooth, Wi-Fi, Gameduino, Ethernet and many more • Gameduino - a shield used for the Arduino that controls • Sourceforge.net - a well known website that is popularized by its function of holding many freeware software • Colour palette - the colour set used for a set of tiles. in any image, there is a set of colours that is repeated throughout the image. the colour palette contains all colours in a list for reference. In Gameduino, this list is coded into a hex look up table where all colours of a background or sprite will refer to this palette to choose a colour. • Tile - tiles are referred to the small graphics drawn as sprites for the Gameduino • sprites - sprites are small graphic drawn from tiles that is used in the Gameduino for display

Page 6

TSE-VGA Technical document
5) Importance and benefits of the study The importance of these developments is very apparent and is slowly becoming simpler to reproduce. VGA controllers are not simple adapters that can be easily and readily connected. Even when using a shield with a simple development board, the Gameduino proves to be a challenging piece of equipment. Display LCDs are always impressive to program, but are not simple and therefore demands more technical concentration instead of an artistic demand, thus they are not very suitable for public displays that find graphical interfaces more impressive instead of plain information such as Command Prompt windows. Further study into the field can also cause a better approach into studying uControllers that involve VGA adapters by forcing a programmer to learn how to create a programming interface before architecting the internal operations of a microcontroller where one would replace the FPGA (field programmable gate array) microcontroller. I plan to further study this work to understand the principles of VGA and furthermore gain advancement in knowledge in newer technologies supported today Throughout the project, multiple versions of the project had been made TSE-VGA V1.5 (final version in the series) can be viewed in Appendix D Text D.1.1 TSE-VGA V2.2 (final version in the series and final project version) can be viewed in Appendix D Text D.2.1 These versions are key and will be referenced throughout the document. • • 6) Budget Due to the simplicity of the components, there aren’t many thing that need to be bought, but since this project is an official research project, all equipment are listed and relevant prices are shown for a full budget review Prices are quoted and compared for an average price. Due to economy uncertainties, all prices may vary Item description and contribution to project Price 4:3 width and length, 17” VGA screen R600 Development board R230 Gameduino VGA controller Arduino shield R830 used for analog simulations at the input of the ADC R2 Female to female cable R25 Table 1.1, budget table As seen above, the list of equipment is fairly short. In the following pages, quotations are shown for key items in the project Quotations for the equipment uncommon equipment can be found by following Appendix E. all other components were found in our existing tool box but can be easily searched for at any electronics store. Item name VGA screen Arduino UNO REV 3 Gameduino 10k POT VGA cable

Page 7

TSE-VGA Technical document
7) Conclusion When all plans and sub-projects are executed, this project aims at designing a state of the art vehicle that will run entirely on electricity, and through this project, this kart will thus be monitored closely for performance records. A graphical display is important for public displays or team displays as well as recording data to show change in factors such as speed and acceleration and also to show flags such as temperature and battery levels incase those are respectively too high or too low. The use of a Gameduino has been firmly decided upon and supported by developers and by me, the head engineer in this project, as a sufficient tool for this project.

Page 8

TSE-VGA Technical document
Chapter 2 – Resources and case studies 1) Introduction Throughout the project, multiple studies had to be made before actually programming the Gameduino shield. Referring to appendix A and appendix B, there are many more advanced researches that had to be done before the complete program, but debugging was essential for trial and error was the foundation to this project. 2) List of studies Multiple things needed to be clarified, as the following list suggests, these are the studies conducted during the time that development of the project was in progress. Please note that the enlisted cases were studied at no specific pattern but rather cross referenced back and forth as new problems and discoveries emerged. • the Arduino Development board (covered in Appendix A) o I/O in Arduino o Commands and headers o Special specifications o Baud rate Gameduino shield (covered in Appendix B) o Sprite graphics o Screen resolution o Background graphics o Text display o Variable integer display o Integer to sprite graphics conversion o Extracting sprite graphics from chess example Tile Studio software (covered in Appendix C) o Creating a new tile set o The importance of picture format o Operations of the program Microsoft Paint (general knowledge, its part in this project has been covered in Appendix B) o Drawing a background with the right resolution o Using a scale to preserve characters on the background

3) The Arduino Development board In the Arduino development board, the studies that had to be conducted were fairly easy due to the simplicity of the interface and the vastness of tutorials. Learning what the input and output commends were the simplest of tasks, all pins were renamed to the labels presented on the board itself so identifying them was not hard. The ADC commands were also very much simplified since all delays and flags were included in one command. Referring to Appendix D, Text D.3.3; the text shows the following codes that serves a good example of input and output data.

Page 9

TSE-VGA Technical document
int sensorValue = analogRead(A0);//reading analog data

the above code was the only one that had to be used in the entire program, even so, this data was only used for development purposes to simulate values instead of receiving values. Although in the header files included in the Gameduino (“GD.h” included in Appendix D text D.3.2), it included the SPI library (“SPI.h”) which contained very basic input and output commands, the primary source code had no need for input and outputs rather than receiving data serially and displaying them through Gameduino commands. A number of header files were included in the code that contributed massively to the entire project. Many commands in the header files were not used but did serve purpose to debugging such as the following text extracted from Appendix C, text D.3.3;
draw_sprite(random(400), random(300), anim, 0);//used for drawing all your sprites randomly

the headers included in the main file are as follows
#include <SPI.h>//SPI communication to the Gameduino board has to be included #include <GD.h>//this header file has to be copied to the library folder, it will hold all the necessary commands for the shield #include "image.h"//this header file is used to store the background graphics image in code #include "sprite.h"//this header file is used to store the sprite graphics in code and reference them

These header files above contain all the necessary definitions and functions that were used throughout the code. When first installing the Gameduino, there were minor glitches in the code that was downloaded in the program. One very important fix was a clash in the library inclusions on the source codes downloaded. What happened was that the Gameduino source code was adapted for earlier Arduino platform versions, and more recently, the Arduino platform had renamed some of their header files such as the header named “WProgram.h” has been renamed to “Arduino.h”. The change in files needs to be corrected as shown in Appendix D Text D.3.2. The Gameduino display driver commands the use of a baud rate set to 10000, this may cause conflicts in the event that multiple boards are connected which require different baud rates but can be corrected by setting the baud rate back and forth for every applicable function. 4) Gameduino shield As you will see further in the document, there were levels in which the final product was developed. The strategy in which sprites and background were used had to be changed entirely. After studying Appendix B, it becomes better understood the functions of sprites, background graphics and all other aspects of the Gameduino shield.

Page 10

TSE-VGA Technical document
Sprites had to be individually drawn using tile studio, following appendix C, readers of this document can experience through my eyes what I had experienced. Tile studio is a very simple program but is not explained freely. A tutorial was found before actually using the program for Gameduino (tutorial link shown in Appendix C). Furthermore, sprites had to be drawn in PNG format (does not adjust pixels in this format) and submitted to the Gameduino website tools that convert PNG picture sprites to code in a header file (also shown in Appendix B ). The screen resolution of Gameduino is 512x512 pixels but the resolution that can be displayed is 400x300 pixels, scrolling was not needed for this project because it was possible to display all the data in one screen and the background played little part initially in the data display. The background graphics caused a key problem in this project, one which caused an entire change in the software and triggered a new version to be written. The key problem was that when we tried to display text over graphics, the text would not be transparent around its graphics, in other words, the text would take up an entire block that would display over the background which blotted out the graphics. In Appendix C, text 2; the coding shows that no background was used, hence the text would display normally without disrupting a background. This however posed another serious problem; the entire project is goaled to be a graphics display ready to show to public, a display with only foreground graphics that is limited to 64 sprites images. This highly limited the graphical display of the project. Although text could not be displayed without disrupting the background, the idea had not yet failed. After hours of searching the internet, i had stumbled onto an example project that was included in the Gameduino folder. The chess board example inside the Gameduino examples folder has numbers converted to sprites. For more details on the matter, the reader should read Appendix C and then read Appendix B, both appendixes were not compiled in the order that the reader should like to read but rather the order in which the studies were made by the author of this document. 5) Tile Studio The Tile Studio software has been explained in detail on its operations and downloads in Appendix C. this program has been a key element to the success of this project. It has allowed the project to look professional in both project versions TSE-VGA V1.5 and TSE-VGA V2.2. The program had only been discovered due to the tutorial submitted by Mr. Brian A. Thompson on the 21st of September in 2011. His tutorial has helped this project become a success with a larger contribution than of my own; I would recommend it to any developer struggling in similar projects in any part of the world. 6) Conclusion After studying all of the above, the understanding of this project becomes simpler because by now the reader is capable of compiling his or her own project of a similar fashion. Using the above information, we can conclude that the Gameduino shield will be the pivot point of the entire project, where in the project TSE-VGA V1.5, the use of sprites and text had been implemented as it will be shown in the next chapter. The making of sprites requires the study of Tile Studio and the Gameduino tools web site.

Page 11

TSE-VGA Technical document
In the project TSE-VGA V2.2 however we do not use text due to its disturbance to background. In the Project TSE-VGA V1.5, the use of text is very well used and is covered in Appendix B extensively.

Page 12

TSE-VGA Technical document
Chapter 3 – TSE–VGA V1.5 1) Introduction This version of the project had been completed before the end of March 2012. This document has been compiled several months after its completion and thus may be missing deeper details as the current version. This version of the project utilizes sprites, text and plain backgrounds to display the information on a VGA screen. The code for this version has been submitted in Appendix D Text D.1.1, before reading this chapter, the reader should familiarize himself/herself with Appendixes A, B and C. 2) Operation principles In this program, the operation follows the following principles: 1. Initialize Gameduino 2. Draw grid and sprites for display using sprites 3. (since data has to be sent in from an external project) await data to be given by external serial project 4. If no new data has arrived, remain idle 5. When new data has arrived, change data on the screen and delay operations for a period of time before checking again The operations are thoroughly followed in the program and only await the completion of the other project. Sprites are drawn and copied into the external header file for the program to read. Sprites are also drawn in the initializing function of the program (setup()). Before this project had been cancelled, a photo of the screen had been taken and the display looked something like this:

Fig 3.1 VGA-TSE 1.5 display photo

Page 13

TSE-VGA Technical document TSE
3) Sprite Graphics In a meeting held by our team, it was discussed what data should be displayed. The following were key data that were suggested

• • • • • • •

Speed RPM Total Battery life Individual battery life GPS longitude and latitude Magnetometer compass direction eter Motor temperature

Not all data had been displayed in this version of the project because before it was completed, the project had been disapproved due to insufficient display functionality. The project had to be remade. Yet sprites were made for these displays and served as a stepping stone for the next version of the project. The following sprites are explained from left to right, top to bottom:

Fig 3.2, sprites used for project TSE-VGA V1.5 3. • • • • • • • • • • • • • • •
Filling block used for display grid Right side T bracket used for display grid Horizontal line used for display grid Bottom side T bracket used for display grid Top left corner bracket used for display grid Bottom right corner bracket used for display grid Battery top indicating full side Empty battery sprite Battery level sprite Full battery sprite Battery bottom side with battery indicator Clock sprite Speedometer sprite GPS flag sprite Logo T

Page 14

TSE-VGA Technical document
• • • • • •
Logo S Logo E Wheel sprite for RPM °C temperature sprite Compass direction sprite Compass north sprite

The combination of the above sprites were used to draw the display, the display grid sprites were used most frequently and caused the sprite memory to be over used and so there were less sprite spaces available for a well made graphical display. Following further into the document, in the next version, more functions were displayed. 4) Functions Numerous functions were constructed for the display to function smoothly. The functions had to be constructed in such a way that data could be received independently and the corresponding data would instantly be updated on the screen. The following functions were created for this project: I. Setup function The setup function had to initialize the Gamduino and store all the sprites. The function for drawing the grid had also been called during setup. void setup(void) { Serial.begin(1000000); GD.begin(); GD.ascii(); GD.fill(0,' ', 4096); i = 0; prevB = -1;//startup value GD.copy(RAM_SPRIMG, pickups2_img, sizeof(pickups2_img)); GD.copy(RAM_SPRPAL, pickups2_pal, sizeof(pickups2_pal)); dGrid(); } II. Main loop Function

Since the external projects had not yet been completed, a simulated value from an analog input had been used for data. All input data to the functions had been modified to accommodate the data ranges.

Page 15

TSE-VGA Technical document
void loop(void) { i = analogRead(A0); dBatt(i,i); dSpeed(i, 22, 19); dCompass(i/128); dTemp(i); } III. Battery display

The battery display was a tricky function and had to be done through a lot of trial and error but it eventually became fully functional so long as the input data was in the right range. void dBatt(int lvl,int lTime)//function = display battery level {//occupies 12 sprites; 0-11+15 //draw top and bottom GD.sprite(11, x*25, y*7 , 7,0,0,0); GD.sprite(10, x*25, y*18,11,0,0,0); lvl = lvl/100; //sprintf(temp,"%d",lvl); //GD.putstr(10,10, temp); if(lvl != prevB) { GD.putstr(35,35," "); switch(lvl) { case 0 : { prevB = 10; while(prevB--) { GD.sprite(prevB, x*25, (8+prevB)*y,8,0,0);//empty battery } prevB = lvl; break; } case 10 : { prevB = lvl;

Page 16

TSE-VGA Technical document
while(lvl--) { GD.sprite(lvl, x*25, (8+lvl)*y,10,0,0);//full battery } break; } default : { for(prevB = 1; prevB < lvl; prevB++) { GD.sprite(-1+prevB, 25*x, y*(18-prevB),10,0,0);//fulls } for(prevB = 0;prevB <(10-lvl); prevB++) { GD.sprite(9-prevB, 25*x, y*(8+prevB),8,0,0);//empties } GD.sprite(lvl-1, 25*x, y*(18-lvl), 9,0,0,0); prevB = lvl; } } } GD.putstr(30,32,"Batt life"); GD.sprite(15,17*x,18*y,12,0,0,0); sprintf(temp,"%d",lTime/10); GD.putstr(39,35,"Mins"); GD.putstr(35,35,temp); } IV. Display compass

The compass was more complex than anticipated, the lack of rotational options in sprites did not allow a well rotating compass, and this was one key upgrade in the final version of this project. This version of the compass required multiple switch case statements and became almost similar to a nested if statement code that looked bulky void dCompass(int dir) {//requires 2 sprites; 13-14 //dir = dir%8;//converting to a byte GD.sprite(13,20*x,2*y,21,0,0); GD.sprite(14,20*x,3*y,20,0,0); if(dir != prevD)

Page 17

TSE-VGA Technical document
{ GD.putstr(40,6," prevD = dir; } switch(dir) { case 0: { news[0] = ' '; news[1] = 'N'; break; } case 1: { news[0] = 'N'; news[1] = 'E'; break; } case 2: { news[0] = ' '; news[1] = 'E'; break; } case 3: { news[0] = 'S'; news[1] = 'E'; break; } case 4: { news[0] = ' '; news[1] = 'S'; break; } case 5: { news[0] = 'S'; news[1] = 'W'; break; } ");

Page 18

TSE-VGA Technical document
case 6: { news[0] = ' '; news[1] = 'W'; break; } case 7: { news[0] = 'N'; news[1] = 'W'; break; } } GD.putstr(40,6,news); } V. Display temperature

The display of temperature was not as hard as one would expect. The function could accommodate for any range of data to be sent as long as it can be converted into the right temperature value void dTemp(int deg) {//1 sprite; 16 deg = deg/10; GD.sprite(16,3*x+5,17*y,19,0,0,0);//display thermometer if(prevT != deg) { GD.putstr(3,33," "); prevT = deg; } sprintf(temp, "%d", deg); GD.putstr(3,33,temp); } VI. Display speed

This is one of the upgraded functions in the next version of this project. The speed display had become like normal text where it demanded a more visual display with bigger text. In this project, the speed display had been put in the middle of the screen but still the font size did not command enough attention. void dSpeed(int spd, int h, int v) {//requires one sprite; 12

Page 19

TSE-VGA Technical document
GD.sprite(12, 10*x, 10*y, 13, 0,0,0);//display speed gauge spd = spd /10;//sample speed // char tempS[5]; if(prevS != spd)//will stay idle for static speeds { GD.putstr(h,v+1," "); prevS = spd; } sprintf(temp,"%d", spd); GD.putstr(h,v,"SPEED (km\\H):"); GD.putstr(h,v+1,temp); } VII. Draw grid

In this project, displaying plain text would be a disappointment due to all the Gameduino capabilities yet the display is over simplistic. The grid around the text had been drawn for a better display and separation of data. Most of the sprite IDs were used in this function void dGrid(void)//function ot draw framework {//sprites from 17 //draw all bars int b; //x - lines for(b = 1; b<26; b++)//draw horizontal lines { GD.sprite(16+b, b*x, 0*y, 2,0,0,0);//25 sprites; end at 41 GD.sprite(41+b, b*x, 19*y, 2,0,0,0);//25 sprites; end at 66 delay(10); } //y - lines for(b = 1; b<19; b++) { GD.sprite(66+b, 0*x, b*y,2,0,1,0);//17 sprites; end at 84 GD.sprite(84+b,26*x,b*y,2,0,1,0);//17 sprites;end at 103 delay(10); } //draw corners GD.sprite(103, 0*x, 0*y, 4,0,0,0); GD.sprite(104, 26*x, 19*y, 5,0,0,0); GD.sprite(105, 26*x, 0*y, 4,0,2,0); GD.sprite(106, 0*x, 19*y, 5,0,2,0);//ends at 106 //draw T bracket replacements

Page 20

TSE-VGA Technical document
GD.sprite(90, GD.sprite(82, GD.sprite(75, GD.sprite(70, 26*x, 6*y, 1,0,0,0); 0*x, 16*y, 1,0,2,0); 0*x, 9*y, 1,0,2,0); 0*x, 4*y, 1,0,2,0);

GD.sprite(65, 24*x, 19*y, 1,0,1,0); GD.sprite(56, 15*x, 19*y, 1,0,1,0); GD.sprite(45, 4*x, 19*y, 1,0,1,0); //continue from sprite 106 for(b = 1; b <24; b++)//line at y = 16 for title block { GD.sprite(106+b, b*x, 16*y, 2,0,0,0);//end at } for(b = 0; b<2; b++)//draw columns of title blocks { GD.sprite(130+b,4*x,(17+b)*y,2,0,1,0); GD.sprite(132+b,15*x,(17+b)*y,2,0,1,0);//end at 133 } for(b = 0; b< 13; b++)//battery left bar { GD.sprite(134+b, 24*x, (7+b)*y, 2,0,1,0);//end at 145 } GD.sprite(146, 25*x, 6*y, 2,0,0);//battery top bar for(b = 1; b<10; b++)//GPS location box: x lines { GD.sprite(146+b, b*x, 4*y, 2,0,0);//end at 155 GD.sprite(155+b, b*x, 9*y, 2,0,0);//end at 164 } for(b = 5; b<9; b++)//GPS loacation box: y lines { GD.sprite(160+b, x*10, y*b, 2,0,1,0);//end at 167 } //GPS location corners GD.sprite(170,10*x,y*9, 5,0,1); GD.sprite(169,10*x,y*4, 4,0,2); GD.sprite(171,24*x,6*y,4,0,0,0); //replacing T junction of the title blocks GD.sprite(110,4*x, 16*y,1,0,3,0); GD.sprite(121,15*x,16*y,1,0,3,0); GD.sprite(143,24*x,16*y,1,0,0,0);

Page 21

TSE-VGA Technical document
} Further functions became obsolete as a new project version had been initiated. 5) Conclusion As mentioned above, more functions were to be made but were obsolete. This version of the program enabled a rolling start into the next version since key functions had been completed. Please consult Appendix D Section 1 for the entire text which will include libraries and global variables and other relevant texts.

Page 22

TSE-VGA Technical document
Chapter 4 – TSE-VGA V2.2 1) Introduction In the TSE Go kart project, there were multiple projects that were designated to trainees that were not meant for public display but rather internal operations of the entire project itself. However, the TSE-VGA project was solely directed for public display. If the display is not impressive enough or graphical to the public eye, it would be considered partially failed. The TSE-VGA V1.5 project was a functioning project and would satisfy any technically minded person. But it is not enough to satisfy the public eye 2) Upgrade information The TSE-VGA V2.2 project is adapted from the TSE-VGA V1.5 project and has been upgraded with the following changes: • Background image is used • No text is used to display information, only sprites are used to show change in data • A bigger speedometer display adapted from the chess example of Gameduino examples • More graphical compass display • Individual battery level indicators • GPS display ready • RPM display Some elements were kept slightly changed while some functions had been changed entirely. 3) Principle of operation In this version of the project, the principle of operations followed the exact same principle as the previous project and only display methods had been changed. 1. Initialize Gameduino 2. Draw grid and sprites for display using sprites 3. (since data has to be sent in from an external project) await data to be given by external serial project 4. If no new data has arrived, remain idle 5. When new data has arrived, change data on the screen and delay operations for a period of time before checking again 4) Sprite Graphics The sprites used in this project had to be entirely changed since display grid sprites were no longer required. Redrawing the sprites, many were changed from the first version as a change to be more appealing to group members, inputs and suggestions were submitted by them and so they were implemented.

Page 23

TSE-VGA Technical document TSE

Fig 4.1, sprites used in TSE-VGA V2.2
The sprite details are explained from left to right and top to bottom ls

• • • • • • • • • • • • • • • • • • • • • •

Individual battery level 10 Individual battery level 9 Individual battery level 8 Individual battery level 7 Individual battery level 6 Individual battery level 5 Individual battery level 4 Individual battery level 3 Individual battery level 2 Individual battery level 1 Life time battery full bar Display sprite numeral 0 Display sprite numeral 1 Display sprite numeral 2 Display sprite numeral 3 Display sprite numeral 4 Display sprite numeral 5 Display sprite numeral 6 prite Display sprite numeral 7 Display sprite numeral 8 Display sprite numeral 9 Compass pointer sprite used for graphical digital compass use

A slight modification had been implemented in the sprites of this program. Since larger numerals were requested for the display of speed, a noticeable tutorial had been used and adapted into being ested used for this program. If the reader studies the sprites table in Appendix D text D.2.2, it is clear that there are way more sprites than the ones drawn above, this is due to the sprites graphics copied from the Chess example given in the Gameduino program. The Chess program code uses very well drawn numerals that use 2 sprites per number; the numerals were copied and adapted into use in this project with slight modifications that can be better understood by observing the functions such as ications speed and temperature display. These functions uses larger text that is identical to the Chess example but the palettes do not match, therefore the colour does not correspond but the display works just fine but the background is no longer transparent and therefore the area on which the numbers are displayed has been painted to the natural palette background colour, black.

Page 24

TSE-VGA Technical document
5) Background The display in this version of the project did not require any text, this allowed us the use of backgrounds. The background had to be carefully drawn to minimize the use of characters in background memory (refer to Appendix B on the construction of this background). Refer to the next page for full display background

Page 25

TSE-VGA Technical document TSE

Fig 4.2, the project background
Final project looked something like this:

Page 26

TSE-VGA Technical document

Fig 4.3, the TSE-VGA V2.2 final project being displayed
6) Functions Here is a list of functions in the program and a brief explanation on each function I. Setup

The setup function required a few extra setups to initialize the background void setup() { GD.begin(); //background for (byte y = 0; y < 38; y++) GD.copy(RAM_PIC + y * 64, image_pic + y * 50, 50); GD.copy(RAM_CHR, image_chr, sizeof(image_chr)); GD.copy(RAM_PAL, image_pal, sizeof(image_pal)); //sprites GD.copy(RAM_SPRPAL, sprite_sprpal, sizeof(sprite_sprpal)); GD.copy(RAM_SPRIMG, sprite_sprimg, sizeof(sprite_sprimg)); // For show, randomly scatter the frames on the screen

Page 27

TSE-VGA Technical document
/* GD.__wstartspr(0); for (int anim = 0; anim < SPRITE_FRAMES; anim++) draw_sprite(random(400), random(300), anim, 0); GD.__end();*/ } II. Main loop function

The main loop function had more functions than the previous version, therefore further functions were called void loop() { int i = analogRead(A0); int batMini = i/113; dBatt(5,0,9,batMini,batMini); //batMini = cos (0*PI/180); dSpeed(i/8); compass(i); GD.sprite(223,(22*x)-2,(3*y)-1,21,0,0);//compass center dTemp(i/5); dRPM(i/11); /*GD.sprite(0,9 *x+1,y*11+5,22+1,0,0,0); GD.sprite(1,9 *x+1,y*12+5,33+1,0,0,0); for(i =0; i<25;i++) { GD.sprite(2+ i, x*i, y* 5, i, 0,0); } for(i=25; i< 44; i++) { GD.sprite(i+ 2,x*(i-25), y*8,i,0,0 ); }*/ } III. Display temperature

Temperature remained almost the similar as the previous function but an addition to the sprites had been made, the additional text was used such that larger numerals could be used void dTemp(int celc)//inputs degree Celsius {//this could be a 3 digit value int temp; if(celc < 10)//one digit number

Page 28

TSE-VGA Technical document
{ GD.sprite(25,3*x,y*17+5,dig+celc,0,0); GD.sprite(26,3*x,y*18+5,dig+11+celc,0,0); GD.sprite(27,2*x,y*17,dig+11+celc,255,0); GD.sprite(28,2*x,y*18,dig+11+celc,255,0); GD.sprite(29,1*x,y*17,dig+11+celc,255,0); GD.sprite(30,1*x,y*18,dig+11+celc,255,0); return ; } if(celc <100)//2 digit number { temp = celc/10; GD.sprite(25,3*x,y*17,dig+temp,0,0); GD.sprite(26,3*x,y*18,dig+11+temp,0,0); temp = celc%10; GD.sprite(27,2*x,y*17,dig+temp,0,0); GD.sprite(28,2*x,y*18,dig+11+temp,0,0); GD.sprite(29,1*x,y*17,dig+11+celc,255,0); GD.sprite(30,1*x,y*18,dig+11+celc,255,0); return; } //by default, we display a 3 digit number temp = celc/100; GD.sprite(25, 1*x,y*17,dig+temp,0,0); GD.sprite(26, 1*x,y*18,dig+11+temp,0,0); celc = celc%100; temp = celc/10; GD.sprite(27,2*x,y*17,dig+temp,0,0); GD.sprite(28,2*x,y*18,dig+11+temp,0,0); temp = temp%10; GD.sprite(29,3*x,y*17,dig+temp,0,0); GD.sprite(30,3*x,y*18,dig+11+temp,0,0); }

Page 29

TSE-VGA Technical document
IV. Display RPM This function had been excluded from the previous version due to cancellation but in this project, it displays well using the normal numerals shown in Fig 4.1 void dRPM(int rpm) {//RPM is only between 0 to 99, a multiplier has been put onto the display background as x100 int temp; if(rpm>=10) { GD.sprite(23, 11*x+3, 14*y, 11,0,0);//display 0 by default GD.sprite(24, 11*x+3, 14*y, 11+rpm,0,0); return ; } temp = rpm%10; GD.sprite(23, 11*x+3, 14*y, 11+temp,0,0); temp = rpm/10; GD.sprite(24, 10*x+3, 14*y, 11+9emp,0,0); } V. Display speed

This function also like the temperature display function uses larger font to display the numbers. void dSpeed(int s)//display speed sprites { //speed sprites are displayed at the center using the larger font //larger font sprite identities start at sprite number 22 and 11 is added for the bottom half of the sprite int temp; if(s < 10)//one digit number { GD.sprite(18,11*x+1,y*11+5,dig+s,0,0); GD.sprite(19,11*x+1,y*12+5,dig+11+s,0,0); GD.sprite(17,10*x+1,y*12+5,dig+11+s,255,0); GD.sprite(16,10*x+1,y*11+5,dig+11+s,255,0); GD.sprite(15, 9*x+1,y*12+5,dig+11+s,255,0); GD.sprite(14, 9*x+1,y*11+5,dig+11+s,255,0); return ; }

Page 30

TSE-VGA Technical document
if(s <100)//2 digit number { temp = s/10; GD.sprite(17,10*x+1,y*11+5,dig+temp,0,0); GD.sprite(16,10*x+1,y*12+5,dig+11+temp,0,0); temp = s%10; GD.sprite(18,11*x+1,y*11+5,dig+temp,0,0); GD.sprite(19,11*x+1,y*12+5,dig+11+temp,0,0); GD.sprite(15, 9*x+1,y*12+5,dig+11+s,255,0); GD.sprite(14, 9*x+1,y*11+5,dig+11+s,255,0); return; } //by default, we display a 3 digit number temp = s/100; GD.sprite(15, 9*x+1,y*11+5,dig+temp,0,0); GD.sprite(14, 9*x+1,y*12+5,dig+11+temp,0,0); s = s%100; temp = s/10; GD.sprite(16,10*x+1,y*11+5,dig+temp,0,0); GD.sprite(17,10*x+1,y*12+5,dig+11+temp,0,0); temp = s%10; GD.sprite(18,11*x+1,y*11+5,dig+temp,0,0); GD.sprite(19,11*x+1,y*12+5,dig+11+temp,0,0); } VI. Display battery

The battery display worked very much similar to the project TSE-VGA V1.5 but this time it had to display the individual batteries as well and thus had additional input data void dBatt(int b1, int b2, int b3, int b4, int bt)//battery life display {//battery values must be between 0 to 10 //all batteries have a resolution of 10 //input values must be between 0-9!!! int temp; //display mini batteries GD.sprite(10,23*x,18*y,9-b4,0,0);//disp B4 GD.sprite(11,23*x,16*y,9-b3,0,0);//disp B3

Page 31

TSE-VGA Technical document
GD.sprite(12,23*x,14*y,9-b2,0,0);//disp B2 GD.sprite(13,23*x,12*y,9-b1,0,0);//disp B1 for(temp = 0; temp<bt; temp++) { GD.sprite(temp,25*x+1, (18-temp)*y+2, 10, 0,0); } for(temp = 10; temp > bt; temp --) { GD.sprite(temp-1,28*x+1,(18-temp)*y+2,45,0,0); } } VII. Display compass

The compass function required the most logical set of thoughts to compile, to ease the logistics involved in this function, the use of papers for side notes were a big help. Note the commentary on the function for step by step understanding to the function void compass(int ang)//input angle with 0 representing north { float h, v;//horizontal and vertical int u, s;//up-down and sideways //must ensure there is no negative values, they cause problems... stick to simplicity //KNOW YOUR TRIGONOMETRY! while(ang>360) { ang = ang-360; } if(ang <= 90) { v = (cos(ang*PI/180)); h = (sin(ang*PI/180)); GD.sprite(20,(22*x)+(h*10)-2,(3*y)-(v*10)-1,21,0,0); GD.sprite(21,(22*x)+(h*20)-2,(3*y)-(v*20)-1,21,0,0); GD.sprite(22,(22*x)+(h*30)-2,(3*y)-(v*30)-1,21,0,0); return; } if(90<ang<=180) { ang = ang-90; v = (sin(ang*PI/180)); h = (cos(ang*PI/180));

Page 32

TSE-VGA Technical document
GD.sprite(20,(22*x)+(h*10)-2,(3*y)+(v*10)-1,21,0,0); GD.sprite(21,(22*x)+(h*20)-2,(3*y)+(v*20)-1,21,0,0); GD.sprite(22,(22*x)+(h*30)-2,(3*y)+(v*30)-1,21,0,0); return; } if(180<ang<=270) { ang = ang-180; v = (cos(ang*PI/180)); h = (sin(ang*PI/180)); GD.sprite(20,(22*x)-(h*10)-2,(3*y)+(v*10)-1,21,0,0); GD.sprite(21,(22*x)-(h*20)-2,(3*y)+(v*20)-1,21,0,0); GD.sprite(22,(22*x)-(h*30)-2,(3*y)+(v*30)-1,21,0,0); return; } if(270<ang<=360) { ang = ang-90; v = (cos(ang*PI/180)); h = (sin(ang*PI/180)); GD.sprite(20,(22*x)-(h*10)-2,(3*y)+(v*10)-1,21,0,0); GD.sprite(21,(22*x)-(h*20)-2,(3*y)+(v*20)-1,21,0,0); GD.sprite(22,(22*x)-(h*30)-2,(3*y)+(v*30)-1,21,0,0); return; } } 7) Conclusion The success of this project was one acquired by countless hours of trial and error, after all, I believe that any Gameduino project will require plenty of trial an error where the key ingredient was persistence. For the full source code of this version, please consult the text in Appendix D Section 2 where all the project files for this version has been archived.

Page 33

TSE-VGA Technical document
Chapter 5 – Bibliography
Websites used for this projects are enlisted below - http://en.wikipedia.org/wiki/Arduino - http://arduino.cc/en/Main/ArduinoBoardUno - http://arduino.cc/en/Guide/UnoDriversWindowsXP - http://www.batee.com/projects/electronics/creating_gameduino_sprites - http://tilestudio.sourceforge.net/ - http://gameduino.com. - http://excamera.com/files/Gameduino/synth/doc/gen/poster.pdf - http://gameduino.com/tools/ - http://www.batee.com/projects/electronics/creating_gameduino_sprites - http://excamera.com/sphinx/gameduino/samples/chessboard/index.html

Page 34

TSE-VGA Technical document
Appendix A – Arduino programming tutorial

1) Introduction – the Arduino UNO REV 3

“Arduino is an open-source electronics prototyping platform based on flexible, easy-to-use hardware and software. It's intended for artists, designers, hobbyists, and anyone interested in creating interactive objects or environments.” - Arduino team Homepage (http://arduino.cc )
There are numerous Arduino development boards that offer simplicity to programming micro controllers. Upon a list development boards, the Arduino UNO is one most common that has been revised multiple times until the Arduino UNO REV 3 had been developed as the latest board by February 2012. The Arduino UNO REV 3 has been selected due to the numerous open source examples found on the internet ranging from the Arduino playground (http://arduino.cc/playground/) to other pages out of the Arduino website (http://excamera.com/sphinx/gameduino/). The simplicity of these tutorials makes an excellent resource for a post beginner student to learn Arduino principles. The following list shows you a summary of the Arduino UNO • Microcontroller: ATmega328 • Operating Voltage: 5V • Input Voltage (recommended) 7-12V • Input Voltage (limits) 6-20V • Digital I/O Pins 14 (of which 6 provide PWM output) • Analog Input Pins 6 • DC Current per I/O pin 40mA • DC Current for 3.3V Pin 50mA • Flash Memory 32KB (ATmega328) of which 0.5 KB used by bootloader • SRAM 2KB (ATmega328) • EEPROM 1KB (ATmega328) • Clock Speed 16Mhz 2) Schematics The Arduino UNO REV 3 is a standard board with port expansions and standard circuits ready for use. The following schematic was obtained from the following link http://arduino.cc/en/uploads/Main/Arduino_Uno_Rev3-schematic.pdf

Page 35

TSE-VGA Technical document

Page 36

TSE-VGA Technical document
3) I/O pins In the Arduino UNO rev 3, there are 14 digital pins that are ready for inputs and outputs. In the programming mode, they can be set using the command pinMode(), and they can be controlled by using the command digital Write(), all pins are limited to 40mA output current and has internal pull up resistors which are disconnected by default. Some pins have additional functions that serve a higher purpose such as the following

• • • •

• •

Serial: 0 – RX; 1 – TX, used for serial communication UART or RS protocols External interrupts: 2;3, these pins can be configured as normal interrupts and can be set to trigger in different conditions such as rising edge or falling edge etc. PWM: 3; 5; 6; 9; 10; 11, these pins provide an 8 bit PWM output SPI: 10 (SS); 11(MOSI); 12 (MISO); 13 (SCK), these pins support SPI communication using the SPI library, the Gameduino (explained in Appendix B) uses these pins for inter-board SPI communication. LED: 13, this pin is connected to an LED on the board for trouble shooting purposes. When the pin is high, the LED switches on. Analog: the Arduino UNO has 6 analog inputs labeled A0 to A5 clearly marked on the board pins with a resolution of 1024 bits. RST: there is a reset button onboard that restarts the microcontroller from start off the program that is helpful to debugging.

These pins can be combined and used for numerous applications involving a cocktail of sensors or simple singular sensors for smaller projects. Additional texts can be viewed in Appendix D from texts D.3.2 to D.3.5 for basic understanding of the input and output principles. 4) The Arduino platform The Arduino platform is the key ingredient to simplifying the development of micro controllers, this platform requires simple programming knowledge that shaves off any complicating common hardware clashes that can cause fatal errors that baffles most programmers leaving them spending hours debugging and looking for a simple syntax glitch. The Arduino platform can be easily downloaded from the Arduino website and it includes most common libraries that a developer will need. The following link will provide the platform download http://arduino.googlecode.com/files/arduino-1.0.1-windows.zip The download page is the following in case using a different operating system than windows http://arduino.cc/en/Main/Software

Page 37

TSE-VGA Technical document
Browsing the website, there are many libraries for different applications that might need additional components, but all relevant resources are readily available on the site, whilst when using shields, there are libraries or datasheets on the websites that distribute them. The Arduino platform is a copy and paste program that requires a bit of management before it can be used. Follow the following instructions to install your Arduino platform:

• • • • •

• • • •

Download the platform from the Arduino website Paste in your drive, choose a folder near your root folder, avoid multiple sub folders Plug in your Arduino UNO REV 3 board and wait for your computer to detect hardware Go to Start->right-click “My Computer”->Manage, your computer management window will show up Navigate to device manager on the left pane, it will show you a list of all hardware connected to your computer. Look under ports(COM &LPT). You should an open port named “Arduino UNO (COMXX)”, where XX represents the port number which is usually 03 Right click on the “Arduino UNO (COMXX)” device and choose the “Update Driver Software” option Thereupon, if prompted to automatically search the drivers, refuse and select to browse manually Manually navigate to your Arduino folder and continue to the subfolder “Drivers”, search for the file named “ArdunoUNO.inf” Windows will then install the drivers to recognize your board.

Step by step screen shots can be viewed in the following link: http://arduino.cc/en/Guide/UnoDriversWindowsXP After installing your platform, the user is required to setup the Arduino platform to use for his/her own board.

• •

Set up your board. Open the application and navigate to Tools->Board->Arduino Uno. Set up your port. The Arduino board uses serial programming that is received from you USB, this programs your board. The port is defined in your device manager as set up before. Select that port by navigating on your Arduino platform application as Tools->Serial Port->COMXX.

After your Arduino has been set up, you are now free to program your board, above your code, there is a panel with common buttons that looks as follows:

Fig A.1: Arduino programming panel of Arduino 1.0 The above panel is used as a compiler control panel that the user can utilize for ease of access to common buttons. Follow the following list for the function of each button

Verify – this button confirms if no syntax errors have occurred

Page 38

TSE-VGA Technical document
Upload – this button verifies the code, converts it to hex language and uploads it onto
your board

New – opens new Arduino project

Open – opens existing project Save – saves current project
After completing installation and familiarizing yourself with the basic platform of Arduino, you are now ready to program your Arduino. 5) Basic and relevant programming commands There are many commands that are listed in the Arduino header files that can be used for development. These functions can be explored in the Arduino platform help link that stores the web pages with links to all the standard functions. Here is a list of all the basic functions that are relevant to this document. More functions can be found on the following page: http://arduino.cc/en/Reference/HomePage

• • • • • • • •

Setup() o Used as a one shot program that will not loop itself over and over again o Essential function that is required for all Arduino sketches Loop() o Function that contains all functions and operations that are intended for repetitive execution o Essential function that is required for all Arduino sketches For(;;) o Standard for() loop used in C++ programming If() o Standard if() condition used in C++ programming Switch() case: o Standard Switch statement used in C++ programming Break o Standard break statement used in C++ programming Delay() o Predefined function in Arduino.h pinMode() o setup function that sets input or output mode for a pin DigitalWrite() o Write boolean data to a pin DigitalRead() o Read Digital status of a pin

Page 39

TSE-VGA Technical document
• • • • • •
AnalogRead() o Read analog value of an ADC AnalogWrite() o Write analog value to a PWM Delay(int t) o Predefined function that stalls program. Input data t is time in microseconds Sin() o Trigonometric function SIN Cos() o Trigonometric function COS Random() o Returns a random number, must also seed a random number

As seen above, many functions are the same as C++ functions that one would learn in basic C programming, more common functions such as functions included in the math.h library can also be used for it is included in the Arduino platform “include” folder. One should browse the web page shown above in case you are not very familiar in C programming. All functions provide a link to examples on how to use them. One should study them briefly to grasp the concept and utilize them accordingly. 6) Additional exercises After carefully following this appendix, it is vital that the new Arduino programmer instantly familiarize himself with example coding supplied in the examples options in Arduino that can be found by navigating in the application as follows: File->Examples, there are many examples that are very important for further development, it is advisable that all examples are studied briefly, however, studying the following examples will ensure better understanding of this entire documents core programming.

Basics o BareMinimum: this example explains the basic requirements of an Arduino sketch o Blink: explain the setup and data setting o DigitalReadSerial: helps you communicate with your computer serially. Use the serial monitor read the state of a button o AnalogReadSerial: send analog data from the ADC serially to a computer and receive data from the computer o Fade: using the PWM function, control the light intensity of you LED o ReadAnalogVoltage: reads analog voltage and sends to your serial monitor Digital o BlinkwithoutDelay: blinking LED without using the delay() function o Button: simple program to check the status of a button that is pressed o Debounce: using delays to avoid switch bouncing errors o StateChangeDetection: detecting a toggle change Analog o AnalogInOutSerial: serial analog data transfer

Page 40

TSE-VGA Technical document
o o AnalogInput: analog data reading Fading: Analog output

There are plenty more exercises that one can exercise to polish their skills, however, a debugging board is necessary to have. A few of these exercises have been added in Appendix D in the extra text section. 7) Debugging tools To practice or debug your Arduino, you will need simulated values, buttons and status LEDs connected to your board. This enables you to explore all examples with ease. Making this debugging board should be considered and made very well because of future uses, using the guidelines of Arduino shield standards. During our period in TSE, we were each asked to make an Arduino debugging board of which the following images show an example of my own debugging board.

Fig A.2: Arduino debugging board bottom side

Fig A.3: Arduino debugging board top side
Users are encouraged to design their own debugging boards.

Page 41

TSE-VGA Technical document
Arduino is an excellent development board and can be considered for experimental applications. Although this may not be useful in large markets, the use of Arduinos is not limited by market uses. It is an inexpensive board in relation to its capabilities and holds a massive value to the future in embedded design.

End of Appendix A

Page 42

TSE-VGA Technical document
Appendix B – Gameduino essentials
1) Introduction Through research, multiple shields were discovered that offered similar services such as the Gameduino but none of these are as dedicated to the application as much as the Gameduino itself. The Gameduino shield uses simple graphics logistics that can be recognized universally as a similar protocol with its principles such as sprite graphics and background graphics. However, although it is one of the best rated shields in its category (graphics displays), this shield still has its limits. Amongst research, another shield was discovered that provided VGA graphics display, THE SeCons, microVga controller that is a much more basic controller that allows the user much more freedom to add and cut off features that one might not use. This board promises much more accessibility but the simplicity of its usage is not promised where the Gameduino offered a much simpler interface that allowed more time concentrating on artistic development. The Gameduino is a shield specified to be used with the Arduino uController and is therefore customized for all Arduino operations. The onboard FPGA uController has been programmed to control the VGA adapter by receiving simple commands that have been developed for this application. The functions in the Gameduino mimic applications in the real world gaming industry such as sprite graphics and background graphics. Text displays are partially faulty but can be managed around. The Gameduino, despite its limitations, offers many solutions to the project at hand and accomplishes it well. The Gameduino developers were kind enough to make their entire work open source. All details of the shield are readily available on their site: http://gameduino.com. 2) The Gameduino shield The Gameduino offers many qualities, but all of which have limits. The following Data has been extracted from the Gameduino website, poster and datasheet which can be found in the following site: http://excamera.com/files/Gameduino/synth/doc/gen/poster.pdf The Gameduino shield offers many qualities that briefly enlisted n the memory map image illustrated in the poster. The Sprite control registers are a key part of the Gameduino shield and is therefore explained thoroughly in the poster, after being shown in the memory map. This poster proves to be a valuable resource to anybody using this shield. The Gameduino poster displays a mind map illustrating the different parts of the Gameduino shield with a hierarchical format. The Gameduino Memory map (as shown below in Fig B.1) The following photo, extracted from the Gameduino poster shows the memory bank of the Gameduino FPGA microcontroller

Page 43

TSE-VGA Technical document

Fig B.1 the Gameduino memory map extracted from the Gameduino official poster
As shown in the memory map, there is a small section titled sprite control. The sprite control is a key and comprehensive section in Gameduino that holds a few key functions in the operation of the shield. A table is shown of its contents in the Gameduino poster.

Page 44

TSE-VGA Technical document

Fig B.2, Sprite control registers and informations.
3) Memory Map and background The background memory in the Gameduino is divided into 3 parts - A 64x64 character screen - Character data of 8x8 pixel, 256 of them - Character palettes, 256 characters of 4 colors

Page 45

TSE-VGA Technical document TSE
This screen is very dynamic in the sense that when you use a lesser variety of color, you can use more lesser characters for the display, keep in mind that the screen resolution is 400x300 pixels while the available memory allows an image of 512x512 pixels, and the screen scrolls over the remaining pixels. The background image does not entirely store into memory but rather the background is divided into e characters of 8x8 pixels and repetitive characters are stored once and used over and over again, therefore using images with many changes on them such as photos is not an ideal usage for the Gameduino. In this project, certain functions such as scroll or character coding is not necessary to learn, but reading the Gameduino poster will help understand the elements of this shield. In the memory map, you can also view the control registers in your RAM, the control registers hold settings that you have set for your Gameduino. Rest assured that the default settings are clearly identifiable for when you require altering them, you can find them in a clear look up table or by browsing the header file functions in your Gameduino folder which is included in this document in Appendix Text D.3.1, GD.H, the original Gameduino header file. VGA In the project TSE-VGA V2.2, we no longer use text, but rather use a background with text drawn onto it. A background had to be drawn using Microsoft Paint, since Microsoft Paint is one of the most . basic image creating and editing tools. The following images were created to satisfy the background needs in the project:

Fig B.3, basic background used for project TSE-VGA V2.0
The above image was one of the early adaptations of the project. Consider the following process, the image is divided into characters of 8x8 pixels, every pixel that is identical, will be re used, and every new pixel is then stored into memory and perhaps used again if the same character is recognized to elsewhere in the image. A better illustration is represented in the next images.

Page 46

TSE-VGA Technical document TSE
In the project TSE-VGA V2.2, the following image was used: VGA

Fig B.4, the final project complete background including missing data background
Since in the Gameduino source code, there is no way for us to directly upload a .PNG image, this image has to convert into hex code and then put into a look up table for the program to recognize it. The first step is to draw the image and keep in mind to repeat characters, use drawn scales to count the pixels as you draw the image. The image under construction in my project looked something like this:

Fig B.5, background image of project TSE-VGA V2.1 under construction TSE VGA Page 47

TSE-VGA Technical document
In the paint procedure, the designer has to observe certain constraints such as image resolution, the image resolutions have to be multiples of 8, when editing the original image, the resolution that I had drawn in is shown in the bottom corner of Microsoft Paint as the following image shows

Fig B.6, resolution of the image used in the background
This resolution is the best to use in the Gameduino; it is just the right length and width and is accepted by the Gameduino tools web site. This image is saved and thereafter submitted to the Gameduino tools web page:

Fig B.7, the Gameduino tools web page
Select option 1; “A background image encoder”, follow the instructions as shown in the following image

Page 48

TSE-VGA Technical document

Fig B.8, background image upload page
Click Browse and navigate to the background image you have just created, you may name the output code file. When an image is uploaded, the following page will appear, pay good attention to the following image:

Page 49

TSE-VGA Technical document TSE

Fig B.9, background image converted,
As shown in the above image, whenever the user mouse over one of the characters displayed in the bove smaller block next to the image block, the certain character under the mouse will highlight the corresponding character in the image and vice versa when the mouse is over the image. As shown above, the mouse is over the first character, character code 0, and this is indicated under the image and shown how many times this character is used in this image. Furthermore, the corresponding text is displayed in the tab named image.h, the file image.pde is a sample program that will display all the sprites on the screen, for testing purposes, the designer can ram copy and paste the entire project into an Arduino project to test.

Page 50

TSE-VGA Technical document
Finally, the background image has been converted into hex code; the code should be copied from the image.h tab into a text file and saved into a header file in the same folder as the project folder. As shown in Appendix D, Text D.2.3 (the background file), the image has been coded and ready to be included in the program. The background code has to be included into the main program using functions in the setup function of your Arduino project. Consult the following codes found in Appendix D, Text D.2.1 (TSE-VGA V2.2), there you will find the following code: 1. #include <SPI.h> 2. #include <GD.h> 3. //24 4. #include "image.h" 5. #include "sprite.h" 6. //the rest of the program has been cut off 7. void setup() 8. { 9. GD.begin(); 10. //background 11. for (byte y = 0; y < 38; y++) 12. GD.copy(RAM_PIC + y * 64, image_pic + y * 50, 50); 13. GD.copy(RAM_CHR, image_chr, sizeof(image_chr)); 14. GD.copy(RAM_PAL, image_pal, sizeof(image_pal)); 15. //sprites 16. GD.copy(RAM_SPRPAL, sprite_sprpal, sizeof(sprite_sprpal)); 17. GD.copy(RAM_SPRIMG, sprite_sprimg, sizeof(sprite_sprimg)); 18. // For show, randomly scatter the frames on the screen 19. /* GD.__wstartspr(0); 20. for (intanim = 0; anim< SPRITE_FRAMES; anim++) 21. draw_sprite(random(400), random(300), anim, 0); 22. GD.__end();*/ 23. } Note that in line number 4, the background is included, and in line number 11 to line number 14, the background is uploaded into memory As shown above, the background had been implemented to the project TSE-VGA V2.2. 4) Sprites (foreground) Sprite memory is divided into 3 parts Sprite control, stores all sprite settings like sprite ID, rotation and collision settings Sprite palette, stores sprite color palette data

Page 51

TSE-VGA Technical document
64 sprite images.

All sprites allow transparent colors which is a key factor to the difference between the project software code versions V1.5 and V2.2

Fig B.10, sprite control information from Gameduino poster
Sprites support transparent color and therefore when they are displayed, they do not show white blocks around them marking the area on which they were drawn. Texts however, as mentioned in the next part of this Appendix, create blocks around each character which disturbs the graphics.

Page 52

TSE-VGA Technical document
The reader should go through Appendix C before reading through the following article to learn how to acquire a PNG image of their sprites. In Appendix C, the tutorial shows how to create a sprite graphics PNG image, once a designer has completed all his graphics using Tile Studio, he can convert the graphics to code. In Gameduino, all images are converted to code (hex format), this code samples are on Appendix D, Text D.1.2 (for software version 1.5) and Text D.2.2 (for software version 2.2) through the use of the tools provided on the Gameduino web site as shown above in Fig B.7.When converting sprites into sprite graphics code, click on the Sprite sheet encoder link. After completing your .PNG image as shown in Appendix C, will convert it in this appendix. Follow the link and view the following page:

Fig B.11, sprite sheet converter page in Gameduino.com/tools
Click Browse and navigate to your sprite image. Using my image for the project, I uploaded the sprites drawn for the project TSE-VGA V2.2.

Page 53

TSE-VGA Technical document TSE

Fig B.12, sprites used for project TSE-VGA V2.2 TSE
These sprites were uploaded and decoded in the web page provided by Gameduino the code found Gameduino, in the text Appendix D, Text D.2.2 is the resulting generated code. 5) Text in Gameduino Although text is only used in previous versions, it is a vital element to the use of Gameduino programs. Sometimes it may happen that you require a less graphical display or you may have made provision for texts to be displayed with the background, the use of text will be readily available after understanding how to use it. Functions for text are very simple, the Arduino screen allows a resolution of a length 50 characters X height 37 characters. The following functions simplify the use of texts in Gameduino projects and are all defined in Appendix D, Text D.3.7 (GD.h):

static void putstr(int x, int y, const char *s);// can be used to put string at an x and y *s);// coordinate
In the function above, you are required to input a x and y coordinate and insert a string that you may write manually or refer with a variable string. Sometimes however, you are required to write a variable number that you do not know yet; this requires the designer to convert the integers into string that is able to be displayed. I had made use of the following function for such functions

sprintf(temp, "%d", deg);//example line extracted from TSE-VGA V1.5 //example TSE VGA
The use of the above function allows the conversion from an integer variable (temp) scanned into a string variable (deg). For further understanding in the process of displaying, please observe Appendix D, Text D.1.1, for it uses these functions extensively.

End of Appendix B

Page 54

TSE-VGA Technical document
Appendix C - Tile Studio
1) Introduction In this project, multiple programs were experimented on, after tireless searches on the internet, a simple tutorial was found at the following address: http://www.batee.com/projects/electronics/creating_gameduino_sprites This page shows a simple Gameduino user tutorial that describes the process to creating sprites using links to websites and software such as Tile Studio. Tile Studio is simple freeware software that is ready for download. It is a copy and paste software so it does not need any registry coding or installation. Although this proves to is a problem with file association to projects saved on windows. Associations can be made by right clicking a project and selecting the open with option, then navigating to the Tile Studio folder in your hard disk and select TS.exe (the Tile Studio program). After file associations, you are now able to save and relate projects created in Tile Studio. An example project will be the tiles created in the TSE-VGA V 1.5. In this project, the first successful tiles were created in an earlier project but were properly implemented in this project. The tile project became simpler to me gradually and this is how I did it 2) Tile Studio download Tile Studio is freeware tile maker software developed by Wiering software and is a freeware. This program is not so widely used but still serves a very good sprite making program. Tile Studio is available in Soureforge.net and is readily downloadable through the following link. http://tilestudio.sourceforge.net/ (Website address may change in future, it is better to search for it in Google) The content that is downloaded will be a zipped folder. This folder can be extracted and placed in a folder wherever you wish. This folder will hold your software and since it is not an installable program, a shortcut to the program could be made to our desktop manually. 3) Tile Studio user interface In the Tile studio program, there are numerous features that can be used for sprite graphics. As the author of this document, I had only been introduced to the most basic functions that are essential to the making of sprites. Sprite making requires a few aspects that are offered in Tile Studio, such as the following:

New file, open file, save file etc. - The basic file navigation and operations that are used in usual project creating programs.

Page 55

TSE-VGA Technical document

Fig C.1 – Tile Studio basic files operations. New Tile Set - Opens a window where a new tile set can be created, a tile set is a collection of graphical tiles that are drawn as a set. In Gameduino, these tiles are referred to as sprites, a tile set is a collection of sprites. The tile set will have identical parameters such as color palettes and sprite resolutions. The Gameduino doesn’t necessarily have any limitations regarding the color palettes as long as all tiles in the set use the same palette as a reference

Fig C.2 – upon clicking File->New Tile Set, a window prompts you to set up your tile set. Palette Manager - The Palette manager (refer to the palette definition in Definitions in Chapter 1.4 before reading this) is a configuration that the user has to navigate to before continuing with his/ her designs. Configuring this option will allow the designer to restrict the amount of palettes used in each sprite, even though the Gameduino can display a massive variation of colors, the less variations of colors used means the less references to new colors are needed. This means that if you set your color palette to have 256 different colors, your color palette will only occupy 256 different colors, and of those 256, any color that is not used, will not be included into the resulting graphics. - Also note the option of smooth palette, this option should be unselected whereas it is activated by default and will cause certain palette confusion which leads to many new palettes to be referenced where each color is used only once and a similar shade of that

Page 56

TSE-VGA Technical document
same color takes up a new palette. Palette management is meant for memory management, the size of the palette might not matter in smaller projects such as the one being developed in this document, but memory constraints should be considered once the designer decides to make a larger more graphical project.

Fig C.3 - selecting the palette manager

Fig C.4 - the Palette Manager window

Page 57

TSE-VGA Technical document
Tile
Tiles are graphical drawings of different sprites, in Tile Studio, when you build a new tile set, all your tiles are grouped into a single project and these tiles are navigated through the tile function in the tool bar. Note the short cuts for ease of access.

Fig C.5, tile menu
There are multiple navigational options, when you click on next; a new tile will appear at the bottom of your project on the tile pane as shown on the following page. Note not to confuse yourself with the tabs at the bottom, the tabs represent different tile sets and not tiles individually. The tile is drawn in sequence in miniature blocks

Page 58

TSE-VGA Technical document

Fig C6, different tiles in a tile set Drawing tools - The drawing tools are shown on the side and work like any general yet basic drawing program. Functions range from the normal pencil to faded effects or color fill.

Fig C.7 drawing panel showing all drawing tools on the left
Using the above basic functions, it was possible to draw the basic tiles required for the graphics used in the project in this document. Advanced graphics was not required, therefore basic skills in paint was enough. 4) An example The following drawing is an example on the sequence of operations followed when drawing graphics for this project. Screenshots were taken and pasted on the document.

Page 59

TSE-VGA Technical document
a) Creating a new tile set I. Go to File-> New Tile Set… II. A window will appear requesting parameter to the new tile set, refer to Fig C.2, set tile width and length to 16 pixels You may choose to close the previous tile set which is tabbed at the bottom as III. shown in the following figure

Fig C.8 tile sets, Tiles1 is the default tile set with previous tile settings
Click on the Tiles1 tab and go to File->Remove Tile Set, you Tiles2 project will be the only one left. b) Palette settings I. Go to Palette->Smooth Palette and disable the Smooth Palette option. II. Once smooth palette has been disabled, you have an active color palette, each color also has different color depths, therefore you can choose how dark or how light each color should Be

Fig C.9, color bar with color intensity

Page 60

TSE-VGA Technical document
c) Drawing I. For example, let us draw an empty battery, select the pencil tool from the drawing tools pane and select a color. Click the screen on the center to appreciate the size of a pixel

Fig C.10 empty work space

Page 61

TSE-VGA Technical document
Fig C.11 work space with drawings, pixel blocks in the center
II. Assuming the spacing, draw the battery similar to the following drawing:

III.

Fig C.12, Full battery drawing for one tile After completing the first tile on your tile set, go to Tile-> Next Tile or simply click on the Right Arrow, at the bottom pane, a new empty tile will appear and your previous one will have been stored in the project, it is advisable to save as often as you can, there is no significant project backup built in Tile Studio

Fig C13, bottom left corner, the pane shows a new tile
IV. Draw a sequence of all the tiles you wish to display as sprites in your Gameduino, a simple exercise would be to draw the battery in different power levels, decreasing one pixel at a time, after you have completed that, at the bottom, you should have the following sequence of tiles

Fig C.14, bottom left corner, the pane shows all tiles completed. These tiles are ready to be exported

Page 62

TSE-VGA Technical document
d) Exporting to a PNG I. As shown in Appendix B, to convert a PNG to sprite graphics, you must first have an image of the right amount of pixels in length and width. As the website suggests (http://Gameduino/tools/sp), the PNG image width and length has to be in multiples of 16 pixels for conversion to take place. The reason why a .PNG file extension is used is because images in this format do not suffer pixilation or compress when you save it. The image is ideal for sprite graphics as it gives you complete control of all pixels in your graphics. II. After completing your project, save it. To export the graphics simply click on the following: File-> Export Tiles. A export window will appear, set the settings as follows (these settings are suggested in the mentioned tutorial at the beginning of this Appendix)

Figs C.15, the Export Tiles window, note the transparent color at the bottom right corner, you may choose to set it or not
III. After the export Tiles window is set, you will be requested where to save the image, ensure that you choose a PNG file format when saving, follow the following image as a light guide

Page 63

TSE-VGA Technical document TSE

Fig C.16, saving exported data into a PNG image
IV. The final exported image should look like the following image

Fig C.17, exported final product of tiles and ready for conversion to sprites
5) Conclusion In essence, this is a simple program, the tutorial mentioned in the beginning of this Appendix explains the process very well, additional experience has been narrated into this appendix, but certain things were not yet mentioned such as shortcuts. Valuable short cuts in this program are those such as

Right Click – sample color (any color on any tile can be sampled to save the user from using a different color each time he/she wants to select a color, this avoids using too many colors and also increases working speed of the designer) Left, right key – navigate back and forth between tiles. If you are in the last tile in the project, a new tile will open at the end of the project

Page 64

TSE-VGA Technical document
Ctrl+ (up, down, left or right key) – shift the tile drawing (excluding the transparent color) to the left or right. Sometimes, it happens that a tile is drawn and the pixels are not matched to the previous tile, this tile may need to be shifted up or down, it is simple to do so with this function Ctrl+ Shift (Left or Right) – move an entire tile through the sequence of tiles. If the sequence of your tiles is not correct, you need to rearrange the tiles. This function is useful and will probably be best used just before exporting graphics.
There are a few more short cuts that the user can familiarize him with that can enhance their performance and ease of use in this program, after all, this is a very user friendly program and has helped this project very well.

End of Appendix C End of Document

Page 65

Sign up to vote on this title
UsefulNot useful