cs559: computer graphics
DESCRIPTION
CS559: Computer Graphics. Lecture 18: FLTK and Curves Li Zhang Spring 2008. Today. Finish FLTK curves Reading http://pages.cs.wisc.edu/~cs559-1/tutorials.htm Shirley: Ch 15.1, 15.2, 15.3. FLUT vs FLTK. FLTK Demo. FLTK class hierarchy. Hello world and Shape control. The Cube example. - PowerPoint PPT PresentationTRANSCRIPT
CS559: Computer Graphics
Lecture 18: FLTK and CurvesLi Zhang
Spring 2008
Today• Finish FLTK• curves
• Reading– http://pages.cs.wisc.edu/~cs559-1/tutorials.htm– Shirley: Ch 15.1, 15.2, 15.3
FLUT vs FLTK
FLTK Demo
FLTK class hierarchy
Hello world and Shape control
The Cube example
#include "config.h"#include <FL/Fl.H>#include "CubeViewUI.h"
int main(int argc, char **argv) {
CubeViewUI *cvui=new CubeViewUI; Fl::visual(FL_DOUBLE|FL_RGB);
cvui->show(argc, argv); return Fl::run();}
#include "config.h"#include <FL/Fl.H>#include "CubeViewUI.h"
int main(int argc, char **argv) {
CubeViewUI *cvui=new CubeViewUI; Fl::visual(FL_DOUBLE|FL_RGB);
cvui->show(argc, argv); return Fl::run();}
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeView : public Fl_Gl_Window {
public:double size;float vAng,hAng;float xshift,yshift;
CubeView(int x,int y,int w,int h,const char *l=0);
void v_angle(float angle){vAng=angle;};
void h_angle(float angle){hAng=angle;};
void panx(float x){xshift=x;};void pany(float y){yshift=y;};
void draw(); void drawCube();
float boxv0[3];float boxv1[3];float boxv2[3];float boxv3[3];float boxv4[3];float boxv5[3];float boxv6[3];float boxv7[3];
};
class CubeView : public Fl_Gl_Window {
public:double size;float vAng,hAng;float xshift,yshift;
CubeView(int x,int y,int w,int h,const char *l=0);
void v_angle(float angle){vAng=angle;};
void h_angle(float angle){hAng=angle;};
void panx(float x){xshift=x;};void pany(float y){yshift=y;};
void draw(); void drawCube();
float boxv0[3];float boxv1[3];float boxv2[3];float boxv3[3];float boxv4[3];float boxv5[3];float boxv6[3];float boxv7[3];
};
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeView : public Fl_Gl_Window {
public:double size;float vAng,hAng;float xshift,yshift;
CubeView(int x,int y,int w,int h,const char *l=0);
void v_angle(float angle){vAng=angle;};
void h_angle(float angle){hAng=angle;};
void panx(float x){xshift=x;};void pany(float y){yshift=y;};
void draw(); void drawCube();
float boxv0[3];float boxv1[3];float boxv2[3];float boxv3[3];float boxv4[3];float boxv5[3];float boxv6[3];float boxv7[3];
};
class CubeView : public Fl_Gl_Window {
public:double size;float vAng,hAng;float xshift,yshift;
CubeView(int x,int y,int w,int h,const char *l=0);
void v_angle(float angle){vAng=angle;};
void h_angle(float angle){hAng=angle;};
void panx(float x){xshift=x;};void pany(float y){yshift=y;};
void draw(); void drawCube();
float boxv0[3];float boxv1[3];float boxv2[3];float boxv3[3];float boxv4[3];float boxv5[3];float boxv6[3];float boxv7[3];
};
void CubeView::draw() { if (!valid()) { glLoadIdentity(); glViewport(0,0,w(),h()); glOrtho(-10,10,-10,10,-20050,10000); glEnable(GL_BLEND); glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); }
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glPushMatrix();
glTranslatef(xshift, yshift, 0); glRotatef(hAng,0,1,0); glRotatef(vAng,1,0,0); glScalef(float(size),float(size),float(size));
drawCube(); glPopMatrix();}
void CubeView::draw() { if (!valid()) { glLoadIdentity(); glViewport(0,0,w(),h()); glOrtho(-10,10,-10,10,-20050,10000); glEnable(GL_BLEND); glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); }
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glPushMatrix();
glTranslatef(xshift, yshift, 0); glRotatef(hAng,0,1,0); glRotatef(vAng,1,0,0); glScalef(float(size),float(size),float(size));
drawCube(); glPopMatrix();}
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeViewUI {public: CubeViewUI();private: Fl_Double_Window *mainWindow;
public: Fl_Roller *vrot; Fl_Slider *ypan;private: void cb_vrot_i(Fl_Roller*, void*); void cb_ypan_i(Fl_Slider*, void*);
public: Fl_Slider *xpan; Fl_Roller *hrot;private: void cb_xpan_i(Fl_Slider*, void*); void cb_hrot_i(Fl_Roller*, void*);
public: CubeView *cube; Fl_Value_Slider *zoom;private: void cb_zoom_i(Fl_Value_Slider*, void*);
public: void show(int argc, char **argv);};
class CubeView : public Fl_Gl_Window {
public:double size;float vAng,hAng;float xshift,yshift;
CubeView(int x,int y,int w,int h,const char *l=0);
void v_angle(float angle){vAng=angle;};
void h_angle(float angle){hAng=angle;};
void panx(float x){xshift=x;};void pany(float y){yshift=y;};
void draw(); void drawCube();
float boxv0[3];float boxv1[3];float boxv2[3];float boxv3[3];float boxv4[3];float boxv5[3];float boxv6[3];float boxv7[3];
};
class CubeView : public Fl_Gl_Window {
public:double size;float vAng,hAng;float xshift,yshift;
CubeView(int x,int y,int w,int h,const char *l=0);
void v_angle(float angle){vAng=angle;};
void h_angle(float angle){hAng=angle;};
void panx(float x){xshift=x;};void pany(float y){yshift=y;};
void draw(); void drawCube();
float boxv0[3];float boxv1[3];float boxv2[3];float boxv3[3];float boxv4[3];float boxv5[3];float boxv6[3];float boxv7[3];
};
Initialize window layoutCubeViewUI::CubeViewUI() { Fl_Double_Window* w; { Fl_Double_Window* o = mainWindow = new Fl_Double_Window(415, 405, "CubeView"); w = o; o->box(FL_UP_BOX); o->labelsize(12); o->user_data((void*)(this)); { Fl_Group* o = new Fl_Group(5, 3, 374, 399); { Fl_Group* o = VChange = new Fl_Group(5, 100, 37, 192); { Fl_Roller* o = vrot = new Fl_Roller(5, 100, 17, 186, "V Rot"); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(-180); o->maximum(180); o->step(1); o->callback((Fl_Callback*)cb_vrot); o->align(FL_ALIGN_WRAP); } { Fl_Slider* o = ypan = new Fl_Slider(25, 100, 17, 186, "V Pan"); o->type(4); o->selection_color(FL_DARK_BLUE); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(-25); o->maximum(25); o->step(0.1); o->callback((Fl_Callback*)cb_ypan); o->align(FL_ALIGN_CENTER); } o->end(); } { Fl_Group* o = HChange = new Fl_Group(120, 362, 190, 40); { Fl_Slider* o = xpan = new Fl_Slider(122, 364, 186, 17, "H Pan"); o->type(5); o->selection_color(FL_DARK_BLUE); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(25); o->maximum(-25); o->step(0.1); o->callback((Fl_Callback*)cb_xpan); o->align(FL_ALIGN_CENTER|FL_ALIGN_INSIDE); } { Fl_Roller* o = hrot = new Fl_Roller(122, 383, 186, 17, "H Rotation"); o->type(1); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(-180); o->maximum(180); o->step(1); o->callback((Fl_Callback*)cb_hrot); o->align(FL_ALIGN_RIGHT); } o->end(); } { Fl_Group* o = MainView = new Fl_Group(46, 27, 333, 333); { Fl_Box* o = cframe = new Fl_Box(46, 27, 333, 333); o->box(FL_DOWN_FRAME); o->color((Fl_Color)4); o->selection_color((Fl_Color)69); } { CubeView* o = cube = new CubeView(48, 29, 329, 329, "This is the cube_view"); o->box(FL_NO_BOX); o->color(FL_BACKGROUND_COLOR); o->selection_color(FL_BACKGROUND_COLOR); o->labeltype(FL_NORMAL_LABEL); o->labelfont(0); o->labelsize(14); o->labelcolor(FL_FOREGROUND_COLOR); o->align(FL_ALIGN_CENTER|FL_ALIGN_INSIDE); o->when(FL_WHEN_RELEASE); } o->end(); } { Fl_Value_Slider* o = zoom = new Fl_Value_Slider(106, 3, 227, 19, "Zoom"); o->type(5); o->selection_color(FL_DARK_BLUE); o->labelfont(1); o->labelsize(12); o->minimum(1); o->maximum(50); o->step(0.1); o->value(10); o->textfont(1); o->callback((Fl_Callback*)cb_zoom); o->align(FL_ALIGN_LEFT); } o->end(); } o->end(); o->resizable(o); }}
CubeViewUI::CubeViewUI() { Fl_Double_Window* w; { Fl_Double_Window* o = mainWindow = new Fl_Double_Window(415, 405, "CubeView"); w = o; o->box(FL_UP_BOX); o->labelsize(12); o->user_data((void*)(this)); { Fl_Group* o = new Fl_Group(5, 3, 374, 399); { Fl_Group* o = VChange = new Fl_Group(5, 100, 37, 192); { Fl_Roller* o = vrot = new Fl_Roller(5, 100, 17, 186, "V Rot"); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(-180); o->maximum(180); o->step(1); o->callback((Fl_Callback*)cb_vrot); o->align(FL_ALIGN_WRAP); } { Fl_Slider* o = ypan = new Fl_Slider(25, 100, 17, 186, "V Pan"); o->type(4); o->selection_color(FL_DARK_BLUE); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(-25); o->maximum(25); o->step(0.1); o->callback((Fl_Callback*)cb_ypan); o->align(FL_ALIGN_CENTER); } o->end(); } { Fl_Group* o = HChange = new Fl_Group(120, 362, 190, 40); { Fl_Slider* o = xpan = new Fl_Slider(122, 364, 186, 17, "H Pan"); o->type(5); o->selection_color(FL_DARK_BLUE); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(25); o->maximum(-25); o->step(0.1); o->callback((Fl_Callback*)cb_xpan); o->align(FL_ALIGN_CENTER|FL_ALIGN_INSIDE); } { Fl_Roller* o = hrot = new Fl_Roller(122, 383, 186, 17, "H Rotation"); o->type(1); o->labeltype(FL_NO_LABEL); o->labelsize(12); o->minimum(-180); o->maximum(180); o->step(1); o->callback((Fl_Callback*)cb_hrot); o->align(FL_ALIGN_RIGHT); } o->end(); } { Fl_Group* o = MainView = new Fl_Group(46, 27, 333, 333); { Fl_Box* o = cframe = new Fl_Box(46, 27, 333, 333); o->box(FL_DOWN_FRAME); o->color((Fl_Color)4); o->selection_color((Fl_Color)69); } { CubeView* o = cube = new CubeView(48, 29, 329, 329, "This is the cube_view"); o->box(FL_NO_BOX); o->color(FL_BACKGROUND_COLOR); o->selection_color(FL_BACKGROUND_COLOR); o->labeltype(FL_NORMAL_LABEL); o->labelfont(0); o->labelsize(14); o->labelcolor(FL_FOREGROUND_COLOR); o->align(FL_ALIGN_CENTER|FL_ALIGN_INSIDE); o->when(FL_WHEN_RELEASE); } o->end(); } { Fl_Value_Slider* o = zoom = new Fl_Value_Slider(106, 3, 227, 19, "Zoom"); o->type(5); o->selection_color(FL_DARK_BLUE); o->labelfont(1); o->labelsize(12); o->minimum(1); o->maximum(50); o->step(0.1); o->value(10); o->textfont(1); o->callback((Fl_Callback*)cb_zoom); o->align(FL_ALIGN_LEFT); } o->end(); } o->end(); o->resizable(o); }}
FLUID
FLUID
Demo
Where are we?• We know the math and programming skill to:
Using transformation, projection, rasterization, hiddern-surface removal, lighting, material.
Where are we?• We know the math and programming skill to:
• Remain questions:– Model 3D shape
Where are we?• We know the math and programming skill to:
• Remain questions:– Model 3D shape– Model complex appearance
Where are we?• We know the math and programming skill to:
• Remain questions:– Model 3D shape– Model complex appearance– More Realistic Synthesis
Curves
x
y
line circlex
y
Freeformx
y
Curve Representation
x
y
line
baxy
circlex
y
0)()(),( 222 rdycxyxf0),( byaxyxf
tr
tr
d
c
y
x
sin
cos
c
d t
c
d
t
sin
cost
d
c
y
x
Explicit:
Implicit:
Parametric:
Curve Representation
x
y
line circlex
y
tr
tr
d
c
y
x
2sin
2cos
c
d t
c
d
t
sin
cos2t
d
c
y
xParametric:
Curve Representation
x
y
line circlex
y
3
3
sin
cos
tr
tr
d
c
y
x
c
d t
c
d
t
sin
cos3td
c
y
xParametric:
Curve Representation
x
y
line circlex
y
)(sin
)(cos
tgr
tgr
d
c
y
x
c
d t
c
d
t
sin
cos)(tg
d
c
y
xParametric:
Any invertible function g will result in the same curve
What are Parametric Curves?• Define a mapping from parameter space to 2D or
3D points– A function that takes parameter values and gives
back 3D points
• The result is a parametric curve
0 t1
Mapping:F:t→(x,y,z)
0
1(Fx(t), Fy(t), Fz(t),)
An example of a complex curve
5.0)12(
5.0)2()(
tt
ttt
circle
line
f
ff
Piecing together basic curves
Continuities
5.0)12(
5.0)2()(
tt
ttt
circle
line
f
ff
)0()1(:0circleline
C ff
)0()1(:1 ''
circlelineC ff
)0()1(:2 ''''
circlelineC ff
)0()1(:1 ''
circlelinekG ff
)0()1(:2 ''''
circlelinekG ff
Polynomial Pieces
nntatataatf 2
210)(
3
0
)( Rtt i
n
i
ii
aaf
Polynomial functions:
Polynomial curves:
Polynomial Evaluationn
ntatataatf 2210)(Polynomial functions:
f = a[0];for i = 1:n f += a[i]*power(t,i);end
f = a[0];for i = 1:n f += a[i]*power(t,i);end
f = a[0];s = 1;for i = 1:n s *= t; f += a[i]*s;end
f = a[0];s = 1;for i = 1:n s *= t; f += a[i]*s;end
11210)( n
ntataatatf
nnn taataatatatf 12210)(
23210)( n
ntataatatatf
f = a[n];for i = n-1:-1:0 f = a[i]+t*f;end
f = a[n];for i = n-1:-1:0 f = a[i]+t*f;end
A line Segment• We have seen the parametric form for a line:
• Note that x, y and z are each given by an equation that involves:– The parameter t – Some user specified control points, x0 and x1
• This is an example of a parametric curve
10
10
10
)1()1()1(
tzztztyytytxxtx
10)1()( ppfp tttp0
p1
A line Segment• We have seen the parametric form for a line:
10
10
10
)1()1()1(
tzztztyytytxxtx
10)1()( ppfp tttp0
p1
)()( 010 pppfp tt
3
0
)( Rtt i
n
i
ii
aaf
011
00
ppa
pa
1
0
1
0
11
01
p
p
a
a
1
0
p
pB
From control points p, we can solve coefficients a
More control points
p0
p1
p2
More control points
p0
p1 2210)( ttt aaaf
p2
22
100 00)0( aaafp
22
101 5.05.0)5.0( aaafp
22
102 11)0.1( aaafp
2
1
0
2
1
0
111
25.05.01
001
a
a
a
p
p
p
2
1
0
a
a
a
C
2
1
0
2
1
01
2
1
0
242
143
001
p
p
p
p
p
p
C
a
a
a
2
1
021)(
a
a
a
f ttt
2
1
01
p
p
p
tC
2
1
0
p
p
p
tBBy solving a matrix equation that satisfies the constraints,we can get polynomial coefficients
Two views on polynomial curves
2
1
021)(
p
p
p
Bf ttt
)(1)(
2
1
02
p
p
p
Bf ttt
2210)( ttt aaaf
2
1
02 )1()(
p
p
p
Bf ttt
221100 )()()()( pppf tbtbtbt
From control points p, we can compute coefficients a
Each point on the curve is a linear blending of the control points