VISVESVARAYA TECHNOLOGICAL UNIVERSITY

A MINI PROJECT REPORT

On

GRAPHICS EDITOR USING OPEN GL

Submitted in partial fulfillment of the requirements for the award of the degree of

Bachelor of Engineering
in

Computer Science & Engineering

by

Name: USN:

NIKHIL. R
1BG07CS054

Under the guidance of Prof. B.S Umashankar

Professor, CS&E Department

BNM Institute of Technology

Vidyaya Amrutham Ashnuthe

Department of Computer Science & Engineering

B. N. M. Institute of Technology
12th Main, 27th Cross, Banashankari II Stage, Bangalore 560 070.

2010

Computer Graphics Editor using OpenGL

B. N. M. Institute of Technology
Department of Computer Science & Engineering
12th Main, 27th Cross, Banashankari II Stage, Bangalore - 560070

Vidyaya Amrutham Ashnuthe

Certificate
Certified that the mini project work entitled GRAPHICS EDITOR carried out by Mr./ Ms. NIKHIL R , USN [1BG07CS054] bonafide student of B. N. M Institute of Technology in partial fulfillment for the award of Bachelor of Engineering in Computer Science & Engineering of the Visvesvaraya Technological University, Belgaum during the year 2010. It is certified that all corrections / suggestions indicated for Internal Assessment have been incorporated in the report deposited in the departmental library. The mini project report has been approved as it satisfies the academic requirements in respect of mini Project work prescribed for the said degree.

Dr.B.G Prasad Prof and HOD CS&E Dept

Prof. B.S Uma Shankar, Professor, CS &E Dept

Name of the Examiners 1. 2.

Signature with date

Page | 2 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

ACKNOWLEDGEMENT
I consider it a privilege to whole-heartedly express our gratitude and respect to each and everyone who guided and helped us in the successful completion of this project.

would

greatly

mention

the

enthusiastic

influence

provided

by

Prof.B.S.UMASHANKAR, Project Guides, for their ideas and co-operation showed on

me during my venture and making this project a great success.

I am also thankful to Prof. D.G.PRASAD HOD, Department of Computer Science, for his co-operation and encouragement at all moments of my approach.

I am very thankful to the Director, Prof T.J.Ramamurthy and Principal, Dr.Udaykumar ,BNMIT, Bangalore, for being kind enough to provide me an opportunity to work on a project in this institution.

I would also like to thank our parents and well wishers as well as our dear classmates for their guidance and their kind co-operation.

Finally, it is a pleasure and happiness to the friendly co-operation showed by all the staff members of computer science department, BNMIT.

NIKHIL. R 1BG07CS054 6th Sem A sec

CONTENTS
Page | 3 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

INTRODUCTION REQUIREMENT SPECIFICATION ( Analysis) SYSTEM DESIGN IMPLEMENTATION

FINAL PROJECT TESTING RESULTS CONCLUSION and FUTURE ENHANCEMENTS BIBLIOGRAPHY

INTRODUCTION ON OPEN GL
Page | 4 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

. OpenGL is an open specification for an applications program interface for defining 2D and 3D objects. The specification is cross-language, cross-platform API for writing applications that produce 2D and 3D computer graphics. It renders 3D objects to the screen, providing the same set of instructions on different computers and graphics adapters. Thus it allows us to write an application that can create the same effects in any operating system using any OpenGL-adhering graphics adapter. Computer graphics, a 3-dimensional primitive can be anything from a single point to an n-sided polygon. From the software standpoint, primitives utilize the basic 3-dimensional rasterization algorithms such as Bresenham's line drawing algorithm, polygon scan line fill, texture mapping and so forth. OpenGL's basic operation is to accept primitives such as points, lines and polygons, and convert them into pixels. This is done by a graphics pipeline known as the OpenGL state machine. Most OpenGL commands either issue primitives to the graphics pipeline, or configure how the pipeline processes these primitives. OpenGL is a low-level, procedural API, requiring the programmer to dictate the exact steps required to render a scene. OpenGL's low-level design requires programmers to have a good knowledge of the graphics pipeline, but also gives a certain amount of freedom to implement novel rendering algorithms.

