FLTK - The Fast Light Toolkit (C++ GUI)

C++ FLTK (X,Y) AXIS TUTORIAL

2011-09-25T15:58:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II.   BACKGROUND WINDOW
III. (X,Y) Axis
IV. POLYGON
V.   RECTANGLE
VI. CIRCLE
VII.   ELLIPSE
VIII. MARK
IX. SCREEN SAVER

YOU WILL LEARN HOW TO CODE A C++ FLTK:
1. AXIS
2. POLYGON
3. RECTANGLE
4. CIRCLE
5. ELLIPSE
6. MARK
7. SCREEN SAVER

• I. INTRODUCTION

Welcome to the “C++ FLTK (X,Y) Axis Tutorial.”

This tutorial is a very brief overview of information presented by:

Dr. Bjarne Stroustrup in his book “Programming Principles and Practices Using C++,” Addison-Wesley 2009, ISBN 978-0321543721.

The web site for his book and the appropriate FLTK .h header files and .cpp files is:

http://www.stroustrup.com/Programming/

Please copy paste the following example program into your IDE. Build and debug the example program and it will help you understand the information covered in this tutorial.

//***********************************
//C++ FLTK (X,Y) AXIS TUTORIAL
//***********************************
#include "Simple_window.h"
#include "Graph.h"

int main( int argc, char* argv[] )
{
//========================START BACKGROUND WINDOW
using namespace Graph_lib;
Point tl(100, 0);
Simple_window win(Point(100,100),600,450,"(X,Y) Axis");
//========================START (X,Y) Axis
Axis X_Axis(Axis::x, Point(0,400),550, 40, "X Axis");
win.attach(X_Axis);
X_Axis.label.set_color(Color::blue);

Axis Y_Axis(Axis::y, Point(250,400),350, 20, "Y Axis");
win.attach(Y_Axis);
Y_Axis.label.set_color(Color::blue);

win.set_label("(X,Y) AXIS");
//========================START POLYGON
Polygon poly;
poly.add(Point(50,0));
//Triangle top (x,y) coordinate point.
poly.add(Point(0,100));
//Triangle bottom, left (x,y) coordinate point.
poly.add(Point(100,100));
//Triangle bottom, right (x,y) coordinate point.
poly.set_fill_color(Color::red);
win.attach(poly);
//========================START RECTANGLE
Rectangle r(Point(110,5), 100, 100);
r.set_fill_color(Color::yellow);
win.attach(r);
//========================START CIRCLE
Circle c(Point(110,210), 100);
c.set_color(Color::dark_cyan);
win.attach(c);
//========================START ELLIPSE
Ellipse e(Point(300,300),75,25);
e.set_color(Color::dark_green);
win.attach(e);
//========================START MARK
Mark m(Point(300,300),'x');
win.attach(m);
//========================START SCREEN SAVER
win.wait_for_button();
//==========================
}

Looking close you will see a repeating pattern for this FLTK code.

First, a FLTK keyword describes a geometric primitive; e.g., Rectangle.

Second, you name your function; e.g., r.

Third, you define a starting point; e.g., Point(110,5); the top left corner.

Fourth, you define the horizontal distance and the vertical distance; e.g., 100, 100; the width and height.

Fifth, you set the color; e.g., r.set_fill_color(Color::yellow);

Sixth, you attach the geometric primitive to win; e.g., win.attach®;

• II. BACKGROUND WINDOW

//========================START BACKGROUND WINDOW
using namespace Graph_lib;
Point tl(100, 0);
Simple_window win(Point(100,100),600,450,"(X,Y) Axis");

We are using the Graph library.

We define the top left corner of our window; e.g., Point tl(100, 0);

We are using Simple_window so we will have the "Next" button.

The window will start at Point(100,100); the horizontal x axis distance from this point will be 600, and the vertical y axis distance will be 450; and the label for the window will be "(X,Y) Axis."

• III. (X,Y) Axis

//========================START (X,Y) Axis
Axis X_Axis(Axis::x, Point(0,400),550, 40, "X Axis");
X_Axis.label.set_color(Color::blue);
win.attach(X_Axis);

Axis Y_Axis(Axis::y, Point(250,400),350, 20, "Y Axis");
win.attach(Y_Axis);
Y_Axis.label.set_color(Color::blue);

win.set_label("(X,Y) AXIS");

X_Axis

First, a FLTK keyword describes a geometric primitive; e.g., Axis, which is a line.

Second, you name your function; e.g., X_Axis.

Third, you define a starting point; e.g., Point(0,400).

Fourth, you define the horizontal distance; e.g., 550 is the x-axis length and 40 is the measurement increments on the x-axis.

Fifth, you set the color; e.g., X_Axis.label.set_color(Color::blue);

Sixth, you attach the geometric primitive to win; e.g., win.attach(X_Axis);

Y_Axis

First, a FLTK keyword describes a geometric primitive; e.g., Axis, which is a line.

Second, you name your function; e.g., Y_Axis.

Third, you define a starting point; e.g., Point(250,400).

Fourth, you define the vertical distance; from Point(250,400) e.g., 350, and 20 is the y-axis measurement increments.

Fifth, you set the color; e.g., Y_Axis.label.set_color(Color::blue);

Sixth, you attach the geometric primitive to win; e.g., win.attach(Y_Axis);

• IV. POLYGON

//========================START POLYGON
Polygon poly;
poly.add(Point(50,0));
//Triangle top (x,y) coordinate point.
poly.add(Point(0,100));
//Triangle bottom, left (x,y) coordinate point.
poly.add(Point(100,100));
//Triangle bottom, right (x,y) coordinate point.
poly.set_fill_color(Color::red);
win.attach(poly);

First, a FLTK keyword describes a geometric primitive; e.g., Polygon.

Second, you name your function; e.g., poly.

Third, you define a starting point; e.g., Point(50,0) the top; Point(0,100) the bottom, left; and Point(100,100) the bottom right.

Fourth, you set the color; e.g., r.set_fill_color(Color::red);

Fifth, you attach the geometric primitive to win; e.g., win.attach(poly);

• V. RECTANGLE

//========================START RECTANGLE
Rectangle r(Point(110,5), 100, 100);
r.set_fill_color(Color::yellow);
win.attach(r);

First, a FLTK keyword describes a geometric primitive; e.g., Rectangle.

Second, you name your function; e.g., r.

Third, you define a starting point; e.g., Point(110,5); the top left point.

Fourth, you define the horizontal distance and the vertical distance; e.g., 100, 100; the width and height.

Fifth, you set the color; e.g., r.set_fill_color(Color::yellow);

Sixth, you attach the geometric symbol to win; e.g., win.attach( r );

• VI. CIRCLE

//========================START CIRCLE
Circle c(Point(110,210), 100);
c.set_color(Color::dark_cyan);
win.attach(c);

