WWDC2000 Session 188

Transcript

Kind: captions
Language: en
good morning I'm just all
49 game application even though a lot of
this may be applicable to game
applications a manager of the DTS group
that handles OpenGL handle 2d graphics
handles quicktime java and printing but
the real people who do the real work are
here today also visiting throwing things
at me and making comments about the
things that get wrong later but John
Stauffer is the engineering manager for
OpenGL group over here and also we have
a number of people number of guests from
hei we do the OpenGL drivers for us
Chris Bentley sitting on the side Brian
Raider min and Jeremy San Mel working on
the OS 10 work with a TI so we
appreciate them being here and let's
jump right into the good stuff is using
ok again as I said we're going to use
OpenGL for non full screen immersive
applications so a lot of people who look
at OpenGL and see quake or see some of
the full screen immersive things that
have been done opengl works really well
for maybe a 2d application that just
needs to do some rendering or some
drawing and wants to have high-speed
rendering wants to have that
acceleration and doesn't want to have to
reinvent the wheel yourself it takes
advantage of the fastest Macintosh
pipeline what this means is basically
that all your graphics there even if
it's a 2d texture map which you know
just a 2d image sent to the screen it's
going to go through all the acceleration
layers and use all the accelerated
context so this allows you to get to
lehigh performs graphics without having
to get down into the bits and figure out
how to flush caches and what the bus
bandwidth is and how to keep that
optimize that's all done for you another
thing about this is is that they've done
a lot of hand coding and hard work to
take advantage of velocity engine
there's significant improvement you can
see on OpenGL applications from a non
velocity engine to have lost an engine
machine and this is for free is get this
and it works great it's good for 2d two
and a half day in 3d and for those may
be unfamiliar with what how you can
two and a half t let's talk about maybe
let's talk about a game action in this
case let's talk about something like
Diablo Diablo basically is a sprite like
based game they have a background to
have orthographic or flat sprites that
move around on top of this opengl can be
used for this kind of thing or any other
like to decline of sprite game whether
there may be a depth there might be a
stacking of things look a PowerPoint
PowerPoint is a is really a 2d thing but
there's a sorting order to it so you
could do PowerPoint in OpenGL rendering
the text putting the things up there and
you get all the fades transitions
rotations those kinds for free so it's
all accelerated all in hardware once you
get your image in there you can
manipulate it however you want so it's
good for two and a half be good for
Trudy good for some of things like that
some things that may not be good for is
vector drawing for example we have
courts which is exceedingly good at
handling PDFs handling text tailing
vector scaling OpenGL does scaling but
the scaling is for a bitmap so if you
send a texture and it's going to scale
based on that texture so if your
textures 32 by 32 so a little icon there
and you blow it up the full screen size
you're going to get a 32 by 32 icon
blown up to full screen size it doesn't
do anything special with it whereas like
courts may have a text in a description
that text in a vector format which will
then when you blow it up keeps the
vector format keeps the smooth curves
and lines so OpenGL is one thing it
doesn't it doesn't really do well is
handle images in a vector format though
the base is the polygon the points are
all vectors and those scale infinitely
basically and it's easy to add two
applications in code there's not you
don't have to you know go take a linear
algebra class and go find some dark
corner of some library that has some
dusty old volume but how to put how to
code and OpenGL it's not that difficult
so let's kind of jump right into things
here and move ahead what I'm going to do
in this session is I'm going to go
through I don't have a lot of slides I
have a lot of code I'm kind of next show
you were going to go through the demos
you're going to see kind of one
ubiquitous spinning square demo a lot
but it is basically me use it to show
you how to manipulate kind of different
constructs of OpenGL one of the keys and
this is I'm going to be talking about a
GL in a lot of ways and how to
manipulate your buffers how to set
so if you had text on one half your
window you could put OpenGL in another
half how to do some texture mapping and
stuff a lot of this is basically I'm
going to demo in an OS 9 for simplicity
but basically it's all carbon-based all
the most everything you see here is
carbonized runs on 10 AGL works on 10
and the stuff you see here almost all
works on 10 now I'm trying to think of
some of the full screen stuff is not
quite supported but that'll be supported
shortly so what we're going to do we're
first going to talk about pixel formats
I think I mentioned pixel format since
on my other OpenGL talks until have some
the caveats there especially when you're
dealing with windows in multiple
monitors and multiple renderers we want
to talk about me using multiple windows
how long drawers and gels this window
this window in this window maybe I want
a cat application to do the perspective
view and then for orthographic views
from the front aside in the back or
front of line on the top actually in
that case you can use multiple windows
open GL this update am on update events
real simple works right in event loop
works great for for good stuff sub
windows combining 2d and 3d how ass
would you get 2d and 3d on a window if
you played with opengl at all one thing
you'll see is if you draw 2d and then
you draw some opengl and call swap
offers its going to blow away that 2d it
does not know anything about that
drawing does not know about about how
you that you had something there it does
not know about compositing to your
background so you have to consider that
that the area you're updating opengl is
really going to take over basically that
area that you set up talk about some
basic font handling then we'll talk
about a physical simulation i have a
couple demos and talk about just using
opengl for physical simulation nothing
really really big there's no real good
answer i can't give an answer for the
world on physical simulation there's a
lot of text on that but how to use
opengl similar considerations
orthographic projections orthographic
projections kind of a big word and you
say it real quick and some of us what's
heck you're talking about real simple is
that for like an orthographic projection
might be something that puts the text on
the screen while behind that you have a
perspective view of a walkthrough so as
you're walking through your virtual
library you want to identify what room
you're in and you want to do that in
text well you would switch to an
orthographic projection which allows you
nicely place your text on
wouldn't you know do your do any
manipulations or any perspective on that
text and then we'll talk about texture
mapping at the end real simple I'm gonna
show you how to get texted into the
Macintosh how to texture map them so you
can get some the basic stuff going which
is kind of a crux of doing 2d and 3d
okay six or format considerations AGL
tues pixel format is how you set up
basically you're kind of drawing almost
a context that's not the right word atl
pixel format sets up the basics of pixel
format and what it handles is it handles
things like rgba displays so red green
blue handles whether you want a depth
buffer or not and what do you require an
accelerated context or not and also
handles what if you want to choose a
specific renderer and let me pull up an
example of some of these and we'll look
at it some of the caveats here are
handling multiple displays handling
movable windows and I'll talk about some
special considerations actually let me
move forward and flying okay we got all
kinds of things on the computer here and
this is going to be a real simple one I
need to set my font size here that's
good
ok
what we have here is talking about some
pixel format and brought this up so it's
easier to talk about see some examples
of them basically in almost all cases if
you want to do hard work celebration and
you want to red green blue and alpha 8
base 'but is supported in software but
almost no hardware right now for
birthday pick context so if you want to
do hardware acceleration do I speed
graphics you Monty red green blue and
alpha then we're talking about a GL
render ID AGL regular ID says I want a
specific render and you can ask for any
render that we enumerate if you want a
3dfx render you can ask for 3d effects
Ranger in this case I wants a generic
render ID but this says I want the
software renderer the reason I put this
up here is so you know that one good
test you can do if you're working OpenGL
and not getting things right and you
know I shan't this driver is really bad
its buggy it's not draw myself right go
to the software renderer check out and
see what the software render says the
software renderer renders it correctly
there may be a bug on our part this
offer when your render renders it
incorrectly then it probably is
something in your code so I've a
challenge and its challenges for it I
put it out pretty much every time I talk
about OpenGL I have tremendous
confidence and John Stauffer and his
ability to code outstanding
implementation of the software render so
if the software renderer you find is not
compliant with the OpenGL specification
send what you think is not compliant
we'll look at it if you're correct I'll
send you a t-shirt right now I'm doing
the OpenGL t-shirts but I'll but I'll
find something to find if I run out of
those so but I haven't given out t-shirt
yet so that's a challenge so if you
think you have a non compliance in the
software render send me send me a send
me a note and if you're right i'll sign
your t-shirt the AGL render ID should be
followed by it by a render ID and that's
in the AGL header files the AGL render
generic ID said software render
basically so AGL generic render ID says
I want the software render that generic
render its software render there's
another Keaton is not a trick to do this
if you want to go to software render on
a precompiled code you want to check out
see how it runs pull out the the ati or
3dfx actual opengl accelerators or
opengl component out of your system
folder and the only render or less will
be the software under those it'll switch
to it so that's another test you do if i
want to get any render basically i'm
going to say rgba idea all renders HDL
double buffering on the double buffer
means i actually want to double buffer
surface which in almost all cases you do
it yell all renders what does that
really tell you why is that different
than just leaving it out eziel all
renders will accept non-compliant
renders for example the rage to shift on
the original reveille imax the
non-compete on OpenGL compliant renderer
so in that case this will select that
Star Wars racer you wanted to run on I'm
accra imac reveille so they would use a
string such as this to make sure they
would be able to like that otherwise
they will refuse to select any hardware
tolerated render in that case opengl
harbor compliant render same as the
above string basically but i but i got
rid of the HL all renders hardware
software design and add at HCL
accelerated here's a key that talks
about moving windows if you if you have
a window that you're using OpenGL and
you're moving the window around you ask
for an accelerated render it's going to
fail and y ou fail on multiple screen
displays why is it fail fails on
multiple screen displays because there's
a we coded a fallback case so when the
window spans two screens you go to go to
the software renderer so it gives you
rendering while you span two screens so
if i have a 3dfx card in one my slots i
have an open API card in the other slot
I dragged across if you use the string
such as this I'm sorry if you in most
cases you'll get a TI rendering moves
across when it's between screens you get
the software renderer when it's back on
the 3ds three effects display it'll get
3dfx surrender and one interesting thing
is you can easily check if you use GL
get string check for the manufacturer
that in the version string you'll get
either the ati the apple software or the
3d effects you can identify what render
you're actually on if i use this string
right here with the AGL accelerated and
i had a movable window so i basically
say i wanted for all my monitors and
monitor it will fail because it says i
can't handle the case for your between
screens it's pretty logical but it may
be a little caveat say hey why
is never working i have a GL
accelerating I can never get an
acceleration tolerated context with my
multiple screen so that's something I've
run into with people so that's this
little note on that ati compliant render
if I wanted a TI and getting a GL render
ID an AGL render a TI ID and if i wanted
to get an OpenGL compliant ati renderer
hardware accelerated render i would add
the AGL accelerated so what does this
look like real simple one of the simple
ways to do it you can do it like above
where you can just add the after boots
in order RGB a double buffered
accelerated in here in this case I'm
indicating that i want a depth buffer
one key here is with the depth buffer if
you actually do something that has depth
if you're going to have back to front
sorting you need to set a depth buffer
up you can turn on depth sorting you can
do everything you want you can turn on Z
value can do everything everything you
possibly can your geocode if you don't
set up a depth size and it and have
actually have that depth buffer there
it'll never do any depth sorting and be
like why is this not working because you
didn't don't have a depth buffer GL is
like that in a lot of ways you get down
put on the road and you're sure you got
it right you forgot to enable a mode or
set up a depth buffer so that's the
death little caveat there so you
definitely want to do these two lines if
you want to use depth sorting and then a
GL none terminates all these so
let's talk about multiple windows which
is really for me the main difference
between a full screen immersive and anon
immersive application is handling
windowed cases and combining 2d and 3d
together and combining text for multiple
windows will talk about oh I'm sorry
there we go we'll talk about my family
multiple pixel formats what that means
will handle multiple context multiple
drawables and considerations such as 80
AGL up fate context times we update
contacts my bad I'm sorry and resizing
multiple contact multiple pixel formats
we've talked about that pixel format
setup whether you have a depth buffer
whether you're accelerated or not what
rendering you may be using those kind of
things multiple contacts and capsule
it's an OpenGL state a drawable is
actually a window and when we talk about
considerations will talk about how that
relates to all all the above let me
actually go through this
okay I have my little cheat sheet here
so what we're going to do I'm going to
go through a lot of coding examples here
okay I talked about this as non-gaming
so what do we have I want to run the
ubiquitous game app so this is this is
the app you'll see this kind of thing
all over all over the demos and
hopefully the projector will sink
awesome so this is our our game app full
screen has the whole screen doesn't care
about anything else doesn't care about
updates or not updated just draws works
great and you'll see this when you
square a lot so just wanted to give you
a little preview of that one and let me
give you a little little update on my
opinion square demos none of the demos
you'll see except for maybe the last two
are really exciting as far as you know
content I didn't spend a lot of time
putting textures and fun little cool
stuff in it keynotes do that I don't I'm
not an artist the point here was just to
get across the coating the actual
techniques involved rather than it the
content so I hope you can bear with my
spending squares for a while so where
are we we're talking about multiple
contexts so let's talk about multiple
pixel format multiple pixel formats are
pretty there's really no since the pixel
format is your basic lowest level
everything needs to set up to that
there's really no reason to have a more
than 1 pixel format / context because
when you create a contact the required
to supply of pixel format you'd have to
destroy the context and then pass in a
new pixel on so there's no changing a
pixel format you can't maintain a depth
buffered one and a non depth buffered
one if you want to make that kind of
change you're going to have to recreate
the context create a second context or
you know recreate the pixel format you
can't go through and have pixel format
swapping to multiple contexts so that's
what's thought that if you do have
something you want depth offered not
depp's buffered you're going to have to
work on multiple contexts novels with
pixel format ok so I always talk about
multiple context so multiple contacts
will pull up on my little application
here I'm going to have to again resizes
to excuse me resize us to make sure the
everyone can see this once I bring up
the file based
multiple contacts handle different GL
settings basically the state of GL you
can say hey I want to drop I want to
draw with shaded outline draw with wine
version so what we're going to look at
is just this little section right here
that of code and it may make this bigger
for you see how this works ok what we're
going to look at here is setting up a
couple context I have two rectangles at
the top here they're they're both in
this case they're different sized
rectangles they have a window I go
through here I set up my pixel format
and I use my setup GL sample code and
called bilji open window so I build a GL
context there you can see that's context
number one then basically do this a
similar thing on this side create a
window up here set up something
something some similar settings you
notice this line right in here for
draggable windows as i said before we
can't use a gel accelerated because what
happens with draggable windows you're
saying you want them across multiple
monitors and so if it ends up between
two monitors you're going to fall back
to the software you're going to have
that fail because it can't fall back to
the software renderer most cases you
will actually get an accelerated context
there's very few cases you won't if you
have an acceleration card so usually I
just eliminate a gel accelerate actually
getting accelerated context with that
then I build and build the gel from
window and what I get you what I did
here was on the second context I said
really I want this one to be flat shaded
so we run this
very simple i have two context one's a
draggable window once a normal window
and this window over here it example
excuse me exactly the same drawing
routine calling the exact same thing so
the codes paths for each is exactly the
same all I'm doing in this case is that
this context here is set up for flat
shading if I take it out then I could it
would easy we just look exactly the same
as the first one we can see that
normally the shade model is is not is a
solution a dude's all go back to the
default version of that real simple so
it's just um hmmm this would be used for
cases where you have things that was for
example you have for windows that you
may want to do in a CAD program and what
you all want to be smooth shaded the
recipe line drawing so if you want to be
line drawings you just put the polygon
mode into line and we'll assume for my
simple demo that the fixed window is
your projection of your hallway or
you're building your building the other
one is your actual line view of it that
you're working with so this one would be
like your working copy of it and this
one over here would be the one that
shows the actual was going to look like
at the end the rendered kind of image so
that's kind of thing you would use is
actually multiple context for okay so
what else starts I've had so I did flat
line drawing that one so we're done
there moving on let's look at multiple
drawable so in this case multiple
drawables is the same context with
multiple windows may be exactly want the
exact same thing to show but you want it
to show in different windows in a
different view you just want to rotate a
camera and you want all basically the GL
sayings will always be linked so if you
set one to a different setting both of
them will link together but it gives you
different views or viewpoints on the
same scene will say so let's give them
back to another simple spinning square
application here
and in this one let's just run this and
see what we get so I have two windows
same size exactly the same view same
view of the world everything's the same
so when we prove that to you let's go
back into our that's about me so I
scroll down here and we will get to set
up so let's say let's make withdrawals
actually a different size instead of
making the same size showing that
they're actually drawing exactly the
same thing unless I do something to
affect that okay there you go so in this
case they're actually since there's draw
will set up on this on the back window
first the front window thinks it's
basically the same size of the back
window and just draw the exactly the
same thing so the question is how do we
fix this so that's basically the point
of all this is if you're handling
multiple drawables with a single context
what do you need to do for that and what
you need to do is you need to make sure
that you set the viewport correctly and
to set the viewport will scroll down a
little bit in the code into our drawing
retain this is a simple drawing routine
basically what i'm doing here is all you
use these two lines of code here what
this does is you notice this is the do
update so i just have a standard mac
program with every time I update I'm
drawing it GL again in this case I use
GL viewport Jill viewport takes the x
and y offset and then also takes the
width and height and in this case I did
screw up again wow I'm not doing very
well here should we bottom
and if we compile this you'll see that
we should now the drawable slides to the
appropriate window sizes okay there we
go we're back in selenium con we kind of
expected and if we do like a you know
window size here it actually keeps the
viewport to the window it's another
thought here is one thing you'll notice
when you're working with OpenGL is it if
you're doing something that supposed to
look realistic and someone does that to
your window you realize that just by
sending the viewport OpenGL is going to
scale everything OpenGL thinks of
everything is basically 0 to 10 to 1 and
so what happens is when you scale things
into a very small space if I scale
things like that you get definitely
OpenGL says hey you know I can do this I
can fill this rectangle whatever you
provide me with that right size of a of
your drawing and at that point it'll
just scale so you just wasted avoid that
you can set your aspect ratios and even
check that you so instead of really
smishing your your viewing up you're
actually just taking off a piece of it
out so and one more thing is to let me
prove that actually this is actually a
separate you know draw the messages in
the same contact so if it's using the
same context you think any opengl state
change to that contact anything
effective the state would change both of
these so let's make a state change here
so same lines of code I used in the last
one nitin last one I to contacts I
change lines of code date they operate
independently in this case again this is
something you may all have two views
with the same contacts two views of the
same scene so we should get basically
two views of the same scene so the scene
when is drawn should look the same up
there we go flat shaded lines and so as
we saw when you change the context
version contains the OpenGL state
variables what happens is we get the the
flat shady kind of thing we get the line
outline instead of instead of the little
spinning square so that's so again let
me recap a little bit if you'd really an
open chalak a shin you want have
multiple views and you want a multiple
views that have different kind of OpenGL
large-scale states such as you know
orthographic versus the projection such
as I flat shaded versus a smooth shaded
you may want to set it up so you're
having the two are on a separate context
if you're doing something that just has
different views of the same world you
want to set it up so using this two
different drawables same context let's
move on a little bit
so moods multiple contacts multiple
windows this one is a real simple one I
already showed the viewport from the
last one and this just shows a couple
other things on it and probably I don't
really even need to show this other than
we'll talk about some specifically I
didn't talk on the last one same kind of
thing okay what you see here is
basically the same same thing but you
know there's a black border around one
of the things and the black border is
from basically a sub window which we'll
talk about in a second but the key here
is that when you when I move this when I
drag this and I do that what do I need
to do to OpenGL to tell it that actually
I did something to the window and it's
pretty important so if you don't the
window won't make won't change nothing
will happen the window will draw the
same size sticking the distraught both
right size you need to call update
context and let me in this code maybe a
little bit convoluted because of the
carbon stuff in it but will show it will
show it to you and we can we can look at
exactly when you need to call update
contacts and how you actually grow and
drag windows and so just so you know
that if you're not taking notes on this
and down the right feeder surely all
going to put all the code up to you up
on the website to all be examples of
this on the sample code website so you
can pull it down and play around with it
and look at it so for example let's look
at the inn grow standard thing for
growing a window this is kind of code he
set right to a big wreck you grow the
window but then what do I need to do to
OpenGL for the grow basically I set the
port here I in Val the wreck to make
sure redraws all and then the key here
is is down in this area and we'll look
at the window to add this window first
this is the window I actually can drag I
call update context here that's sorry
call update context and I called GL set
viewport what that does is update
contacts tells OpenGL that you've
changed something as far as that
drawable in the window for example well
if you look at the anatomy of how OpenGL
works with a window what
happens is there's a front buffer which
may be certain size and we talked about
the bath buffer before the back buffer
actually is built behind that front
buffer pixel for pixel so if you resize
the window the front buffer changes and
the back before must be reallocated so
we have is we have a lot of reallocation
that video card me for example if you
had loaded it up with your 200 x 300
little context and and you had all your
textures loaded in there and then you go
to a thousand 24 x 768 definitely
there's a lot more things that are being
used a lot more out resources that are
being allocated on your video card for
the basketball for an that front
contacts thus it's going to have to do
some shuffling you may purge them
textures a lot of things going on in the
background just by resizing that window
I kill myself up here but that's okay
you'll get through this before I die so
Jill Jill update cantar atl update
context tells a GL which tells GL that
you've changed the context show and hide
definitely if you call it move window
and resize window our cases where you
definitely should call a GL update
context to let GL know that something's
changed for that context GL viewport
then was a thing I showed you before the
Geo Beaufort basically sets the size of
your viewport through that window and
scale anything you're drawing to that
size of the window ok sub windows look
at sub windows now sub windows are
pretty cool some windows is probably one
of the most useful things for people who
are using opengl in a non full screen
app if you're any kind of thing where
you have a part of your window you want
to draw a chart or graph or anything
like that it's really simple to do you
can use any of the line construction
just draw squares you can draw filled
squares shaded squares that's really
simple any opens your book and tell you
how to do that but the question is how
do you constrain your drawing how do you
make your drawing work you'll draw in
the areas you want it to draw in so
let's look at let's run this first
actually and then i'll show you how it
works again this is a spinning square
and you notice now we have two spinning
squares um this is pretty simple and
just put the square we have the one
window which is exactly the same as
before when I've done in the second
window when I go to draw it the same
context same drawable but I draw
play sending a coatl buffer wreck and
the buffer recognized is in this case
when I click the mouse it adjusts the
vertical part of it to where I click the
mouse so you can see that I can adjust
the buffer wrecks there so you can see
this somewhat you could put a divider
bar and have your OpenGL rendering
whatever you're doing your visualization
of a 3d visualization of a website
layout with a list on the system not on
the other side of all the web pages and
as you've dragged a slider bar you can
adjust the size of your display this is
an easy way to do it this works great
this is called a GL buffer wreck and
again someone may wonder if they're new
to GL why is it a GL + GL AGL's the
apples implementation dependent sections
of P of OpenGL anything that has to do
with window in anything it has to do
with the display is all through a GL
thus a buffer rack which is a justin
insider window inside a drawable will
set up in a GL and that basically sets
up kind of a clipping area says it's a
small area that it clips to that area
and just draws GL in that area one note
here if I didn't set the viewport as we
saw before buffer rec works great it
will it'll draw a little little window
that you can move around or whatever so
here they don't just all a little cut
out so if you say it your viewport your
viewport will stay in the in the bottom
corner as normal of your of your
drawable and you can set a buffer wreck
without saying the viewport and it will
just move around on your screen I may be
a me show you that well let's quit this
and I'll show you what very simple setup
here to do here this is a buffer retcode
will bring a bigger for you okay i might
do update again what I do is these are I
have two sections of drawing one here
and one here and what if you notice that
i use it i use the buffer rack and the
buffer wreck is in this case X Y with
Heights and what i'm doing here is
setting the height of it to my mouth
location and when i get it when i get a
mouse down i find location in window
coordinates nice find out what it is and
so I set that so that gives me though it
would be you know the height of that
mouth location there I call GL set
integer
my context set they call a GL buffer
wreck and passing the buffer wreck so
that tells it that tells it how I want
to constrain my drawing and it called GL
viewport for the actual the actual
viewport I'm trying to think of how I
can do this to make it actually
interesting ok I know what it can do
we'll get rid of that and we'll do this
in a second and we'll get rid of that
but basically the other ones the same
way so I'm basically drawing two pieces
that's adjusting in the interior I
talked about how you can use buffer
wrecked Ashley take a you know a little
bit a little window on the world kind of
thing and this should do that yes if you
notice it's in my infinite wisdom I
probably I have some update context in
there but basically the update is out of
sync as I move down and you see that is
unless you call viewport synced with
your buffer rack that you have with
cases where you're not you're looking at
either old data that's not being updated
or you're looking at a the viewports
remaining the same because it's not
updating this section up here has never
been updated again because a swap is
just calling it on the small buffer
wreck and we can also see that let me
show you another case of that so that's
something to root over to worry about or
not to worry about but to understand I'm
going to go back one example the multi
context one just run it for you if you
notice i talked about that black border
the black border what is inset with a
buffer rack real simple but notice
opengl doesn't updating in that area
opengl is not responsible for that so if
you have areas that you change your buff
iraq or areas that you take over you
want to update you need to make sure
that you're updating that area because
opengl is not going to do it you saw
them in the other in this right here you
can see it whereas when I changed my
drawable here it didn't doesn't update
that top part buffer wreck resets it to
set that area draws it's just you know
constrains the drawing but doesn't draw
doesn't say all race the background
opengl works the same it's very kind of
linear thinking so if it's you if you
don't think it's going to do helping you
probably won't do it so let's go back
and see where we are
okay actually good good I'm about where
I want to be so you notice on almost all
of those you may have noticed on the
screen you saw fonts on there and how do
you do font so it sponsored great thing
to put out because you can just put text
on the screen works pretty well and it's
something that you definitely want to
probably do and on it and if you don't
have a way to do that then we talked
about OpenGL botha recombine in 2d and
3d one thing actually I there is there's
another 10 caveat here I'm going to go
back to this for a second 2d and 3d
keeps them separate don't try and draw
OpenGL on an area that you're also
writing 2d on an area make sure that
your 2d and 3d are separate you want to
put a frame around the 3d area that's
fine set the bus wreck boy whatever you
want then put the frame around it with
your 2d drawing conventions just don't
try and overlap them because it's going
to happen is the OpenGL is gonna draw
right over whatever you have there the
OpenGL doesn't know any better doesn't
know that you're constraining it opengl
does it bye bye bye clip regions you
notice if i switch the windows in the
background it didn't draw over top the
other window it does handle those things
in windowed area so it's just fine so
there's no problems app switching to the
back you don't have to worry about oh my
god I have to set this weird area to
draw and it'll take care of that but
don't try and draw OpenGL like for
example not spinning square don't try to
do a swap buffer and then immediately
try and draw texted screen opengl is a
pipelined and asynchronous method of
drawing so what happens in it is that
swap buffer basically says yeah sometime
in the future I'll get to it the engine
usually is running much faster than you
can send commands to it so usually you
know you saw you know 400 600 frames per
second so I mean if you draw in text
every frame it's probably probably
synchronized but what's going to happen
is that in reality you're lucky if it's
think it doesn't really synchronize
together by calling swap buffers doesn't
think to anything you there are ways in
jail flushing GL finished do some
synchronization but I recommend staying
away from that I recommend using the
buffer Rex i recommend drawing parts of
screen remember recommend you can even
do a clipping region and clip out the
area that you don't want to draw into
and then using 2d specifically in those
areas
we tell you I'm full window updates if
you're doing a full window update make
sure you draw the 2d pieces also if you
change your buff iraq open jokes going
to forget about the piece that doesn't
want to draw any more other pieces and
how you moved it and you have to take
care of drawing up basic file handling
as you saw my demos have some fonts on
there if you want to put fonts on top of
2d don't draw text from top of 2d on top
of 3d sorry on top of three deepest it
won't work so you have to use some of
the font handling that we have in opengl
johnson very nice to work work and put a
GL font handle in that works like a
champ it's super easy once you figure it
out it's like you can put any text you
want on it you can what you can't do
though is you can't rotate it and can't
blend it it's just bitmap raster font it
worked great to draw strings work great
to color it whatever we want they can't
blend it with a background and you can't
i'm sorry i say blend I mean blend the
actual text not the background you don't
get blocks of black letters the text is
transparent in the areas that they
aren't actually drawn to but you can't
blend the white text into grey into the
background kind of thing so let's talk
to us look look at the code to do that
and it is super simple and i think it's
i have it on the web right now and and
if it's not i'll put this off this is
this is I like this stuff it's really
really easy ok I have a big draw frame
rate but that's not the real key the
real key is the build ponte el ok we
call GL unsigned integer list base and
the GL gen list and basically that makes
256 slots for basically display list so
it is it holders for the font letters
then i'm going to go AGL use font right
here i give it a context that was passed
in a font ID so i use like Monaco
whatever i called get font f num a face
ass iso face maybe normal size to be 9.0
to 256 that sets the parameters for how
many is going to generate and the list
space which is what I got right here
basically what that does it generates
all your fonts it a call upon stiff
stuffed into a list and you get a flan
that you wanted whatever raster point
you wanted I this is something because
the way a gel use fun sets up a AGL
pixel map handling you want to reset
your pixel store called geo pixel store
I 20 this kind of a key thing to do to
make sure that you don't have problems
later on trying to draw textures and
real simple to delete it you call delete
list the font list you created it's
passed in and 256 elements that list
pretty simple and what's even better is
draw my draw 3c string GL all you do is
go you take a lint send i equal to 1
wall you have letters in your in your
out string you want to use call list
font list plus the base in unity and
increment I and there's other ways to do
this with four loops and some other
loops but basically what that does it's
going to walk through your list and the
list basically says its ass playlist in
GL which basically says to draw this
character at the raster position and
advance the raster position of width of
the character so you get you get the
proportionally spaced fonts so it works
fine it's not like they're all blocked
out and you get all the letters and the
letters will draw nicely on the screen
you get nice letters you can put
information I'll you quit your frame
rate value can put version numbers out
you can put debugging information what
your states are works great simple so
you then have a basically your kind of
printf for GL you can in that way or a
printout you can use printf the fourth
sprint have to format and then you can
spit it out to here so that works well
and in this case this is just some code
that i'm using here to do framerate
timing inside of it so I call that once
per frame so that's more of a there's no
real complication there so I won't show
you anything with fonts right else
responds right now in a second i'll show
you that when you want to draw fonts you
want to make sure you're in a context or
in any you can set your raster position
to the 2d position on the screen you
want your fonts and if you're drawing
complicated 3d screen you may not be
able to it may be your x0 y0 may be back
face of this polygon over here until
your font comes out backwards and over
here or whatever so that's not you want
to be careful about that because that
won't work very well so we'll look at
remind me about that and i'll tell you
how to set up an orthographic context in
a minute
and so I think I'll go back here how we
doing it got about 20 minutes I think
and let's go back to I don't believe I'd
eat something no one told me I did I
didn't okay awesome thank you save me
okay so basically fun handling is good
physical simulation really simple
physical simulation is I'm going to talk
about some examples of it of how to use
do physical simulation or examples of
doing physical simulation in OpenGL you
can do something from very simple just
to get the idea of what's going on just
to get hey you know sometimes
visualization if something's a lot
easier than describing it or writing a
text based program so it with a little
bit of hooks in there you have your you
know you have your physics emulator
working on University you want to
simulate some effect and you and you
want to snap it out it's pretty simple
just toss in OpenGL couple
recommendations here if you all want to
do any kind of mac handling you want to
make the thing run on you next want to
make it run on Windows you wanna make it
run on the Macintosh what you can do is
you can use glut glut is Jail utility
tool kit it's a cross platform on the
code level based kind of you you are a
handler so it gives you the keyboard
events it gives you the windows and that
kind of stuff you write the same code I
would recommend it for shipping code but
i would recommend it for if you're doing
any kind of a profile any kind of kind
of research areas any kind of you want
to look at some algorithms you want to
do a quick one off application for
in-house to demonstrate something what
works like a champ so one michelle miss
there's some fun example so you've now
pretty much finished with my spinning
square i appreciate you kind of hanging
in there for the spinning square demos
so now i look at some more interesting
things thank you very much sky rocket
sky rocket is written with is a program
that was written by kerry welsh and the
reason I bring this up is because i
ported this from windows to macintosh it
took me about two hours to do this a
screen saver and took me about two hours
to the port and run runs really well
it's not it wasn't a big deal it's
opengl and based on a standard template
library it was really easy came over no
problem no changes in the GL code at all
didn't change anything I mean not a line
there's a little bit of a GL
set up and that was about it and so then
we go to the GL code leave it the same
and okay so I'm going to I'm going to
run this in 1024 768 and I think it all
fit on the screen and should work just
fine and then I would ask you to bear
with me for a minute because it takes a
little while to get started see it and
I'm not sure how well you can see that
you probably can and the camera will
take maybe a few minutes to rotate but
what he's done here is basically set up
a texture for the clouds use it up a
texture for the for the sky those stars
he also has some terrain below you and
can't really see that role volcania
that's not bad we'll wait for it to
rotate and and all and I'll show you the
new Ashley CS 3d so it's your standard
fireworks kind of demo if you notice
that the fireworks light to smoke up or
the other fireworks so he has a lot of
lighting effects go on the clouds get
lit up and of course it wouldn't cause I
don't have mouse keys to rotate it it
wouldn't start want to start rotating
for me to the kind of randomly picks
times to rotate so we'll let it will sit
down and be patient let it fool around
anymore so what else can I tell you
about it Egyptian the way this works she
knows each piece of smoke is a texture
and he scales a text during call and
colors the polygon color so he takes a
texture of the cloud with some alpha
values and then we does he put the
polygons in the right place and he turns
on he sets the polygon color to lefty
now here we go if you notice it really
is full 3d application rotating at that
little matrix like effect of the camera
rotating and um what's really nice about
this application is I mean it just it
looks good to give some power and OpenGL
and it's pretty small pretty compact one
guy did it I mean if so if you want to
simulate something she wants or some
simulation you can see that you get kind
of get can do some really nice things in
OpenGL an ice moon glow and some
lighting effects there so you can see
that that's uh he did a real nice job
with this and what's nice about it some
opengl stuff is that i can turn it off
full screen good 400 x 300 remember i
haven't done anything to the OpenGL
itself I all I'm doing is changing too
window said calling the same thing I've
talked about before the GL viewport
making sure the windows set up the right
way and there I hey I got it in a window
same stuff running exactly the same no
changes same code works like a champ so
OpenGL works in a window I could have
something that says hey this is my rock
of simulation i'm going to show you you
know this is a fireworks effect that my
fireworks company is going to set up for
your for your fourth of july celebration
here's an example of what it's what it's
going to look like and has some some
costs or some some presentation on using
opengl to demo it so that could be a use
for someone who want to use opengl
without them without having to do too
much extra work actually want to whiz
through these ones a little bit quickly
so I can get to the end anyway this is a
example that comes with it comes with
the glut the codes comes with this you
have source code for that with our SDK
and you can you can find it and this is
something that's really easy to do and
that's kind of nice you know it's kind
of cool what's nice about it actually is
that you can do this and let's do
something else here let's sit sighs this
is just use the environment mapping the
reason I say this is a physical
simulation other than just a cool piece
of eye candy it's because let's display
the wireframe the wireframe is actually
just a beta of set of Springs and they
use a simple physical stimulation
Springs to set this up and to do the
propagating waves on it so this is
another physical simulation that's kind
of cool you could talk about it you can
do it but then you put it OpenGL throw
the environment mapping on and you got
something that really catches your eye
and says hey that's something great and
you notice it runs in a window just fine
it's not like you have to go fullscreen
that's demo stuff and the last one is
actually a real simple demo and I
apologize for this one because on this
machine it kind of runs a little fast so
this is a demonstration of lorenza
tractors and you can see that that's so
it's showing its following a little red
ball around in little Lorenz attractor
so that's another idea of someone using
open
l mapping and out the 3d min in
implementing a very simple way so just
to show that you can do simple stuff
there too okay let's move on and you're
awesome you're going to have to switch
it over by time i get here i'm going
beat him nah damn convene orthographic
projections we talked about that a
little bit orthographic projection is
basically a parallel projection it's one
to one for the screening the contacts
and one good use for this is a sprite
engine I wanted to have a spray into an
example here honestly but I did not have
the time to put it together with all the
other things for doing so what I have is
I have my font at my fonts at the end
I'll show you the how that how that
works with the font display how is
actually is an orthographic projection
and you can set it month its really
fairly simple just a little three lines
of code but yet a hold on for that so
I'll move on to it into a minute
texture-mapping I in my last ten minutes
here I'm going to tell you all how to do
texture mapping on the Macintosh because
it seems that first people go who learn
how to texture mapping i know i'll put
cool stuff on the screen honey that's
all I know how to do is actually draw
boxes like I did that's easy
texture-mapping hard texture map it's
easy basically got to read the image got
Swizzle two pixels so I me my swizzle
depicts a little that's an official
industry term now sizzling pixels
swiveling pixels is you got an Arg be so
it's eight bits alpha 8 bits rot red
eight bits green aphids blue in the
Macintosh 32-bit off-screen that's what
you get that's when you read it read it
in using QuickTime reading and using
your read picture or whatever that's
what you that's what you're gonna have
opengl doesn't like that it doesn't like
taking that format in and doesn't like
handling that format so what you need to
do with that seem to Swizzle the pixel
so what what you're going to do is read
it into a different buffer and you know
take the RGB RGB values out of it and
put it in the other buffer set it up as
just three bite values or tuples of
large eb values and use that for your
texture send that in to opengl that's
whistling pixels you have to do that but
we've just announced that we're going to
have packed pixel format support in our
next version of GL which would be seeded
to developers very shortly and that'll
allow you to take standard macintosh
pixel formats like something you get
into an off-screen imply it directly to
a texture so you can do 1555 16-bit
you want to fill the alpha channel and
you can or you can blank the alpha
channel or you can fill them with ones
and you can send it directly into a
texture and there you go your texture
mapping without having do any pixels
whistling then we'll talk about handling
GL textures just the basics of how to
texture and we'll combine that with
quicktime magic let me show you the
texture mapping demo I just want to make
sure I don't run over and have time for
the last MO so that's the only one I'm
really really proud of so this is just
my I stole them the Maya face and if the
guys worked on and basically did texture
mapping demo can you see that real well
is that really hard to see I think it's
probably hard to city and you kind of
can see it you can see the reflection
better than anything else but basically
you have a texture map floor you have a
reflection in the cube and they're
fussing the cube is really simple just
it's just the same thing it's you who
noticed anyone knows something's wrong
with that exactly it's not that the
reflection is totally raw and the
reflection should be in this case should
be going as it dies down on the top the
point should come up in the bottom so
that's all screwed up but that's not the
point of this so I can do that and by
the way I mean this is a big thing for
anyone is using OpenGL there's so many
resources on the web is one of the
people who work with OpenGL love to
write about if I guess to I've seen
their names in print did you go to ww
OpenGL org and follow the links there
and there is tons of stuff out there
doing reflections correctly what
mistakes not to make all that stuff is
out on the web great stuff so what was
going to show you texture mapping ok
load texture res so what we're going to
do is we're not again go to the bigger
size so again so you can actually see
this animation oh good i have a coffin
on my machine my on my screen hear
someone yell if i get to the 55 mark
without finishing so I'm not gonna worry
about the setup here but I'm going to
basically do get picture res ID we all
know that if you actually get the
picture get pic info the reason I want
to get the pic info is cuz I want to get
the size of the picture I want to create
a new g world the size of that picture
if it's 32 bit I want to actually lost
the pixels remember to
check to make sure that the lock doesn't
fail as if it fails you're in trouble so
that's what we should always be doing
and the reason I say that actually is
partly because that's something you
should do and partly because as we move
forward to 10 and there are actual locks
and unlocks that matter locking pixels
if it doesn't let you lock it there may
be a reason you can't draw with it so
there really is something you should pay
attention to I draw a picture into the
offscreen G world i set the g world now
here is the magic really simple magic
here with tights tried base address
width is the width of the picture
price's the heights of the picture
stride is the actual Road a road
distance and bytes which is the row
bikes base address of the first address
of the buffer I create a new pointer so
I create a buffer for my texture that's
the size of the width and height and
three four one one bite for each RGB
components and then really simple what I
do is in this section I pull out I pull
out the this was offset by for
possessing a RGB so it's four bytes for
each component this is by three so it
does this RGB three bites and I pull out
the zero and I fault the red the green
the blue in order and then a simple call
for OpenGL now I have a buffer that's
its width x height that set up for for
the texture and I called GL text image
2d texture 2d three components with
pipes RGB unsigned byte sort of
components and the pointer to its buffer
dispose pointers suppose he rolled
release resource boom done that's all
you need to do to texture ok but you
have to get it to the screen I think I
have that somewhere ok a little little
trickery here that I'm not going to show
you today but you can look up this
buying texture thing I called buying
texture but I only want to load the
texture one so actually I load the
texture right here that call call bind
texture to say I want to pay attention
to the marble lightning or the face of
the mask so say pay attention to this
set these parameters for the texture
load the texture and then every time I
call bind textron pain I want to use
that texture
so they go back down here and I say fine
texture so I want to use a mask and then
go to draw cube and draw cube says
here's a texture coordinate 0 0 0 here's
the vertex coordinate which is a
position for the stats face vertex
texture coordinate 0 1 1 1 1 0 if you
notice I'm just walking around the
polygon I'm just boom boom boom all four
corners textures are going to be map 0
to 1 so what happens when your map is 0
to 1 it makes really easy for your map a
full text virtual polygons is used maps
the corners for the right place is 0 to
1 and simple it's gone done perfect
awesome we're done we're not done but
we're done with that so texture mapping
is not hard oh I think I think that's
all I need to need to show you on that
one so we solve that and then I have
swiveling texture update so text your
updates oh I'll show you this one this
is this is actually the demo I'm kind of
actually i think is actually reasonable
you want to see what Steven those guys
showed you want to see a different
trailer ok this is the large size of the
dinosaur trailer basically what it is is
quick time playing into an off-screen
and then playing it and it should you
should see it in a second so it's
actually dark to start with oh I'm sorry
one thing at kyanite is really dark can
you turn down this way turn down some of
these lights yeah turn them off I don't
you don't need to see me I'm ugly well
thank you I appreciate it ok open GL
texture and you can't see the cool part
is what's in which I've got you can't
really see is this is running a 9999
this is running to about a hundred
frames per second so its texture mapping
from a QuickTime movie on to the texture
at 100 frames per second so it's blowing
away the QuickTime movie is easily can
update at the rate to QuickTime movie is
and one thing i have here also is i have
fog setup so as it fades out at ashleys
fading that's why you get fit you get
the fade as it goes away so it actually
that's not that's not a mistake that's I
set it up on purpose of the black fog to
go out fade in fade out and there
actually is sound playing with and all
that stuff we don't have that hooked up
so but
not a big deal so this is a real simple
it's playing the trailer and if I click
it ends and if you notice that I can do
is just pick I'll play the same one they
always play you can leave the lights
down spell it posed any movie no no big
deal no tricks no no no awesome self so
can we do that at home right is that
easy you actually someone wants to bring
the lights up or leave them down and I
don't care and I have a couple minutes
here to actually show you how I did it
the texture texturing routine is almost
exactly the same i basically use some of
the some of the utilities that we have
out there i SAT around for about a
couple hours and figure out hey this is
not that hard to do and the key here is
I call I have movie the movie and let me
show you this section I want to show you
right there
that's my slog set up oh by the way this
is all that was required to send any fog
start a start and end linear flogged and
a fog color real simple but you enabling
I enabled textures at the top I set a
clear color which is really pretty
simple I empty my texture buffer which
is pretty simple to hear here here's a
quick time to texture conversion
basically what I'm doing is I look I
have at exercise and I want to set off
thats into subsample the movie and I set
these up ahead of time right here and
I'm going to put the code on the web so
people can really look at exactly how I
do it but the key is to find all your
offsets into an array so I can do an
array offset into the actual texture so
when I come down to make texture if you
notice basically I'm taking the offsets
into I get my my pics map which is the
pixmap for my for the movie base address
i got that i got i set up my array for
my texture and i work through this by
offsetting from my G movie which is the
texture into my using my base address
for the for the RGB and I offset
correctly into the array the rail is
already offset for the out to avoid the
alpha values a little trickery there but
not to complicate ass all the code that
does them to handle the texture if you
notice in this code that's all the stuff
to do the window moving and all I call
is make texture and then the key other
line is GL text sub-image 2d once I call
texture once i can call Geo textile mhm
2d doesn't recreate the texture all it's
going to do is update the contents of
the texture on the card so it keeps
filling stuff more of the car go faster
than admitting GL texture text image 2d
and I really don't want to go through
text image 2d I mean I guess I can run
it I'll do that so let's so let people
know that I don't think they're going to
you in too much of a degradation at all
in this but that's a different another
way to do it if you have textures that
are changing all time and i'll tell you
what the frame rate is 87 instead of 100
so i lost 10 frames per second by doing
it by doing it this way
so and you know if anyone's interested
they really want to see that do I know
you can't see the framerate counter up
there absolutely your we were welcomed
to come up and look at it and again the
code will be up so you can look at the
code and figure it out so if we can
switch back to this one you know him
nope nope I got it road map okay what
are we doing next to cook time in this
room right after this is the advanced
optimization John Stauffer has
graciously allow it has graciously given
his time to put some cool demos together
talk about optimization with quicktime
I'm sorry quicktime opengl and talked
about how to do that here to talk about
how to do that and then we have the
feedback form right after lunch please
did you have anything to say about
OpenGL about 3d direction on Apple come
to the feedback form we'd love to hear
any of your opinions comments goods
others whatever you have will take them
down and we'll take them in and try and
get you the best 3d implementation out
there anywhere