GLUT:
GLUT, short for OpenGL Utility Toolkit, is a set of support libraries available on every major platform. OpenGL does not directly support any form of windowing, menus, or input. That's where GLUT comes in. It provides basic functionality in all of those areas, while remaining platform independent, so that you can easily move GLUT-based applications from, for example, Windows to UNIX with few, if any, changes. GLUT is easy to use and learn, and although it does not provide you with all the functionality the operating system offers, it works quite well for demos and simple applications.

The OpenGL Utility Library

The OpenGL Utility Library, or GLU, supplements OpenGL by providing higher-level functions. GLU offers features that range from simple wrappers around OpenGL functions to complex components supporting advanced rendering techniques. Its features include:

2D image scaling Rendering 3D objects including spheres, cylinders, and disks

Page | 5 2010

Dept Of CSE

Computer Graphics Editor using OpenGL

Automatic bitmap generation from a single image Support for curves surfaces through NURBS Support for tessellation of non-convex polygons Special-purpose transformations and matrices

OpenGL API hierarchy under Windows systems.

Problem Statement:
The objective is to build a graphics editor having all required operations that a normal graphics editor should offer. The coding is implemented for a single canvas graphics editor. In this editor importance is given to a simple user interface and implementation of all basic graphic routines and basic graphic editing options. The basic requirements of the graphics editor were analysed to be:

1. User Interface- The presentation of the graphics editor is crucial to its acceptance by its users. The package should provide easy selection and implementation of the features through iconic interfaces.

2. Color Selection - To select a suitable color for drawing the primitives. The editor implements support for drawing various shapes mentioned above. The implementation is done using the graphics scan conversion algorithm. 3. Graphics Drawing To draw basic primitives like line, circle, ellipse, rectangle on the canvas and to use tools like pencil, flood filling, eraser, copy, cut, paste etc. to manipulate the image.

Line: line is drawn by selecting two points start point and the end point. The start point begins with mouse click and end point is the point where mouse button is released. Circle: Circle is drawn by selecting a point and dragging thereafter till the desired radius. Text: selecting the text icon and thereafter entering the text from keyboard Rectangle: rectangle is drawn by selecting a start point and dragging to end point of required size. Freehand Drawing: a freehand drawing is the one in which wherever mouse is dragged pixels are plotted

.
Page | 6 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Other Features:
Eraser: this feature allows deleting particular portions of figure as selected by click of the user. Dialog boxes: Dialog boxes and menus add user friendliness to the package. 3D objects perspective viewing of cube, sphere, tetrahedron.

Project Goal:
The aim of this project is to develop a 2-D graphics package which supports basic operations which include creating objects like lines, circles, polygons, spirals, etc and also transformation operations like translation, rotation, etc on such objects. The package must also have a user-friendly interface that may be menu-oriented, iconic or a combination of both.

Scope:
It provides most the features that a 2D graphic editor should have. It is developed in C. it has been implemented on DOS platform. The 2-D graphics package designed here provides an interface for the users for handling the display and manipulation of basic picture objects like point, line, rectangle, ellipse, polygon, spiral, etc. It can also perform operations on selected objects like clipping, translation, rotation, area filling etc. It is capable of loading and saving the picture files. The interface is user friendly with icons for all the functions. The user is also provided assistance with online help in the form of fool tips displayed on the status bar. The mouse is the main input device used.

Requirements
Microsoft Visual Studio 2005 Professional Edition:
Visual Studio 2005 delivers on Microsofts vision of smart client applications by letting developers quickly create connected applications that deliver the highest quality rich user experiences. This new version lets any size organization create more secure, more manageable, and more reliable applications that take advantage of Windows Vista, windows7, 2007 Office System and the Web. By building these new types of applications,
Page | 7 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

