Setting up OpenGL and Creating a Window in C++

Hey What's up Guys My name is The Cherno and welcome back to my opengl series! So this is really the first episode of My Opengl Series last time we just talked about what opengl actually was, a little bit about how it worked and also what this series would actually contain if you Guys haven't Seen that video then check it out in that corner Today though we're actually gonna Jump in and write some code we are gonna get some work done we're going to get an opengl window displaying and maybe even draw a triangle with this series specifically I want to take a more practical approach with the C++ series I did a lot of explaining, a lot of theory before we actually started writing code i still want to do that for this for this series because i believe it's very important to understand actually how everything Works But With These Kind of first few episodes I just want to get some code done i just want to actually write some code and have something happening on the screen so that hopefully you guys can kind of feel that sense of progression a little bit better and then what we'll actually do is end up kind of as that goes on maybe once a week or so Have a Bit of a Theory video and Just Talk about how OpenGL specifically works or what Actually happens behind the scenes Now that being Said our Goal for Today is going to be Just to create a window right i want to be able To have My operating System create a window for me so if my application is Actually in the form of a Window and then Hopefully The Goal with that is that in the future we can Draw all of our Graphics inside that Window Now this series specifically i want...want To have Multi-Platform Support Right I want People Who are writing this code on Windows Mac and Linux to also be Able to run this code and It Should Work on all three Platforms What that means though is That We Need to we need some way to set up windowing and Windowing on and Always creating Windows Is Very Very Platform Specific so in other Words the way that you the way that you create a window on Windows is you use the Win32 Win32 api, right so you Actually use the Windows Api to Say Hey i want a window Because of Course the way that You create a window is going to be specific to the operating System you're using Because That's like an operating System Level Thing and That's What i probably Would do if i was writing a game engine i Would Probably Just take The time to actually set Up a Window Myself using the Actual operating Systems Api For Each Platform That i Actually want to support This series though Isn't about How to write a game engine That's gonna Be another series Later on This series are specifically about opengl and how opengl Works and how To write opengl code so we don't really care about. How to set up a Window all That We Just want to write some opengl code and so because of that i'm Actually gonna use a library that Will basically do that for Me and all This Library is going to do is provide me with the appropriate platform Layer so in other Words it's going To provide me with an implementation of That windowing creation code and management code as well for Windows Mac and Linux So that Everyone can Follow Along With That and there are several libraries That Allow Us to do this But the one that we're gonna use is something Called GLFW and the reason that i like GLFW is Because This is a Really Kind of Lightweight Library all it's going to do for us is create a window create an open OpenGl context and Give us access to some basic Things like Input That's all That it's going to do it's not like SDL which is like a Full Kind of They've actually Got like a Renderer There so that You can Draw Squares or triangles or whatever you want to the screen and That'll be Implemented in Either Directx or Opengl and That That's like a Whole Kind of framework i don't want any of That we're going to be writing our own stuff All i want to do is automate that first step of: I want to create a window and i don't want To have to write different implementations for each Platform I want this code to be pretty multi-platform Pretty portable so i'm going to use library like GLFW Just be that off for me Again i could Write It Myself But That Would Mean writing It three Times for each Platform Windows Mac and Linux in this case and That's Just gonna be waste time and not Really the point of the series So Just Want Everyone to understand Why i'm actually Doing this So yeah Let's Go ahead and download GLFW if You go to the url that is in the description Below Which is GLFW.org You'll be taken to this page we care about basically Two Pages Here first of all There's Just download GLFW 3.2.1 it's Exactly What we want but also on the Documentation, There's Actually Some Example code of how to create a Window in GLFW. you can See that it's very Very concise right All We have to do is basically initialize GLFW and then We Could Just create Our window and That's as simple as that if you want to make our opengl context We Just Call This One Function and Then we Can Start a Basic Loop to poll for events and make sure that When our window is closed It Actually Closes and you Can See we can Write opengl code right Over Here it's it's Very Very simple and it's Pretty Much Exactly. What we Need to get started So up in the top here i'm gonna go back to GLFW so this download is Actually for all of the source code This is another Thing that i want to mention if i was writing if This Was a Game engine Series of something i was actually Making a Serious application i Would Probably download The source code and Build It Myself i Would add It as a separate project and Visual studio and probably compile it into a static library and Then Link It with My main Application Just so that if i Need to debug something i had the source code right there and there's Really no downside to do that I like having as Much source code as i can in my Project However This again is about opengl we don't waste time with that all i'm going to do is Just get pre-built Binaries for My platform and Just Build with That right so to do that I'm Going To go to download and then You can see we have Windows Precompiled Binaries so Windows Actually Has prebuilt Binaries linux and mac it Says that you Actually have to downloading and compile source the package above There's a Guide so follow that if you're one One of Those Platforms i suspect People will probably Run into problems with that Because it's Not the most Trivial task and With like Make systems like That It Just tends to be all over the place so if you Need Help with compiling this Format for Linux Definitely Join My discord at thecherno.com/discord there will be Plenty of People There Who will be happy to help you out with That but Specifically since we're on Windows and we Will be for the entirety of This series I'M Just going to download the appropriate Binaries another note Here we Have 32-Bit or 64-Bit Binaries Question i get all The time Which one do Which one do i Get right a Lot of People Seem to think that well i'm running 64-Bit Windows so of Course i want 64-Bit Windows Binaries That's all That's not Correct What you Actually want the the architecture That matters is the architecture that you're Building for right if we Set Up our Visual studio project to build for Win32 or X86 then we want to get the 32-bit ones if our application is being Built for 64-Bit or x64 right That's where we want the Binary so it's Actually the base what matters is the architecture the platform of Your Application so how You compile your application Not Not the operating System you're Using Of Course the 64-bit application won't Work on a 32-Bit operating system but if you're on a 64-Bit operating System Like Windows 10 64 bit you can Run either 32-bit applications or 64-bit applications so the One that you actually download is going to Depend on On what you compile your application With so we'll Just be using a 32-bit application Because we don't Need a 64-Bit one For more Serious projects i probably use 64-Bit There's no real difference It's easy to switch as well it's not like a Whole deal it's not like we have to write different code or anything most of The time it's Pretty Much The same Thing but to keep It simple we're Just gonna Use 32 bits over Here i'm gonna click on 32-Bit Windows Binaries and download That ok So inside the archive that You download there'll be a GLFW folder and a Bunch of Libs we'll Talk about setting all that Up In a minute but first We Actually Need to create a Visual studio Solution So every here i've got Visual studio community 2017 i'm going to click file -> new and then Project I'm going to make sure that i'm under Visual C++ and General and Select empty Project as My template we're Just going to make a Brand New Project from scratch in the Location I'm Actually going to change Location from being in my documents To basically being C:/dev/YouTube/opengl you can Set This to anything else i like to have i like to keep all of My development Kind of Stuff Under C:/dev that Way it's not in a user folder and i don't Have to deal with all that so Just C:/dev and then OpenGL or whatever i've Just put it into a YouTube folder Because of Course this is for the YouTube series I'm going to call This opengl and Just Click ok Okay so we've got a Visual studio solution and project setup everything Looks Pretty Good if you want to set It up properly and more or less Just set It up in a Nicer Way because the Default Visual studio Way that It sets Up new projects and solutions Is a Bit It's a Bit Weird Check out my video on my Kind of favorite Set Up for Visual studio for C++ so there'll be a Link Up there I'm not gonna go through all That Right Now it's Just gonna take time That's not Really about Necessary but definitely Check out that video If you want to know how i would set This Up properly so again all we're Doing Today IS we're trying to set up GLFW Basically as Quickly As possible so in the source files well one Thing i'll Actually do is i'll click on the project name i'll Click on Show all files and then I'm going to Actually make a New folder Here called src for source so in this show all files mode Actually Will mimic our Windows Explorer file structure and Directory structure and all That Again That's all Described in the video that i linked Up there so check That Out if you're not sure Under There i'm going to add a New item i'm going to call This "Application.cpp". This going to be our main file the file with the main Function I'll hit add and i Finally Just have a Normal C++ file in my project what i'm going to do now is Just Basically Include iostream and Make sure everything is set Up in main i Just Type in std::cout hello and std::cin.get() i like to do this Just to make sure everything's set Up and everything Will compile you can see we Get this Opening With Hello Which is perfect so now i'm ready to actually link GLFW and get it to work if i go back to the GLFW website so here under Documentation Literally All I'm going to do here is Just copy pretty Much This in this source code Just in its entirety Copy And Just paste it over here okay when you get a bunch of Things not Working Because of Course when you actually Setup the library so let's talk about how i'm gonna set up GLFW in our project i'm going to go to that Zip archive that i Downloaded with all of our libs there are two things that Matter for us here every Kind of C++ library has include and Also Lib Right so we're going to talk more in Depth about how C++ Libraries Work and how to link them and all the differences between all that in a future video in the C++ series it'll Be Linked Up there if it's already made but definitely Check that out if you're not sure about how Kind of Libraries Work in C++ but Out of Here what we care about is the lib file there's Actually Two Here the two lib files that we have Here you can see one Is Labeled with dll so This One's Used for Dynamic Linking If You want to use the dll to link Up runtime "glfw3.lib" Is the one that we're going to use though Because That's Just for static linking we don't want to link GLFW Dynamically we Don't want to have to use a dll file There's no reason for us not a static link yet so we're going to link It statically so what I'm going to do is under Opengl Just gonna right Click on there hit open folder in file Explorer so that We Actually get to our Location of all of This And What i like to do is in the solution directory so this is the solution Directory The Directory with That Solution file i'm going to make a New folder Called Dependencies and inside Dependencies I'm gonna make a Folder Called GLFW and then it's like Here i'm Actually going to put all the files that i want So out of What i want in this Actual archive that i downloaded i want include and i wanted to live Vc 2015 Which is the latest Visual studio version that We Have Here we'll paste this into here of Course we're Actually using Visual studio? 2017 although It won't Matter for our Purposes It will still Work inside here i can Actually delete that dll file and The dll lib as Well we don't Need that and include Should Just Have everything We Need so now what We Actually Need to do Is tell this project that i want you To also include this folder for includes so that we Can Write code such as "#include <GLFW/glfw.h>" right so we Need to add an include directory and then We also Need to add This Lib file to the Linker so that the Linker Actually Links This loop file in and It can Match Up all of The GLFW Functions so let's take a look at How we might set that up What i'm going to do is right click on openGL Hit Properties Now The most important Thing Here i'll Just Make This smaller the most important Thing Here is that youR all Configurations okay and all Platforms is Really Matter we're Just Messing With Wouldn'T that you do for now but all Configurations Make sure you're on all configurations and not Like release If you're editing release and you're Actually in debug It's not gonna Affect your currently selected Configuration You all you Get errors so we want all Configurations Under C C++ in general we're going to add an include Directory now What we could do Right Is open up our folder here and Just Basically Copy this path and put It in there now we don't want To do that though Because Other People Who will use this project might not be storing it in C:/dev/YouTube/opengl blah blah We Actually want to make a relative to the project itself and specifically i like Making It relative to the solution Directory Now Visual studio has a Macro for us that is Actually Ours Current solution Directory if we if we Open This Tab Here and Go to macros Then You can Actually Type in solution directory and You'll see what it Actually is is C:/Youtube/openGL so basically What It is is the Actual Solution Directory That We Have Here the directory that has this solution file and we're Actually going to based our Our Our include directory path from that Solution directory so i'm going to type in solution Directory That Actually Already Has a Backslash at The end a trailing Backslash so next we'll go into Dependencies opengl and include in fact all I'm going to do is copy that last Part and put it over here? Okay that is our include directory if you want to make sure it's Correct You can Go to edit here and look at The evaluated value if You copy that into YouR file Explorer and Hit Enter It Should take You to well GLFW and of course Now that You've set that up on The Over here this "#include <GLFW/glfw.h>" Should Work Because we Start in This include directory we're going to the GLFW folder and there's glfw.h ok so That's how we can Set Up the include directory next i'm gonna set Up my library directory as Well so on the linker in General I'm going to specify an Additional Library Directory This Could Be Very Similar to what we had before gonna start off with Solution Directory It's going to go to dependencies In fact i'm Just gonna go back to my folder and copy the path So under GFLW we Have lib Vc 2015 and there there it is right so grab That Check that in here and we're good to go on The input i'm Actually going to specify Which file we want to link Now we don't Actually Need to link all of these i don't Know Why they here they Feel but Kind of by Default But They're Actually Included in Default Libraries so we can Get Rid of All That to keep It nice and clean and Just Type in glfw3.lib so basically we're linking With This glfw3.lib file Again if I'm going Too fast or anything i will make a video specifically about This in more detail i Just don't want to spend all day on This so check That Out tear that video out iF it's already made it's not then Just wait Now another Thing we Actually have to link with is Opengl But well we'll do It in a minute i'm going to hit ok Because That's all we'll Need for Now you can see That All of our compiler is go away if we Hit Ctrl F7 to Actually compile our application You can See each compiled Successfully Now it's not gonna Link Successfully Because We Haven't Actually you can See we're using an opengl Function Here but we haven't Links with opengl? But They can't the compilation Succeeds and That's Kind of all we care about for now now if i right click Build This it's Actually Going to compile It and link the entire application so let's take a look at That okay so we get a Few Things first of all we Have an Unresolved external Symbol again i Don't i'm not a big fan of Looking at The Actual error list you Should Be Looking at The output because They are a list Is Just Mostly Lies Well not in this case but It can be and this Always Gives you more detail Ok this Kind of Default Lib Conflicts don't Worry about that That's Just a warning and specifically it's an Annoying Warning That we don't Need to think about fixing even it's not that important This is important However we have GL_CLEAR Is an unresolved exception We Also Have a Bunch of Window Stuff That is Unresolved Now because i did actually delete most of the Libraries that We Leaked Again so we'll bring some of them back in a minute but the first one that we're getting Which we'll fix first is Gl_Clear ok and we Can Actually Get Rid of That error By Linking with The opengl library so What's happening is we're getting a Linking error if you guys don't Know how to C++ linker Works Check out that video because i have already made that but Basically? What Link is trying to do now is find a definition for that Gl clear Function That gel clear Function definition Is inside an opengl Library file so we Actually have to link against that so Our view here in Additional dependencies I'M Just gonna add a Semicolon Type in opengl32.lib If i hit ok and i Build This you can see that that first error Should Go away and in fact Now the first time resolve a Sternal Symbol is Just register device notification Stuff Which is basically Windows Kind of Api stuff So let's Go ahead and add that in Now before we do that i actually Want to show You one Way that you can find these Things i've deliberately Gotten Rid of all the Kind of Windows and Clothes Because i Wanted to show You Guys how this Actually Works and how to set it up Kind of Really From scratch but if you see errors like this Because They Actually do tend to be quite fog quite common sometimes if you don't set Up correctly you can See that the Function name is Actually registered device notification W so let's grab That and copy that Actually Googled that so on Msdn I'm Just gonna Google That you can see we're actually created with Msdn here Which is the microsoft Documentation so this is the Actual Function That we're trying to link and we don't know where it is so if we scroll down you Can Actually See that the Library that it's in is user 32 lib So what we can Do is copy that and Actually Link with that and that that Will actually go away so over here i'll Just Type in user 32 lib Hit Enter Hit ok and try and Build us again you can see that we Get Way less Errors Now we've only Got Just a Handful now and A few of them are Basically create device context Here and swap buffers and all That Stuff so again When i do the same thing With This i'm gonna Copy this i'm going to go to im going to go over to the Google Just Basically Google That Function Click on the Msdn link scroll down and you can See This one is in gdi $32 lib so back to my project and i'm going to link against gdi32.lib Okay i'll hit ok and try and compile My code again alright Just a Few more Now drag query file W again copy that paste it in here msdn and here it is shell32.lib so back over here you guys Kind of Get the drift shell 32 dot Lib okay and Build alright awesome No errors at All If We Hit F5 or Just Local Windows debugger to Run our Actual application you can See that we Get a Black Screen Now all this Manual Linking That i've Just done you don't need to do that Yourself When you create a New empty project in Visual studio Like We did you can see it actually did have a Bunch of Links Already Including Like Kernel32.lib and Stuff Like That i Just wanted to get rid of them Just to show you how it Actually Works and how to link everything Kind of from scratch i Hope You don't Need to do that They're Just this was Just Kind of As an Example Now we've got a Black Screen Here let's quickly draw a Triangle Now what i'm Actually gonna do to Draw This triangle is use legacy openGL so in the first video we talked about What a Legacy opengl Was and Why we Shouldn't be using this Legacy Opengl Is the fastest Way that i can Now in Like five Lines of Code Draw a Triangle on the screen and My purpose right Now is Just making sure that opengl is Up and running Not writing again I'm not writing a Graphics engine Right Now right so Whilst you Shouldn't Be Using like a Seat Opengl like in i guess professional applications Is Perfectly fine for Debugging People Need to realize that even though some Things are Discouraged if You're Just writing It temporarily to test something There's Absolutely nothing Wrong With it so Here's Keep That in mind so what we're gonna do over here i'm to jail Clear Because i'm Actually Just gonna Type in Jail Begin Jail Triangles and This you and you Guys Will Kind of get it to Experience and Legacy Opengl Cars so between Jail Beginning Gl end we Just want to specify Three vertices i want to type in jail vertex to f which is going to specify it to component Kind of Vertex or 2d i Guess Vertex Now by Default our Projection Matrix in opengl Is Between negative One and one in all in every dimension in Every Axis we'll talk more about projection matrices and all This fun Stuff in Future videos Again Just Trying to draw a Triangle Now so i'm going to type in negative 0.5 F and then negative 0.5 F for y as well and Then for my other Ones i'm going to maybe Make This one in the Middle so it's going To be Just 0 f for x and also a positive 0.5 F for y and this One's going to be positive 0.5 for x and negative 0.5 for Y so i should be drawing a Triangle That is basically in this Shape Let's hit F5 and you can See that i get a triangle is perfectly Kind of be in the Middle of My Screen and looks Pretty Good okay so we can Now conclude That Opengl Is Working and That's gonna wrap Up this video we've Basically accomplished everything We Wanted to we've got an opengl window Everything Right Now is in our application file We are probably going to move it Just into a class or something Just to keep It a Bit more simple we'll do That Next Time But Overall Again we're not going to spend Too Much time creating an Api for Ourselves Because we want to learn opengl so we've got something Up and running You Guys can recreate This code on youR computer and Hopefully Get something as Well so you can Finally Making a Nice Little cute opengl application Which draws a single Triangle Exciting Stuff i know If as we Go as we Go on What Kind of deal with more Stuff Now for all the code in this series i do Actually encourage That You copy it down Yours Sells Because when you actually Copy code even even though You are Just Copying from a Screen You Actually Learn It Because you're typing it out Yourself it's like When you meet someone New a Lot of Times you'll meet someone you don't introduce Themselves and Say Their name and Then You'll Just Forget Their Names Right Away but if you Actually Say Their name back to them like Hello bob Then You'll Actually You're Way more Likely to remember their name right so Kind of with This as Well i like i like the idea of People Actually Copying Code down Themselves and Actually Physically Typing It Themselves Because Once You do That Muscle Memory Will Kind of Kick in and You'll Actually Learn a Lot Faster that being Said if you really want the source code i Am Actually making That available to patrons so if you pledge on the show no tocom slash Patreon i'll Sorry If You Put on patreon a Conference after China Probably make the show not a complex patron Work as well but if you go to patreon.com/scishow No and you pledge Their you help Support this Series You will actually Get access to the code on github and that Will be separate for Each Episode as Well Just Like It is for my other Other Series so if you really want to source code that You Really want to Help Spoil The Series it's Just You Basically You Just Get a reward for Helping to support the series and making sure that i can Make more videos There's also a Bunch of Other Rewards on patreon of Course after Jenner So i really appreciate all the Help i Get from there and That's What Basically Lets me Sit down and make These videos properly so much appreciated Anyway Next time we're gonna abstract This Out into a class and Actually Talk about a Modern opengl Because What we've done right Now is we've created an opengl Context and a Window and everything we're Actually Only Limited to using opengl 1.1 Which is what ships with Windows Windows Doesn't Windows Has Its own Rendering Api Direct x Direct3d so they don't Actually provide you will the Functions you need for Modern Opengl As i mentioned in the welcome to opengl video That's provided for us by our Gpu drivers so what We Need to do next time is Actually somehow get all Those Functions that are in newer versions of Opengl App From Algae and from our Gpu drivers so that We Can Actually What We want to be Able to call the functions right so That's what We Need to do in this What we'll talk about Next Time A little probably Moving This out into a class and all That Fun Stuff and Then That's When the real funs gonna Begin Next time so i'll see you guys in the next video Goodbye it's true

Channel: The Cherno

Views: 507,898

Keywords: thecherno, thechernoproject, cherno, c++, programming, gamedev, game development, learn c++, c++ tutorial, opengl, glfw, library, setting up, getting started, graphics programming, graphics

Id: OR4fNpBjmq8

Length: 22min 3sec (1323 seconds)

Published: Sun Sep 24 2017