First, a FLTK keyword describes a geometric primitive; e.g., Circle.

Second, you name your function; e.g., c.

Third, you define a starting point; e.g., Point(110,210).

Fourth, you define the horizontal distance and the vertical distance; e.g., 100 which is the radius.

Fifth, you set the color; e.g., c.set_color(Color::dark_cyan);

Sixth, you attach the geometric primitive to win; e.g., win.attach( c );

• VII. ELLIPSE

//========================START ELLIPSE
Ellipse e(Point(300,300),75,25);
e.set_color(Color::dark_green);
win.attach(e);

First, a FLTK keyword describes a geometric primitive; e.g., Ellipse.

Second, you name your function; e.g., e.

Third, you define a starting point; e.g., Point(300,300).

Fourth, you define the horizontal distance and the vertical distance; e.g., 100, 100.

Fifth, you set the color; e.g., r.set_fill_color(Color::yellow);

Sixth, you attach the geometric symbol to win; e.g., win.attach(e);

• VIII. MARK

//========================START MARK
Mark m(Point(300,300),'x');
win.attach(m);

First, a FLTK keyword describes a geometric primitive; e.g., Mark.

Second, you name your function; e.g., m.

Third, you define a starting point; e.g., Point(300,300).

• IX. SCREEN SAVER

//========================START SCREEN SAVER
win.wait_for_button();

Screen saver might not be a good choice of words but it saves the screen until you click the "Next" button. This give you time to admire your work!

YOU HAVE LEARNED HOW TO CODE A C++ FLTK:
1. AXIS
2. POLYGON
3. RECTANGLE
4. CIRCLE
5. ELLIPSE
6. MARK
7. SCREEN SAVER

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"

C++ FLTK OPENGL 3D ANIMATION TUTORIAL

2011-09-25T15:33:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II. INSTALLING OPENGL
III. USING FLTK IN MICROSOFT VISUAL STUDIO
IV. 3D ANIMATION USING FLTK AND OPENGL

YOU WILL LEARN HOW TO:
1. INSTALL AND USE OPENGL WITH FLTK.
2. CODE 3D ANIMATION WITH FLTK OPENGL.

• I. INTRODUCTION

Welcome to the “C++ FLTK OPENGL 3D ANIMATION TUTORIAL"

• II. INSTALLING OPENGL

There are lots of free download websites you can Google; this is one of the many for OpenGL95:

http://download-opengl-graphics.com/

Download and use WinZip or a similar package to extract the OpenGL95.zip file to your C:\ drive.

• III. USING FLTK IN MICROSOFT VISUAL STUDIO

Use the following steps to use OpenGL with FLTK in Microsoft Visual Studio:

1. Open Visual Studio

Use the same Win32 console application empty project you have been using for all of your non-OpenGL FLTK applications.

2. From the Visual Studio main top menu choose Project and from the drop-down menu choose Properties.

To expand a sub-menu click the Linker folder in the left menu of the Properties dialog box. In the sub-menu click Input. On the right, in the additional dependencies text field you should see the following entries we added for FLTK:

fltkd.lib wsock32.lib comctl32.lib fltkjpegd.lib fltkimagesd.lib

At the end of this list add the following four libraries:

opengl32.lib glu32.lib fltkgld.lib glaux.lib

In the “Ignore Specific Library” text field you should already have the following text if you do not have it add it now:

libcd.lib

In the left menu of the Properties window click C\C++ to expand a sub-menu. Click the “Code Generation” sub-menu item. On the right, if it has not already been changed, change the “Runtime Library” drop-down to:

Multi-threaded Debug DLL (\MDd)

Click OK to close the Properties window.

• IV. 3D ANIMATION USING FLTK AND OPENGL

Please copy and paste the following example into your IDE. You have to use the same Project file we just setup. It will not work in other Project files until you set them up the same way we did the one above. Then, build and debug the example program to test to see if you can now code in OpenGL using FLTK.

//***********************************
//Texture Mapped Cube
//erco/loic 03/17/09
//***********************************
#include <cmath>

#ifndef M_PI
#define M_PI 3.14159265358979323846
#endif

#include <stdio.h>
#include <math.h>
#include <FL/Fl.H>
#include <FL/Fl_window.H>
#include <FL/Fl_Gl_window.H>
#include <FL/gl.h>

//***********************************
//OpenGL spinning cube with
//checker texturemap
//***********************************
#define WIN_W 400
//window width
#define WIN_H 400
//window height
#define TEX_W 64
//texturemap width
#define TEX_H 64
//texturemap height
#define FPS (1.0/24.0)
//frames per second playback