organizations will find it easier than ever to capture and analyze information so that they can make effective business decisions.

Software Requirements:
An MS-DOS based operating system like Windows 98, Windows 2000 or Windows XP, vista, windows 7 is the platform required to develop the 2D and 3D graphics applications. A Visual C/C++ compiler is required for compiling the source code to make the executable file which can then be directly executed. A built in graphics library like glut and glut32, and header file like GL\glut.h and also dynamic link libraries like glut and glut32 are required for creating the 3D layout.

Hardware Requirements:
The hardware requirements are very minimal and the software can run on most of the machines. Processor - Intel 486/Pentium processor or above. Processor Speed - 500 MHz or above RAM - 64MB or above Storage Space - 2 MB or above, hard disk -10MB. Monitor resolution - A color monitor with a minimum resolution of 1000*700 Supports both single &double buffering.

ABSTRACT
The Graphics Editor is aimed at supporting the requirements of the Computer Graphics package. It is a mini Graphics Editor project which is made up by using various algorithm like Mid-point circle drawing algorithm, clipping algorithm, floodfill Scan-line algorithm, Bezier curves algorithm etc. The editor has been developed using Visual Studio 2008. The various features have been supported by an easy to understand mouse interface. All the tools have been organized under the toolbar. The color palette has been organized under the color palette. The drawing work is carried out in the sub window (canvas) provided in the main window. The drawing tools supported are : 1. Line.

Page | 8 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

2. Rectangle.

3. Circle.

4. Polygon

5. Rounded rectangle

6. Triangle

7. Brush 8. Star

9.spiral

DESIGN & IMPLEMENTATION

Window design:
Graphics editor uses totally 3 windows. They are Loading Window: It is a window thats showed in loading time. Window : Main outer window that holds the 2D menu bar, main menu, 3D menu and color palette. Drawing Screen : Screen is a sub window of the main window which acts as a canvas for the basic 2D drawing. W_sphere : It is a 3D sub window of main window which is used to display 3D sphere on the screen.
Page | 9 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

W_cube : It is a 3D sub window of main window which is used to display 3D cube on the screen.

W_gasket : It is a 3D sub window of main window which is used to display 3D gasket on the screen. HINT : It is small rectangular box that helps user to explore the software

Initially the loading screen & main window will be displayed. Switching between the windows is handled depending on the events. The main controls such as Menus, 2D buttons, Color buttons, and 3D buttons are drawn in main window.

Button:
Holds all the controls such as menus, submenus, tool buttons, pattern palette button and color buttons. Bit map images are used as icon Image, these images are loaded using function called Openbitmap(char file name );
Page | 10 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Present in bitmap.cpp

Color palette:
Color palette is designed using the number of color buttons. The Fig 3.11 shows the color palette. The color button is the object of the structure button. For the color button we will specify the type of the button as COLOR. The Button->num holds the unique color button number which is used to identify selected color. Each color button is displayed in different color using the color values specified in Color object. Whenever a color button is pressed the draw_col object will be initialized with the color of that button. The tool drawing function will use this draw_col object color while drawing the object.

Templates:

Page | 11 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

All templates are basically Bitmap Images loaded as selected. On which user can draw 2D drawing ,it acts as background for drawing. This can be selected in right click menu.

File options:
File menu have the options like Open, Save, clear. The clear option will create a new blank window for drawing. The Open option shows the open dialog box which will take the filename to be opened. If the file does not exist then, it will display error message. The save option will display the save dialog and save as the file. If the file already exists it will display error. The save option will not display the save dialog if the file is already opened file.

2D Drawing :
2D drawings are done in screen window that is used as canvas.
Page | 12 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

