Difference between revisions of "BasecodeCSE167F19"
(Created page with "==Starter Code for Programming Projects== The purpose of this web page is to introduce OpenGL programming and set up your computer so that you can begin developing OpenGL app...") |
(→On OS X) |
||
(4 intermediate revisions by 2 users not shown) | |||
Line 9: | Line 9: | ||
For your personal computer we will show you how to download and install GLFW and configure Visual Studio/XCode to use it. | For your personal computer we will show you how to download and install GLFW and configure Visual Studio/XCode to use it. | ||
− | The starter code is [ | + | The starter code is [https://github.com/CalVR/CSE167StarterCode available here]. |
==UPDATE YOUR SYSTEM== | ==UPDATE YOUR SYSTEM== | ||
Line 23: | Line 23: | ||
Once that is done and you have unzipped your starter code, we're ready to begin configuring our Microsoft Visual Studio solution to work with OpenGL. | Once that is done and you have unzipped your starter code, we're ready to begin configuring our Microsoft Visual Studio solution to work with OpenGL. | ||
− | # Open | + | # Open Microsoft Visual Studio. Go to "File->New->Project From Existing Code...". |
− | # Open the '''NuGet Package Manager''' by | + | #:[[File:SC_Windows_1.png]] |
− | #:[[File: | + | # Create a '''Visual C++''' project. |
+ | #:[[File:SC_Windows_2.png]] | ||
+ | # On the next page, enter the path to the starter code as the project file location and enter a name for the project (whatever you like). | ||
+ | #:[[File:SC_Windows_3.png]] | ||
+ | # On the next page, create a console application project and click '''Finish'''. | ||
+ | #:[[File:SC_Windows_4.png]] | ||
+ | # Open the '''NuGet Package Manager''' by right-clicking your project on the left and select '''Manage NuGet Packages...''' | ||
+ | #:[[File:SC_Windows_5.png]] | ||
# Make sure you're in the Browse tab. Search for nupengl and install the '''nupengl.core''' package (NOT nupengl.core.redist). Alternatively, if you feel that this is too overkill (since nupengl contains 5 or 6 different commonly used libraries in OpenGL applications), download the glew and glfw packages (NOT the .redist packages). | # Make sure you're in the Browse tab. Search for nupengl and install the '''nupengl.core''' package (NOT nupengl.core.redist). Alternatively, if you feel that this is too overkill (since nupengl contains 5 or 6 different commonly used libraries in OpenGL applications), download the glew and glfw packages (NOT the .redist packages). | ||
− | + | #:[[File:SC_Windows_6.png|800px]] | |
− | #: [[File: | + | |
# Similarly, install the '''glm''' package. | # Similarly, install the '''glm''' package. | ||
− | #: [[File: | + | #: [[File:SC_Windows_7.png|800px]] |
# Now that we have all our packages, we just need to [https://en.wikipedia.org/wiki/Linker_(computing) Link] against the OpenGL libraries. | # Now that we have all our packages, we just need to [https://en.wikipedia.org/wiki/Linker_(computing) Link] against the OpenGL libraries. | ||
− | # We can do that by going to our project's(note: NOT solution) Properties. Right-click | + | # We can do that by going to our project's(note: NOT solution) Properties. Right-click your project in the '''Solution Explorer''' and select '''Properties''' |
− | #: [[File: | + | #: [[File:SC_Windows_8.png]] |
# Once in project properties, go to Configuration dropdown to change it to All Configurations. This will ensure we edit both the debug/release configuration at the same time, and don't have to repeat the step. | # Once in project properties, go to Configuration dropdown to change it to All Configurations. This will ensure we edit both the debug/release configuration at the same time, and don't have to repeat the step. | ||
#: [[File:VS_All_Configuration.png|800px]] | #: [[File:VS_All_Configuration.png|800px]] | ||
− | # Navigate to Linker->Input to prepend '''opengl32.lib | + | # Navigate to Linker->Input to prepend '''opengl32.lib''' to Additional Dependencies. |
− | #: [[File: | + | #: [[File:SC_Windows_9.png|800px]] |
# Change the active configuration to '''release''' for faster execution! If you want to do breakpoint debugging, remember that you'll have to change this back to '''debug''' to make sure you can see the variables. | # Change the active configuration to '''release''' for faster execution! If you want to do breakpoint debugging, remember that you'll have to change this back to '''debug''' to make sure you can see the variables. | ||
− | #: [[File: | + | #: [[File:SC_Windows_10.png]] |
# Once this is done, build and run the program(CTRL+F5) to see a spinning cube! | # Once this is done, build and run the program(CTRL+F5) to see a spinning cube! | ||
Line 48: | Line 54: | ||
# Select Command Line Tool as the template for the new project. | # Select Command Line Tool as the template for the new project. | ||
− | #: [[File: | + | #: [[File:OSX_XCode11_Setup_Command_Line_Tool.png|800px]] |
# Name your project any name of your choosing. | # Name your project any name of your choosing. | ||
# Upon completion, you should be presented with something like this: | # Upon completion, you should be presented with something like this: | ||
− | #: [[File: | + | #: [[File:OSX_XCode11_Setup_Project_Created.png|800px]] |
# Let's open the directory enclosing our newly created XCode project alongside the unzipped starter code directory. Drag and drop the files as shown below. | # Let's open the directory enclosing our newly created XCode project alongside the unzipped starter code directory. Drag and drop the files as shown below. | ||
#: [[File:OSX_XCode_Setup_Moving_Files.png|800px]] | #: [[File:OSX_XCode_Setup_Moving_Files.png|800px]] | ||
Line 58: | Line 64: | ||
All is good for now. We will come back to this later. | All is good for now. We will come back to this later. | ||
− | + | ====Install GLFW and GLM==== | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | # Begin by installing homebrew following this [https://brew.sh/ link], or type the following in your command line: | |
− | + | #* <code>/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"</code> | |
− | + | # Install glfw and glm with homebrew by typing the following in your command line: | |
− | + | #* <code>brew install glfw glm</code> | |
− | + | #: [[File:OSX_XCode_Setup_install_libraries.jpg|800px]] | |
− | Begin by | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | #* <code> | + | |
− | + | ||
− | # | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | #* <code> | + | |
− | # | + | |
− | + | ||
====XCode Setup==== | ====XCode Setup==== | ||
Line 99: | Line 80: | ||
#* Right click this folder and click "Add files to <project name>". | #* Right click this folder and click "Add files to <project name>". | ||
#* Choose the files as shown below and press "Add" | #* Choose the files as shown below and press "Add" | ||
− | #: [[File: | + | #: [[File:OSX_XCode11_Setup_Adding_Files.png|800px]] |
# Above this folder, you will see the top level which shares the same name as your project. | # Above this folder, you will see the top level which shares the same name as your project. | ||
− | #* Click this and choose the "Build Settings" option at the top. | + | #* Click this and choose the binary with the same name under TARGETS, then in the "Build Settings" option at the top. |
− | #* | + | #* Type "Search Paths" in the search bar. |
− | #* Add the following paths as shown below so XCode knows where to find all of the glfw and glm headers in our code | + | #* Add the following paths as shown below so XCode knows where to find all of the glfw and glm headers in our code. |
− | #** <code>/ | + | #** <code>/usr/local/include</code> |
− | #** <code>/ | + | #** <code>/usr/local/lib</code> |
− | #: [[File:OSX_XCode_Setup_Adding_Header_Paths. | + | #: [[File:OSX_XCode_Setup_Adding_Header_Paths.jpg|800px]] |
− | + | ||
− | + | ||
− | + | ||
# At the top of this window, click "Build Phases" | # At the top of this window, click "Build Phases" | ||
#* Open up the "Link Binary with Libraries" pull down | #* Open up the "Link Binary with Libraries" pull down | ||
Line 116: | Line 94: | ||
#: [[File:OSX_XCode_Setup_Adding_OpenGL_Library.png|800px]] | #: [[File:OSX_XCode_Setup_Adding_OpenGL_Library.png|800px]] | ||
#* Press the "+" sign again and choose "Add Other..." | #* Press the "+" sign again and choose "Add Other..." | ||
− | #* Navigate to / | + | #* Navigate to /usr/local/lib, choose "libglfw.dylib" and press "Open" |
#: [[File:OSX_XCode_Setup_Adding_GLFW_Library.png|800px]] | #: [[File:OSX_XCode_Setup_Adding_GLFW_Library.png|800px]] | ||
+ | #* Open up the "Copy Files (0 items)" pull down | ||
+ | #* Select "Products Directory" as the Destination | ||
+ | #* Clear subpath field and uncheck the "Copy only when installing" box. | ||
+ | #* Click on the little "+" sign and choose shaders. | ||
+ | #: [[File:OSX_XCode_Setup_Add_Shaders.png|600px]] | ||
# Optional: We like to see a good frame rate, so we prefer you run in Release (at least during the grading demo). | # Optional: We like to see a good frame rate, so we prefer you run in Release (at least during the grading demo). | ||
#* Open Product > Scheme > Edit Scheme, and choose "Release" | #* Open Product > Scheme > Edit Scheme, and choose "Release" | ||
#: [[File:OSX_XCode_Setup_Release_Mode.png|800px]] | #: [[File:OSX_XCode_Setup_Release_Mode.png|800px]] | ||
# Run that baby (press the play button at the top left or press Command + r). Note that the default color of the cube may change depending on what quarter it is (we like being different). | # Run that baby (press the play button at the top left or press Command + r). Note that the default color of the cube may change depending on what quarter it is (we like being different). | ||
− | #: [[File: | + | #: [[File:OSX_XCode11_Setup_Running.png|800px]] |
− | + | ||
==On Linux== | ==On Linux== | ||
The staff don't officially support Linux, but the ingredients you'll need are GLFW3.x.x, GLM 0.9.x.x, and GLEW 1.10+.x. You might be able to find these libraries in your favorite package managers, but make sure the versions are sufficient/compatible. | The staff don't officially support Linux, but the ingredients you'll need are GLFW3.x.x, GLM 0.9.x.x, and GLEW 1.10+.x. You might be able to find these libraries in your favorite package managers, but make sure the versions are sufficient/compatible. |
Latest revision as of 21:43, 26 September 2019
Contents |
Starter Code for Programming Projects
The purpose of this web page is to introduce OpenGL programming and set up your computer so that you can begin developing OpenGL applications.
In order to display an image, you must create a drawing canvas, which is essentially a window. With OpenGL, you create a window and then create an OpenGL drawing context associated with that window, which allows you to use your video hardware to draw 3D objects directly into that window. Opening that window and creating the OpenGL context is cumbersome and varies from system to system. The purpose of GLFW is to simplify and unify this initial step.
The PCs in the computer lab already have GLFW and Visual Studio installed. It is also possible to run your projects on the lab computers in the AP&M basement, though you may need to go through the given setup instructions before the projects can work.
For your personal computer we will show you how to download and install GLFW and configure Visual Studio/XCode to use it.
The starter code is available here.
UPDATE YOUR SYSTEM
We're using modern OpenGL (at least 3.3+, but some systems with OpenGL 3.1 somehow have forward compatibility to 3.3) which came out in 2010, meaning most recent systems should support it by default. However, just in case, make sure your graphics drivers are updated to the latest version.
- Windows: Update your graphics driver to the latest version. If your graphics card is too old, replace your graphics card or use a different computer.
- OS X: Update your OS X version to at least 10.9. OpenGL is tied to your operating system version.
On Windows
The very first thing you'll be doing is downloading and installing the Microsoft Visual Studio 2017 Community Edition for free.
Once that is done and you have unzipped your starter code, we're ready to begin configuring our Microsoft Visual Studio solution to work with OpenGL.
- Open Microsoft Visual Studio. Go to "File->New->Project From Existing Code...".
- Create a Visual C++ project.
- On the next page, enter the path to the starter code as the project file location and enter a name for the project (whatever you like).
- On the next page, create a console application project and click Finish.
- Open the NuGet Package Manager by right-clicking your project on the left and select Manage NuGet Packages...
- Make sure you're in the Browse tab. Search for nupengl and install the nupengl.core package (NOT nupengl.core.redist). Alternatively, if you feel that this is too overkill (since nupengl contains 5 or 6 different commonly used libraries in OpenGL applications), download the glew and glfw packages (NOT the .redist packages).
- Similarly, install the glm package.
- Now that we have all our packages, we just need to Link against the OpenGL libraries.
- We can do that by going to our project's(note: NOT solution) Properties. Right-click your project in the Solution Explorer and select Properties
- Once in project properties, go to Configuration dropdown to change it to All Configurations. This will ensure we edit both the debug/release configuration at the same time, and don't have to repeat the step.
- Navigate to Linker->Input to prepend opengl32.lib to Additional Dependencies.
- Change the active configuration to release for faster execution! If you want to do breakpoint debugging, remember that you'll have to change this back to debug to make sure you can see the variables.
- Once this is done, build and run the program(CTRL+F5) to see a spinning cube!
On OS X
First, let's make sure we have all of the starter code downloaded (linked above).
Once you have unzipped the project, open XCode and create a new project.
- Select Command Line Tool as the template for the new project.
- Name your project any name of your choosing.
- Upon completion, you should be presented with something like this:
- Let's open the directory enclosing our newly created XCode project alongside the unzipped starter code directory. Drag and drop the files as shown below.
- If presented with the option, replace the already existing files (main.cpp in this case)
All is good for now. We will come back to this later.
Install GLFW and GLM
- Begin by installing homebrew following this link, or type the following in your command line:
-
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
-
- Install glfw and glm with homebrew by typing the following in your command line:
-
brew install glfw glm
-
XCode Setup
The last step is to set up XCode to find where we put all of our code, libraries and headers
- Open up the XCode project
- In the far left panel of the Xcode window, you will see a folder matching the project name.
- Right click this folder and click "Add files to <project name>".
- Choose the files as shown below and press "Add"
- Above this folder, you will see the top level which shares the same name as your project.
- Click this and choose the binary with the same name under TARGETS, then in the "Build Settings" option at the top.
- Type "Search Paths" in the search bar.
- Add the following paths as shown below so XCode knows where to find all of the glfw and glm headers in our code.
-
/usr/local/include
-
/usr/local/lib
-
- At the top of this window, click "Build Phases"
- Open up the "Link Binary with Libraries" pull down
- Press the little "+" sign and type "OpenGL"
- Choose "OpenGL.framework" and press "Add"
- Press the "+" sign again and choose "Add Other..."
- Navigate to /usr/local/lib, choose "libglfw.dylib" and press "Open"
- Open up the "Copy Files (0 items)" pull down
- Select "Products Directory" as the Destination
- Clear subpath field and uncheck the "Copy only when installing" box.
- Click on the little "+" sign and choose shaders.
- Optional: We like to see a good frame rate, so we prefer you run in Release (at least during the grading demo).
- Open Product > Scheme > Edit Scheme, and choose "Release"
- Run that baby (press the play button at the top left or press Command + r). Note that the default color of the cube may change depending on what quarter it is (we like being different).
On Linux
The staff don't officially support Linux, but the ingredients you'll need are GLFW3.x.x, GLM 0.9.x.x, and GLEW 1.10+.x. You might be able to find these libraries in your favorite package managers, but make sure the versions are sufficient/compatible.