//***********************************
//OpenGL class to show
//texturemapped cube
//***********************************
class MyGlWindow : public Fl_Gl_Window {
double spin;
GLuint TexID;
//***********************************
//TIMER CALLBACK
//Handles rotation the object
//***********************************
static void Timer_CB(void *userdata) {
MyGlWindow *mygl = (MyGlWindow*)userdata;
mygl->spin += 2.0;
//spin
mygl->redraw();
Fl::repeat_timeout(FPS, Timer_CB, userdata);
}
public:
//CTOR
MyGlWindow(int x,int y,int w,int h,const char *l=0) : Fl_Gl_Window(x,y,w,h,l) {
spin = 0.0;
Fl::add_timeout(FPS, Timer_CB, (void*)this);
//24fps timer
}
//***********************************
//PERSPECTIVE VIEW
//Same as gluPerspective()..
//***********************************
void Perspective(GLdouble fovy, GLdouble aspect, GLdouble zNear, GLdouble zFar) {
GLdouble xmin, xmax, ymin, ymax;
ymax = zNear * tan(fovy * M_PI / 360.0);
ymin = -ymax;
xmin = ymin * aspect;
xmax = ymax * aspect;
glFrustum(xmin, xmax, ymin, ymax, zNear, zFar);
}
//***********************************
//RESHAPED VIEWPORT
//OpenGL
//window changes size
//***********************************
void ReshapeViewport() {
//***********************************
//Viewport
//***********************************
glViewport(0, 0, w(), h());
//***********************************
//Projection
//***********************************
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
GLfloat ratio = w() / h();
Perspective(30.0, 1.0*ratio, 1.0, 30.0);
glTranslatef(0.0, 0.0, -8.0);
//***********************************
//Model view
//***********************************
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
}
//***********************************
//OPENGL INITIALIZATION
//OpenGL do *only once* on startup.
//***********************************
void GlInit() {
//***********************************
//Make sure we only do this once
//***********************************
static int first_time = 1;
if ( first_time ) {
first_time = 0;
//***********************************
//Texture Map Init
//***********************************
GLubyte img[TEX_W][TEX_H][3]; //after glTexImage2D(), array is no longer needed
glGenTextures(1, &TexID);
glBindTexture(GL_TEXTURE_2D, TexID);
//***********************************
//Texture Mapping Mode
//Uncomment one of the following lines:
//GL_DECAL or GL_MODULATE
//glTexEnvf(GL_TEXTURE_ENV,
//GL_TEXTURE_ENV_MODE,
//GL_DECAL);
//use actual texture colors
//***********************************
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);
//texture colors affected by poly's color

for (int x=0; x<TEX_W; x++) {
for (int y=0; y<TEX_H; y++) {
//***********************************
//Texture Pattern
//Uncomment one of the following lines:
//checkboard or basketweave
//GLubyte c = ((x&16)^(y&16)) ? ((x%16)
//<<4) : (((x%16)^15)<<4); //basket weave
//***********************************
GLubyte c = ((x&16)^(y&16)) ? 255 : 0;
//checkerboard
img[x][y][0] = c;
img[x][y][1] = c;
img[x][y][2] = c;
}
}
glPixelStorei(GL_UNPACK_ALIGNMENT, 1);
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, TEX_W, TEX_H, 0, GL_RGB, GL_UNSIGNED_BYTE, &img[0][0][0]);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glEnable(GL_TEXTURE_2D);
//***********************************
//OpenGL settings
//***********************************
glShadeModel(GL_FLAT);
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LEQUAL);
}
}
//***********************************
//FLTK DRAW
//Called by FLTK to draw the scene.
//***********************************
void draw() {
//***********************************
//Initialize/handle reshaped viewport
//***********************************
if ( !valid() ) {
valid(1);
GlInit();
ReshapeViewport();
}
//***********************************
//Clear
//***********************************
glClearColor(.5,.5,.5, 0.0);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
//***********************************
//Setup model matrix
//***********************************
glLoadIdentity();
glRotatef(spin, 0.5, 1.0, 0.0);
//show all sides of cube

//***********************************
//Draw cube with texture assigned
//to each face
//***********************************
glBegin(GL_QUADS);
//***********************************
//Front Face
//***********************************
glColor3f(1.0, 0.0, 0.0);
//red
glTexCoord2f(0.0, 1.0); glVertex3f(-1.0, 1.0, 1.0);
//Top Left Of The Texture and Quad
glTexCoord2f(1.0, 1.0); glVertex3f( 1.0, 1.0, 1.0);
//Top Right Of The Texture and Quad
glTexCoord2f(1.0, 0.0); glVertex3f( 1.0, -1.0, 1.0);
//Bottom Right Of The Texture and Quad
glTexCoord2f(0.0, 0.0); glVertex3f(-1.0, -1.0, 1.0);
//Bottom Left Of The Texture and Quad
//***********************************
//Back Face
//***********************************
glColor3f(0.0, 1.0, 1.0);
//cyn
glTexCoord2f(0.0, 1.0); glVertex3f( 1.0, 1.0, -1.0);
//Top Left Of The Texture and Quad
glTexCoord2f(1.0, 1.0); glVertex3f(-1.0, 1.0, -1.0);
//Top Right Of The Texture and Quad
glTexCoord2f(1.0, 0.0); glVertex3f(-1.0, -1.0, -1.0);
//Bottom Right Of The Texture and Quad
glTexCoord2f(0.0, 0.0); glVertex3f( 1.0, -1.0, -1.0);
//Bottom Left Of The Texture and Quad
//***********************************
//Top Face
//***********************************
glColor3f(0.0, 1.0, 0.0);
//grn
glTexCoord2f(0.0, 1.0); glVertex3f(-1.0, 1.0, -1.0);
//Top Left Of The Texture and Quad
glTexCoord2f(1.0, 1.0); glVertex3f( 1.0, 1.0, -1.0);
//Top Right Of The Texture and Quad
glTexCoord2f(1.0, 0.0); glVertex3f( 1.0, 1.0, 1.0);
//Bottom Right Of The Texture and Quad
glTexCoord2f(0.0, 0.0); glVertex3f(-1.0, 1.0, 1.0);
//Bottom Left Of The Texture and Quad
//***********************************
//Bottom Face
//***********************************
glColor3f(1.0, 0.0, 1.0);
//mag
glTexCoord2f(0.0, 1.0); glVertex3f( 1.0, -1.0, -1.0);
//Top Left Of The Texture and Quad
glTexCoord2f(1.0, 1.0); glVertex3f(-1.0, -1.0, -1.0);
//Top Right Of The Texture and Quad
glTexCoord2f(1.0, 0.0); glVertex3f(-1.0, -1.0, 1.0);
//Bottom Right Of The Texture and Quad
glTexCoord2f(0.0, 0.0); glVertex3f( 1.0, -1.0, 1.0);
//Bottom Left Of The Texture and Quad
//***********************************
//Right face
//***********************************
glColor3f(0.0, 0.0, 1.0);
//blu
glTexCoord2f(0.0, 1.0); glVertex3f( 1.0, 1.0, 1.0);
//Top Left Of The Texture and Quad
glTexCoord2f(1.0, 1.0); glVertex3f( 1.0, 1.0, -1.0);
//Top Right Of The Texture and Quad
glTexCoord2f(1.0, 0.0); glVertex3f( 1.0, -1.0, -1.0);
//Bottom Right Of The Texture and Quad
glTexCoord2f(0.0, 0.0); glVertex3f( 1.0, -1.0, 1.0);
//Bottom Left Of The Texture and Quad
//***********************************
//Left Face
//***********************************
glColor3f(1.0, 1.0, 0.0);
//yel
glTexCoord2f(0.0, 1.0); glVertex3f(-1.0, 1.0, -1.0);
//Top Left Of The Texture and Quad
glTexCoord2f(1.0, 1.0); glVertex3f(-1.0, 1.0, 1.0);
//Top Right Of The Texture and Quad
glTexCoord2f(1.0, 0.0); glVertex3f(-1.0, -1.0, 1.0);
//Bottom Right Of The Texture and Quad
glTexCoord2f(0.0, 0.0); glVertex3f(-1.0, -1.0, -1.0);
//Bottom Left Of The Texture and Quad
glEnd();
//***********************************
//DEBUG: CHECK FOR ERRORS
//***********************************
GLenum err = glGetError();
if ( err != GL_NO_ERROR ) {
fprintf(stderr, "GLGETERROR=%d\n", (int)err);
}
}
};
int main(int argc, char *argv[]) {
MyGlWindow* mygl = new MyGlWindow(10, 10, WIN_W-20, WIN_H-20, "Texture Test");
mygl->end();
mygl->resizable(mygl);
mygl->show();
return(Fl::run());
}

YOU HAVE LEARNED HOW TO:
1. INSTALL AND USE OPENGL WITH FLTK.
2. CODE 3D ANIMATION WITH FLTK OPENGL.

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"

C++ FLTK INSTALL OPENGL TUTORIAL