The 2D drawing canvas is controlled wholly by a display stack that holds the stack structure objects in each level for each tool. The display stack is continuously called for each redisplay call for the canvas. The display stack top pointer will point to the current stack top. The objects in the stack will be displayed from the top to the bottom every time. Each display stack level will hold the details of current tool, the start and end index of the array for that tool. Whenever a tool is selected, the disp_stk.top is incremented and the start and end index will be initialized to that tool index. During switching over to another tool, the current tool indices are stored in stack top level and the top pointer is incremented for the next tool. The display stack called from top to bottom hence, we will have the effect of objects drawn one over another.

Pencil:
The first point we click will have the end flag set as true and all the points end flag will be set to false. The drawing of the points are done from the end index to the first index hence the pencil drawing
Page | 13 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

function will stop drawing the points whenever it encounters the end flag and starts drawing from next index..

Line:
Line is implemented using rubber band technique. The first point is the initial point and the next point will be continuously changing until the user releases the mouse button.

Rectangle:
Rectangle is similar to filled rectangle but the object is drawn using LINE_LOOP.

Eraser:
The Eraser is implemented by using the benefit of mouse passive motion function. The click area will be patched with the white rectangle of eraser size.

Spiral:
The spiral is implemented by using basic spiral drawing function. It also used interactive rubber band technique. A continuous spiral is drawn from the initial point to the point where the mouse is released.

Polygon :
Polygon is drawn by selecting the points. The end of the polygon is identified by the right click. The popup menu attached to right click is disabled when this tool is active.

Circle :
Circle drawing is done by using midpoint circle drawing algorithm. First click will be the midpoint and the distance between the first click point to the next click point is the radius of the circle.

Rounded Rectangle:
Rounded rectangle is implemented using rubber band technique. The rectangle is drawn from the initial point to the current mouse point using glLines function & curves are drawn using arc func.

Star:
Page | 14 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Star is implemented in circle of radius defined by user, it can be varied in right menu

Filled Rectangle:
Filled rectangle is implemented using rubber band technique. The rectangle is drawn from the initial point to the current mouse point using glRectf function.

Spray:
Spray will take the click position as the center pixel position and randomly selects the pixels surround it by using rand () function defined in <stdlib.h>.

Text:
Text is implemented using the keyboard function. The click position will be the position of the text. Whenever a key is pressed that is stored in a character array and continuously displayed on the screen. The fonts can be changed by selecting the fonts from the popup menu.

3D Drawing :
3D drawings are performed by 3 windows w_sphere, w_cube and w_gasket. To draw the 3D objects we first goto 3D mode by selecting the 3D mode from mode menu. Then the 3 buttons corresponding to the three 3D objects will be displayed.

Page | 15 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

The button sphere will call the w_sphere window to display the 3D sphere. The button cube will call the w_cube window to display the perspective view cube. The button gasket will call the w_gasket window to display the sierpinski gasket.

Cube:
Creates a new window for 3D cube with perspective viewing with mouse clicks Left click -- X axis rotation

Right click -- Z axis rotation Middle click -- Y axis rotation

Sphere:
Creates a new window for 3D Sphere with ambient light source perspective viewing & with mouse clicks Left click -- X axis rotation

Right click -- Z axis rotation Middle click -- Y axis rotation

3D Gasket:
Creates a new window for 3D gasket with perspective viewing with mouse clicks Left click -- X axis rotation

Right click -- Z axis rotation Middle click -- Y axis rotation

Right Click Menu:

Page | 16 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Add Templates
Adds backround image for drawing there are about 14 templates available.

Draw arc:
2d func that draws a semi circle of user defined radius.

Spiral/ Star Size

User can select the size of the spiral & star size.

Eraser:
User can select the specific size of the eraser.

Line Width:
User can select the line width that changes the glLineWidh(size);.

Text:
User can select the font type & font size in the TEXT MODE.

Line Stipple:
User can select the specific line stipples like dotted, dashes etc.