2011-09-25T14:34:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II. EXAMPLE 1 - C++ CLASS DERIVED FROM FLTK WIDGET
III. INSTALLING OPENGL
IV. USING OPENGL WITH FLTK IN MICROSOFT VISUAL STUDIO
V. EXAMPLE 2 - OPENGL TEXT ON A ROTATING 3D OBJECT

YOU WILL LEARN HOW TO:
1. CODE A C++ CLASS DERIVED FROM A FLTK WIDGET.
2. INSTALL AND USE OPENGL WITH FLTK.

• I. INTRODUCTION

Welcome to the “C++ FLTK INSTALL OPENGL TUTORIAL”

This tutorial is a very brief overview of information presented by Dr. Bjarne Stroustrup in his book “Programming Principles and Practices Using C++,” Addison-Wesley 2009, ISBN 978-0321543721.

The web site for his book and the appropriate FLTX header files is:

http://www.stroustrup.com/Programming/

• II. EXAMPLE 1 - C++ CLASS DERIVED FROM FLTK WIDGET

Please copy and paste Example 1 into your IDE then build and debug.

//***********************************
//Exampe 1
//C++ CLASS DERIVED FROM FLTK WIDGET
//***********************************
#include <Fl/Fl.H>
//Required by all FLTK programs.
#include <Fl/Fl_window.H>
//Required for window class.
#include <FL/FL_Button.H>
//Required for button class.
#include <stdio.h>
//Required for display.
#include <stdlib.h>

class Passes_Userdata : public Fl_Window
{
private:

static void MyCallback(Fl_Widget*w, void* userdata)
{
fprintf(stderr, "Button Clicked! Userdata passed is %d\n", (int)userdata);
}

public:

int data;
Passes_Userdata(int w, int h, const char *name = 0) : Fl_Window(w, h, name)
{
data = 54321;
Fl_Button *but = new Fl_Button(5, 5, 75, 30, "Click Me");
but->callback(MyCallback, (void*)54321);

show();
}
};

int main()
{
Passes_Userdata passes_userdata(600,400,"FLTK is easy to learn and fun to use!");
return(Fl::run());
//Returns value of FLTK command loop,
//this function returns only when all
//windows are closed.
}

Example 1 creates a C++ class derived from a FLTK Fl widget.

The Fl widget we used was Fl_window.

We made everything public to make it easier to understand.

When we coded the constructor we followed the FLTK parameter order of width, height, and label name.

We declared the window button inside of the class constructor.

We made the callback for the button a private member of the class.

Defining the class will automatically show the window.

• III. INSTALLING OPENGL

There are lots of free download websites you can use; this is one of the many for OpenGL95:

http://download-opengl-graphics.com/

Download and use WinZip or a similar package to extract the OpenGL95.zip file to your C:\ drive.

• IV. USING OPENGL WITH FLTK IN MICROSOFT VISUAL STUDIO

Use the following steps to use OpenGL with FLTK in Microsoft Visual Studio:

1. Open Visual Studio

Use the same Win32 console application empty project you have been using for all of your non-OpenGL FLTK applications.

2. From the Visual Studio main top menu choose Project and from the drop-down menu choose Properties.

fltkd.lib wsock32.lib comctl32.lib fltkjpegd.lib fltkimagesd.lib

At the end of this list add the following four libraries:

opengl32.lib glu32.lib fltkgld.lib glaux.lib

In the “Ignore Specific Library” text field you should already have the following text if you do not have it add it now:

libcd.lib

Multi-threaded Debug DLL (\MDd)

Click OK to close the Properties window.

• V. EXAMPLE 2 - OPENGL TEXT ON A ROTATING 3D OBJECT.

Please copy and paste Example 2 into your IDE. You have to use the same Project file we just setup. It will not work in other Project files until you set them up the same way we did the one above. Then, build and debug Example 2 to test to see if you can now code in OpenGL using FLTK.

//***********************************
//Example 2
//OPENGL TEXT ON A ROTATING
//3D OBJECT
//***********************************
#include <FL/Fl.H>
#include <FL/Fl_Gl_window.H>
#include <FL/gl.h>
#include <GL/glu.h>
#include <string.h>
#include <stdio.h>
//Tetrahedron points.
#define TOP 0, 1, 0
#define RIGHT 1, -1, 1
#define LEFT -1, -1, 1
#define BACK 0, -1, -1
class MyGlWindow : public Fl_Gl_Window {
float rotangle;
void draw() {
//Init viewport.
if (!valid()) {
valid(1);
// Initialize GL.
glClearColor(0.0, 0.0, 0.0, 0.0);
glClearDepth(1.0);
glDepthFunc(GL_LESS);
glEnable(GL_DEPTH_TEST);
glShadeModel(GL_FLAT);
}
glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
//Position camera/viewport init.
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glViewport(0,0,w(),h());
gluPerspective(45.0, (float)w()/(float)h(), 1.0, 10.0);
glTranslatef(0.0, 0.0, -5.0);
//Position object.
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
glRotatef(rotangle, 1, 0, 1);
glRotatef(rotangle, 0, 1, 0);
glRotatef(rotangle, 1, 1, 1);
//Draw tetrahedron.
glColor3f(1.0, 0.0, 0.0); glBegin(GL_POLYGON); glVertex3f(TOP); glVertex3f(RIGHT); glVertex3f(LEFT); glEnd();
glColor3f(0.0, 1.0, 0.0); glBegin(GL_POLYGON); glVertex3f(TOP); glVertex3f(BACK); glVertex3f(RIGHT); glEnd();
glColor3f(0.0, 0.0, 1.0); glBegin(GL_POLYGON); glVertex3f(TOP); glVertex3f(LEFT); glVertex3f(BACK); glEnd();
glColor3f(0.5, 0.5, 0.5); glBegin(GL_POLYGON); glVertex3f(RIGHT); glVertex3f(BACK); glVertex3f(LEFT); glEnd();
//Print tetrahedron's points on object.
//Disable depth buffer while drawing text,
//so text draws /over/ object.
glDisable(GL_DEPTH_TEST);
{
const char *p;
gl_font(1, 12);
glColor3f(1.0, 1.0, 1.0);
glRasterPos3f(TOP); p = "+ top"; gl_draw(p, strlen(p));
glRasterPos3f(LEFT); p = "+ left"; gl_draw(p, strlen(p));
glRasterPos3f(RIGHT); p = "+ right"; gl_draw(p, strlen(p));
glRasterPos3f(BACK); p = "+ back"; gl_draw(p, strlen(p));
}
glEnable(GL_DEPTH_TEST);
//Print rotangle value at fixed position
//at lower left.
char s[40];
sprintf(s, "ROT=%.2f", rotangle);
glLoadIdentity(); glRasterPos2f(-3,-2); gl_draw(s, strlen(s));
}
static void Timer_CB(void *userdata) {
MyGlWindow *o = (MyGlWindow*)userdata;
o->rotangle += 1.0;
o->redraw();
Fl::repeat_timeout(1.0/24.0, Timer_CB, userdata); //24fps
}
public:
//CONSTRUCTOR
MyGlWindow(int X,int Y,int W,int H,const char*L=0) : Fl_Gl_Window(X,Y,W,H,L) {
rotangle = 0;
Fl::add_timeout(3.0, Timer_CB, (void*)this); //Wait 3 secs before animation begins.
}
};
//MAIN
int main() {
Fl_Window win(500, 300);
MyGlWindow mygl(10, 10, win.w()-20, win.h()-20);
win.show();
return(Fl::run());
}

YOU HAVE LEARNED HOW TO:
1. CODE A C++ CLASS DERIVED FROM A FLTK WIDGET.
2. INSTALL AND USE OPENGL WITH FLTK.

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"

C++ FLTK ADDING BUTTONS TO A WINDOW TUTORIAL

2011-09-25T14:20:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II. EXAMPLE 1 - BLANK WINDOW
III. EXAMPLE 2 - ADDING A BUTTON
IV. EXAMPLE 3 - ADDING A BUTTON CALLBACK
V. EXAMPLE 4 - PASSING USER DATA

YOU WILL LEARN HOW TO CODE A C++ FLTK:
1. Blank window.
2. Window button.
3. userdata.

• I. INTRODUCTION

Hello; nice to meet you! Welcome to the “C++ FLTK ADDING BUTTONS TO A WINDOW TUTORIAL.”

The web site for his book and the appropriate FLTX header files is:

http://www.stroustrup.com/Programming/

• II. EXAMPLE 1 - BLANK WINDOW

Please copy and paste Example 1 into your IDE then build and debug.

//***********************************
//Exampe 1
//Blank Window
//***********************************
#include <Fl/Fl.H>
//Required by all FLTK programs.
#include <Fl/Fl_window.H>
//Required for window class.

int main()
{
Fl_Window win(600,400);
//Creates window width 600 height 400.
win.show();
//Tells FLTK to show the window.
return(Fl::run());
//Returns value of FLTK command loop, //this function returns only when all
//windows are closed.
}

Example 1 creates an empty window with no window title and no buttons.

There is one include file for every class in FLTK. For example:

#include <Fl/Fl_window.H>

Is the include file for the Fl_Window class.

In the following statement:

Fl_Window win(600,400);

win is the object name instantiated by the class window.

When an object of the class is instantiated the parentheses following the object name enclose the arguments required by the class constructor. In this case the first argument is the width and the second argument is the height. The third argument is an optional title character string.

return(Fl::run());

Returns the value of FLTK command loop, this function returns only when all windows are closed.

• III. EXAMPLE 2 - ADDING A BUTTON

Please copy and paste Example 2 into your IDE then build and debug.

//***********************************
//Exampe 2
//Adding a button
//***********************************
#include <Fl/Fl.H>
//Required by all FLTK programs.
#include <Fl/Fl_window.H>
//Required for window class.
#include <FL/FL_Button.H>
//Required for button class.

int main()
{
Fl_Window win(600,400,"FLTK is easy to learn and fun to use.");
//Creates window width 600 height 400.
Fl_Button button(5,5,75,30,"Click Me");
//Button arguments starting
//point(x,y),width,heigth,"label."
win.show(); //Tells FLTK to show the window.
return(Fl::run()); //Returns value of FLTK
//command loop, this
//function returns only when all
//windows are closed.
}

Below the window definition we added a call for a button.

Fl_Button button(5,5,75,30,"Click Me");

The button is a rectangle. A rectangle is defined by a (x,y) starting point for its top left corner of the rectangle and its width and its height. The first two arguments are the top left corner (x,y) starting point inside of the window. The third and fourth arguments are the width and height respectively. The fifth argument is a character string title for the button.

Since we are using the Button class we added an include file for button:

#include <FL/FL_Button.H>

And, we added a title to the window.

Fl_Window win(600,400,"FLTK is easy to learn and fun to use.");

• IV. EXAMPLE 3 - ADDING A BUTTON CALLBACK

Please copy and paste Example 3 into your IDE then build and debug.

//***********************************
//Exampe 3
//Adding a button callback.
//***********************************
#include <Fl/Fl.H>
//Required by all FLTK programs.
#include <Fl/Fl_window.H>
//Required for window class.
#include <FL/FL_Button.H>
//Required for button class.
#include <stdio.h>
//Required for display.

void My_Callback(Fl_Widget*w, void* userdata)
{
fprintf(stderr, "Button works!\n");
}

int main()
{
Fl_Window win(600,400,"FLTK is fun to learn and easy to use.");
//Creates window width 600 height 400.
Fl_Button button(5,5,75,30,"Click Me");
//Button arguments starting
//point(x,y),width,heigth,"label."
button.callback(My_Callback);
win.show();
//Tells FLTK to show the window.
return(Fl::run());
//Returns value of FLTK
//command loop, this
//function returns only when
//all windows are closed.
}

We want the button to do something. To make the button do something we have to add a callback.

void My_Callback(Fl_Widget*w, void* userdata)
{
fprintf(stderr, "Button works!\n");
}

Callbacks in FLTK always return a void.

We declared the callback named My_Callback. The first two arguments are a widget pointer, which is a pointer to the widget that invoked the callback, and a void pointer to userdata which can be any kind of data that you want.

Below the button definition we attach the callback to the button.

button.callback(My_Callback);

Now when the button is clicked the callback will display on the black background window, "FLTK is fun to learn and easy to use."

To get the display to work we added:

#include <stdio.h>

• V. EXAMPLE 4 - PASSING USER DATA

Please copy and paste Example 4 into your IDE then build and debug.

//***********************************
//Exampe 4
//Passing userdata
//***********************************
#include <Fl/Fl.H>
//Required by all FLTK programs.
#include <Fl/Fl_window.H>
//Required for window class.
#include <FL/FL_Button.H>
//Required for button class.
#include <stdio.h>
//Required for display.

void My_Callback(Fl_Widget*w, void* userdata)
{
fprintf(stderr, "Button Clicked! Userdata passed is %d\n", (int)userdata);
}

int main()
{
Fl_Window win(600,400,"FLTK is fun to learn and easy to use.");
//Creates window width 600 height 400.
Fl_Button button(5,5,75,30,"Click Me");
//Button arguments starting
//point(x,y),width,heigth,"label."
button.callback(My_Callback, (void*)54321);
win.show(); //Tells FLTK to show the window.
return(Fl::run()); //Returns value of FLTK
//command loop, this
//function returns only when all
//windows are closed.
}

We want to pass userdata. userdata is passed as an optional second argument to the callback. The userdata can be any type of data you want as long as it is one piece of data that can be cast to a void pointer.

button.callback(My_Callback, (void*)54321);