Spray Thickness:
User can select the thickness of the spray.

FINAL PROJECT:
Page | 17 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

LOADING SCREEN

This window is shown at loading the software -- Graphics editor using open GL It appears for about 3-5 s Then main editor window is opened.

Page | 18 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

MAIN WINDOW

5 6

MAIN CANVAS WINDOW FOR 2D AND 3D DRAWING 7 8

1 Main Menu --Contains options like open, save, clear. 2 Drawing Area -- Area for drawing 2D objects. 3 Software Background user can change the background color in color palette. 4 2D drawing Menu tools for drawing 2D objects 5 Color Palette user can choose different colors for drawing. 6 Hint Box Generates hints making editor more user friendly. 7 3D Menu Used for selecting 3D objects in new sub window. 8Mode Box Shows the current mode selected.

Page | 19 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

SNAP SHOTS

2D drawing

Page | 20 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

3D PERSPETIVE VIEW CUBE

Page | 21 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

SPHERE

Page | 22 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

TETRAHEDRON

Page | 23 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

GLUT GEOMETRIC SHAPES

STAR FIELD

Page | 24 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

BEFORE UNDO

AFTER UNDO

Page | 25 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

OPEN AND SAVE

Page | 26 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

HELP

Page | 27 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

LINE PATTERN

Page | 28 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Testing and Results Functionality

Mouse Pointer

Completed
Yes

Comments
It shows the position of the Mouse Pointer in the status bar at the bottom of the screen

Geometrical Shapes 2D

Yes

It supports Geometrical Shapes such as straight Line, Circle, Spiral, square and Rectangle.

From 3D -2D MODE CHANGE

Yes

It supports change in 2D -3D & vice versa , without any error.

Loading

Yes

Its loading time is very small 2-4s

Colors & Patterns

Yes

It supports a range of Colors and line Pattern choose from.

Other Features

Yes

It supports other features like, Eraser, Free Hand Drawing and Text-Typing.

The editor has been thoroughly tested for any bugs that may have crept in our design or implementation. So far no such bugs have been discovered.

Page | 29 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Conclusion and Future Enhancements

This graphics is very user friendly tool. The user can very easily use this tool to draw or manipulate a drawing. The interface is mouse driven and the user can select a function by clicking on an icon representing that function. For the users help the function performed by each icon is displayed in the status bar as soon as the mouse pointer moves over the icon. We have tried our best to make this editor very realistic, so that the user does not face any trouble when switching over from any real life graphics editor to this highly useful one.

The following are some of the features that are planned to be supported in the future versions of the graphics editor.

The package currently is platform dependent and runs only On DOS based machines so making it portable for other machines also. Features like "Undo" and "Redo could be provided. The editor saves images in a very raw format and cannot load or save in standard image file formats such as bmp, jpeg, gif. Therefore Support for different file formats like bmp, jpeg, gif etc. could be provided

Support for advanced 3d drawings and transformations.

Only Single Document Interface (SDI) has been provided, multiple document interface can be provided.

IMPLEMENTING rotation, scaling & other 3D transformations

Page | 30 Dept Of CSE 2010

Computer Graphics Editor using OpenGL

Bibliography
[1]. Interactive Computer Graphics A Top-Down Approach with OpenGL -Edward Angel, 5th Edition, Addison-Wesley, 2008. [2]. Computer Graphics Using OpenGL F.S. Hill,Jr. 2nd Edition, Pearson Education, 2001. [3]. Computer Graphics James D Foley, Andries Van Dam, Steven K Feiner, John F Hughes, Addison-wesley 1997. [4]. Computer Graphics - OpenGL Version Donald Hearn and Pauline Baker, 2nd Edition, Pearson Education, 2003.

[5] www.google.com [6] www.openglforum.org [7]. www.wikipedia.org [8] REDBOOK FOR OPEN GL

Page | 31 Dept Of CSE 2010