When you push the button, it calls the callback function, and passes the 54321 data as the userdata and the function can do with that 54321 userdata whatever it wants.

void My_Callback(Fl_Widget*w, void* userdata)
{
fprintf(stderr, "Button Clicked! Userdata passed is %d\n", (int)userdata);
}

In our example the 54321 userdata is printed to the black background window when the button is clicked.

You might have to click and drag the grey foreground window out of the way to see the black background window. Remember the display will be on the black background window not the grey foreground window.

YOU HAVE LEARNED HOW TO CODE A C++ FLTK:
1. Blank window.
2. Window button.
3. Userdata.

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"

C++ FLTK GRAPHING ALGEBRAIC FUNCTIONS TUTORIAL

2011-09-25T14:02:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II. HORIZONTAL LINE
III. SLOPING LINE
IV. PARABOLA

YOU WILL LEARN HOW TO GRAPH THE FOLLOWING ALGEBRAIC FUNCTIONS USING C++ AND FLTK:
1. HORIZONTAL LINE
2. SLOPING LINE
3. PARABOLA

• I. INTRODUCTION

Welcome to the “C++ FLTK GRAPHING ALGEBRAIC FUNCTIONS TUTORIAL.”

The web site for his book and the appropriate FLTX .h header files and .cpp files is:

http://www.stroustrup.com/Programming/

Please copy and paste the following example program into your IDE; then build and debug the example program.

//***********************************
//C++ FLTK GRAPHING ALGEBRAIC
//FUNCTIONS TUTORIAL
//***********************************
#include "Simple_window.h"
#include "Graph.h"

double one(double)
{
return 1;
}

double slope(double x)
{
return x/2;
}

double square(double x)
{
return x*x;
}

int main( int argc, char* argv[] )
{
using namespace Graph_lib;
Point tl(100, 100);

const int xmax = 600;
const int ymax = 400;

const int x_orig = xmax/2;
const int y_orig = ymax/2;
const Point orig(x_orig,y_orig);

const int r_min = -10;
const int r_max = 11;

const int n_points = 400;

const int x_scale = 30;
const int y_scale = 30;
Simple_window win(Point(100,100),xmax,ymax,"FUNCTION GRAPHING");

Function s(one,r_min,r_max,orig,n_points,x_scale,y_scale);
Function s2(slope,r_min,r_max,orig,n_points,x_scale,y_scale);
Function s3(square,r_min,r_max,orig,n_points,x_scale,y_scale);

win.attach(s);
win.attach(s2);
win.attach(s3);

Text ts(Point(100,y_orig-40),"one");
Text ts2(Point(100,y_orig+y_orig/2-20),"x/2");
Text ts3(Point(x_orig-100,20),"x*x");
win.set_label("Function Graphing: Label Functions");
win.wait_for_button();

win.attach(ts);
win.attach(ts2);
win.attach(ts3);
win.wait_for_button();

const int xlength = xmax-40;
const int ylength = ymax-40;

Axis x(Axis::x,Point(20,y_orig),xlength,xlength/x_scale,"one notch == 1");
Axis y(Axis::y,Point(x_orig,ylength+20),
ylength,ylength/y_scale,"one notch == 1");

x.set_color(Color::dark_red);
y.set_color(Color::dark_red);

win.attach(x);
win.attach(y);

win.wait_for_button();
}

• II. HORIZONTAL LINE

A line parallel to the x-axis is called a horizontal line. A horizontal line is parallel to the x-axis because the y value never changes.

We get a horizontal line by graphing the following function:

double one(double)
{
return 1;
}

The line is defined by (x,y) == (x,1) for all x. In other words, we get the y value 1 for every x passed as an argument to the function one().

The following code specifies how it is to be drawn in the window:

Function s(one,r_min,r_max,orig,n_points,x_scale,y_scale);

The function specifies how its first argument, a function of one double argument returning a double, is to be drawn in the window.

The second argument and the third argument give the range of x, the argument to the function to be graphed.

The fourth argument, orig, tells the function where origin (0,0) is to be located within the window.

The remaining three arguments are default arguments. The function constructor arguments n_points, xscale and yscale were given the following initializers in the declaration. The default argument values are used if the caller does not specify values.

const int n_points = 400;

const int x_scale = 30;
const int y_scale = 30;

The graph label is as follows:

Text ts(Point(100,y_orig-40),"one");

The following code attaches the function and the graph label to win.

win.attach(s);
win.attach(ts);

• III. SLOPING LINE

The slope of a line is referred to as the rise over the run, or given two points on the line, the change in the y coordinates over the change in x coordinates.

We get a sloping line by graphing the following function:

double slope(double x)
{
return x/2;
}

The line is defined by (x,y) == (x,x/2). For every x we get the y value x/2.

The point where the two lines cross is (2,1).

The following code specifies how it is to be drawn in the window:

Function s2(slope,r_min,r_max,orig,n_points,x_scale,y_scale);

The function specifies how its first argument, a function of one double argument returning a double, is to be drawn in the window.

The second argument and the third argument give the range of x, the argument to the function to be graphed.

The fourth argument, orig, tells the function where origin (0,0) is to be located within the window.

The remaining three arguments are default arguments. The function constructor arguments n_points, and xscale were given the following initializers in the declaration. The default argument values are used if the caller does not specify values.

const int n_points = 400;

const int x_scale = 30;

The graph label is as follows:

Text ts2(Point(100,y_orig+y_orig/2-20),"x/2");

The following code attaches the function and the graph label to win.

win.attach(s2);
win.attach(ts2);

• IV. PARABOLA

We get a parabola by graphing the following function:

double square(double x)
{
return x*x;
}

The line is defined by (x,y) == (x,x*x). The lowest point where the parabola touches the sloping line is (0,0). The parabola is symmetric on the y axis.

The following code specifies how it is to be drawn in the window:

Function s3(square,r_min,r_max,orig,n_points,x_scale,y_scale);

The function specifies how its first argument, a function of one double argument returning a double, is to be drawn in the window.

The second argument and the third argument give the range of x, the argument to the function to be graphed.

The fourth argument, orig, tells the function where origin (0,0) is to be located within the window.

The remaining three arguments are default arguments. The function constructor arguments n_points were given the following initializer in the declaration. The default argument value is used if the caller does not specify a value.

const int n_points = 400;

The graph label is as follows:

Text ts3(Point(x_orig-100,20),"x*x");

The following code attaches the function and the graph label to win.

win.attach(s3);
win.attach(ts3);

YOU HAVE LEARNED HOW TO GRAPH THE FOLLOWING ALGEBRAIC FUNCTIONS USING C++ AND FLTK:
1. HORIZONTAL LINE
2. SLOPING LINE
3. PARABOLA

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"

C++ FLTK BUTTONS TUTORIAL

2011-09-25T04:01:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II. WIDGET
III. EXAMPLE 1 - BUTTON
IV. EXAMPLE 2 - BUTTON
V. EXAMPLE 3 - BUTTON
VI. VOID* POINTERS

YOU WILL LEARN:
1. FLTK widgets.
2. FLTK buttons.

• I. INTRODUCTION

Welcome to the “C++ FLTK Buttons Tutorial.”

• II. WIDGET

A widget is a control that defines interaction between a program and a graphical user interface (GUI). A button is a widget that invokes a callback when it is clicked. A menu is a vector of buttons. In_box and Out_box are two Widgets for getting text into and out of your program.

A widget has two functions:

1. show() makes the Widget visible.

A Widget starts out visible.

2. hide() makes the Widget invisible.

• III. EXAMPLE 1 - BUTTON

Copy and past the following FLTK button example program into your integrated development environment (IDE), then build, and debug the program:

//***********************************
//C++ FLTK Buttons Tutorial
//Example 1 - Button
//***********************************
#include <iostream>
#include <FL/Fl.H>
#include <FL/Fl_window.H>
#include <FL/Fl_Button.H>
using namespace std;

void button_cb( Fl_Widget*, void* );

void make_window()
{
Fl_Window* win= new Fl_Window( 500,400, "C++ FLTK Buttons Tutorial - Example 1" );
win->begin();
Fl_Button* but = new Fl_Button( 0, 0, 40, 40, "ON" );
win->end();
but -> callback( ( Fl_Callback* ) button_cb );
win->show();
}

void button_cb( Fl_Widget* obj , void* )
{
obj->label( "OFF" );

obj->resize( 0,0,40,40 );
obj->redraw();
}

int main( int argc, char* argv[] )
{
make_window();
return Fl::run();
}

Fl_Window* win= new Fl_Window( 500,400, "C++ FLTK Buttons Tutorial - Example 1" );

Creates a pointer to the new window object setting the width, height and the name in the title bar. Keyword new allocates heap memory for the object.

win->begin();

States until you reach win->end() new widgets will be added as children to the current Fl_window.

Fl_Button* but = new Fl_Button( 0, 0, 40, 40, "ON" );

Creates a button, which is a child of the parent window, with input parameters (x, y, width, height, label) where x, y are the position in pixels relative to the top left corner (0,0).

The button is the first child of the window with index 0. Only objects derived from Fl_Group have this child parent relationship.

Deleting the parent, Fl_Window, will automatically delete all the children of the window. For example, if we delete “win,” “but” will be deleted automatically.

win->end();

Sets the current group to the parent of the window.

but -> callback( ( Fl_Callback* ) button_cb );

“button_cb” is the name of our callback function. It is generally accepted programming practice to start or end callback function names with ”cb.”

Callbacks are a means of executing code when an event occurs. In order to use its base classes callback member function, “but” points to an Fl_Button, derived from Fl_Widget.

win->show();

Makes the window on the screen visible.

void button_cb( Fl_Widget* obj , void* )

Declares the callback function and since we passed null by default we do not need void*; however, we used it as a placeholder anyway.

The only two widget members that automatically call redraw are label() and value(). A manual call of redraw is required by everything else.

obj->resize( 0,0,40,40 );

Resizes the button.

obj->redraw();

Redraws the widget.

return Fl::run();

The function run() returns 0 and ends the program.

• IV. EXAMPLE 2 - BUTTON

Copy and past the following FLTK example program into your IDE, then build, and debug the program:

//***********************************
//C++ FLTK Buttons Tutorial
//Example 2 - Button
//***********************************
#include <iostream>
#include <FL/Fl.H>
#include <FL/Fl_window.H>
#include <FL/Fl_Button.H>
#include <FL/Fl_Input.H>
#include <FL/Fl_Output.H>
#include <cstdlib>
using namespace std;

void copy_cb( Fl_Widget*, void* );
void close_cb( Fl_Widget*, void* );
void make_window();

int main( int argc, char* argv[] )
{
make_window();
return Fl::run();
}

void make_window()
{
Fl_Window* win= new Fl_Window(600,250, "C++ FLTK Buttons Tutorial - Example 2");

win->begin();
Fl_Button* copy = new Fl_Button( 350, 0, 70, 30, "C&opy" );
//child 0
Fl_Button* close = new Fl_Button( 430, 0, 70, 30, "&Quit" );
//child 1
Fl_Input* inp = new Fl_Input( 20, 0, 140, 30, "In" );
//child 2
Fl_Output* out = new Fl_Output( 200, 0, 140, 30, "Out" );
//child 3
win->end();

copy->callback( (Fl_Callback*) copy_cb );
close->callback( (Fl_Callback*) close_cb);
win->show();
}

void copy_cb( Fl_Widget* obj , void* )
{
Fl_Button* button=(Fl_Button*)obj;
const char* temp;
temp = ( (Fl_Input*)(button->parent()->child(2)) )->value();
( (Fl_Output*)(button->parent()->child(3)) )->value(temp);
}

void close_cb( Fl_Widget* obj, void*)
{
exit(0);
}

The copy and Quit buttons can be invoked by pressing ALT+c and ALT+q. Placing an "&" in front of the letter in the label parameter in the constructor achieved this form of invoking.

Communicating widgets is demonstrated when "Copy" is pressed and the program copies whatever is in "In" to "Out."

void copy_cb( Fl_Widget* obj , void* )
{
Fl_Button* button=(Fl_Button*)obj;

“obj” is an Fl_Widget input parameter and “copy_cb” is an Fl_Button callback function; therefore, “obj” refers to an Fl_Button. We cast “obj” to the Fl_Button pointer called “button.”

temp = ( (Fl_Input*)(button->parent()->child(2)) )->value();
( (Fl_Output*)(button->parent()->child(3)) )->value(temp);

A temporary variable temp is set to the value of the Fl_Output widget.

• V. EXAMPLE 3 - BUTTON

Copy, past and debug the following FLTK example program. We will use it to see how call backs are done in classes:

//***********************************
//C++ FLTK Buttons Tutorial
//Example 3 - Button
//***********************************
#include <iostream>
#include <FL/Fl.H>
#include <FL/Fl_window.H>
#include <FL/Fl_Button.H>
#include <FL/Fl_Input.H>
#include <FL/Fl_Output.H>
#include <cstdlib>
using namespace std;

class SimpleWindow : public Fl_Window{

public:
SimpleWindow( int w, int h, const char* title );
~SimpleWindow();
Fl_Button* copy;
Fl_Button* quit;
Fl_Input* inp;
Fl_Output* out;

private:
static void cb_copy( Fl_Button*, void* );
inline void cb_copy_i( Fl_Button*, void* );

static void cb_quit( Fl_Button*, void* );
inline void cb_quit_i( Fl_Button*, void* );
};

int main( int argc, char* argv[] )
{
SimpleWindow win( 600,250,"C++ FLTK Buttons Tutorial - Example 3" );
return Fl::run();
}

SimpleWindow::SimpleWindow( int w, int h, const char* title ):Fl_Window( w,h,title )
{
begin();
copy = new Fl_Button( 375, 0, 70, 30, "C&opy" );
copy->callback(( Fl_Callback*)cb_copy, this );

quit = new Fl_Button( 450, 0, 70, 30, "&Quit" );
quit->callback(( Fl_Callback*)cb_quit, this );

inp = new Fl_Input( 40, 0, 140, 30, "Input:" );
out = new Fl_Output( 230, 0, 140, 30, "Output:" );
end();
resizable( this );
show();
}

SimpleWindow::~SimpleWindow()
{

}

void SimpleWindow::cb_copy( Fl_Button* obj, void* v )
{
SimpleWindow* T=( SimpleWindow* )v;
T->cb_copy_i(obj,v);
}

void SimpleWindow::cb_copy_i( Fl_Button* , void* )
{
out->value( inp->value() );
}

void SimpleWindow::cb_quit( Fl_Button*obj , void* v )
{
SimpleWindow* T=( SimpleWindow* )v;
T->cb_quit_i( obj,v );
}

void SimpleWindow::cb_quit_i( Fl_Button* , void* )
{
exit(0);
}

Callbacks in a class can only be static.

The get/set functions are overloaded with respect to their return and input parameters.

Get functions have no input parameter. inp->value() gets or returns the value of the const char* widget. The out->value(const char*) sets the value of the outobject.

The “this” pointer is implicit; therefore, you do not have to put a pointer in front of begin(), end(), show() etc.

copy->callback(( Fl_Callback*)cb_copy, this );

Utilizes the user data void*.

The address of the class instance () is passed by the “this” pointer and provides access to the entire class in the callback.

• VI. VOID* POINTERS

void* is used to transmit an address between pieces of code that do not know each others type.

A pointer that can point to anything is a void* pointer. A void* pointer has no type; therefore, casting such as a static_cast explicit type conversion is used in the callback function.

Void pointers do not know the size of the object to which they are pointing, they just contain the address; therefore, a void* can never be dereferenced.

YOU HAVE LEARNED:
1. FLTK widgets.
2. FLTK buttons.

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"

C++ FLTK GRAPHICS TUTORIAL

2011-09-25T03:47:00.000-04:00

REVISED: Friday, March 22, 2013

CONTENTS:
I. INTRODUCTION
II. FLTK
III. DOWNLOADING FLTK
IV. INSTALLING FLTK
V. USING FLTK IN MICROSOFT VISUAL STUDIO
VI. TESTING FLTK

YOU WILL LEARN HOW TO:
1. Download FLTK.
2. Install FLTK.
3. Use FLTK in visual studio.
4. Test FLTK.

• I. INTRODUCTION

Welcome to the “C++ FLTK Graphics Tutorial.”

This tutorial describes how to install FLTK using Microsoft Visual Studio. If you use another system refer to the downloaded files main folder for directions for your system.

This tutorial assumes you have a basic understanding of classes, inheritance, pointers and dynamic memory allocation.

This tutorial also assumes you already have Microsoft Visual Studio C++ installed on your computer and you are familiar with its use.

• II. FLTK

Fast Light Tool Kit (FLTK) pronounced "full tick" is a cross-platform Graphical User Interface (GUI) library. FLTK is free open source software, it is fun and easy to learn, and has a short learning curve for new users.

• III. DOWNLOADING FLTK

Use the following steps to download FLTK:

A. Go to http://www.fltk.org/

B. Click download in the navigation menu.

C. Choose FLTK 1.1.9 in the menu.

D. Choose the zip file format download.

The file you will receive will be in a zip file format. Use WinZip or a similar program to unzip and extract the files into normal files on your C drive. When you are done you will have a folder on your C drive that looks like this:

C:\fltk-1.1.9

• IV. INSTALLING FLTK

Use the following steps to install FLTK:

A. Open the VISUALC folder.

Double click the FLTK setup file that looks like a green, orange, and yellow infinity symbol.

The FLTK setup file update will open your Microsoft Visual Studio C++ program and begin the FLTK installation.

B. When Microsoft Visual Studio C++ asks about updating old projects choose “Yes to All.”

When the updating of old projects is completed you will see “Ready” appear in the bottom left corner of your screen.

C. From the Microsoft Visual Studio C++ “Build Menu,” choose “Build Solution.”

When the “Build Solution” has successfully completed you will see 71 succeeded, 0 failed, 0 up to date, and 0 skipped.

If you do not receive this message, the Build failed and you will see error messages telling you what went wrong. If this happens post a question on the DIC website in the forums and either I or someone else will help you.

D. Close Visual Studio.

E. Open your C:\ drive directory.

From C:\fltk-1.1.9 open the lib folder. Copy all the seven .lib files, except for the README.LIB, into:

C:\Program Files\Microsoft Visual Studio\Vc\lib

F. From C:\fltk-1.1.9 copy the FL folder into:

C:\Program Files\ Microsoft Visual Studio\Vc\include

• V. USING FLTK IN MICROSOFT VISUAL STUDIO

Use the following steps to use FLTK in Microsoft Visual Studio:

A. Open Visual Studio

Create a Win32 console application empty project.

B. From Visual Studio main top menu choose Project and from the drop-down menu choose Properties.

To expand a sub-menu click the Linker folder in the left menu of the Properties dialog box. In the sub-menu click Input.

On the right, in the additional dependencies text field enter the following text:

fltkd.lib wsock32.lib comctl32.lib fltkjpegd.lib fltkimagesd.lib

In the “Ignore Specific Library” text field enter the following text:

libcd.lib

C. From Visual Studio create a new .cpp file.

From Visual Studio main top menu choose Project and from the drop-down menu choose Properties.

In the left menu of the Properties window click C\C++ to expand a sub-menu. Click the “Code Generation” sub-menu item.

On the right, change the “Runtime Library” drop-down to:

Multi-threaded Debug DLL (\MDd)

Click OK to close the Properties window.

• VI. TESTING FLTK

Use the following steps to test FLTK:

A. From the .cpp file type the following code:

#include <Fl/Fl.h>
#include <Fl/Fl_Box.h>
#include <Fl/Fl_window.h>

int main()
{
Fl_Window window(200,200, "Window title");
Fl_Box box(0,0,200,200,"Hello World!");
window.show();
return Fl::run();
}

B. Build and Debug the .cpp file.

A successful run will create a blank FLTK window.

Future tutorials will explain how to use FLTK.

YOU HAVE LEARNED HOW TO:
1. Download FLTK.
2. Install FLTK.
3. Use FLTK in visual studio.
4. Test FLTK.

Elcric Otto Circle

-->

-->

-->

How to Link to My Home Page

It will appear on your website as:
"Link to ELCRIC OTTO CIRCLE's Home Page"