Upgrade to Pro — share decks privately, control downloads, hide ads and more …

1. Introduction to OpenGL

1. Introduction to OpenGL

94870c02836167043f37f05ae1032690?s=128

Tatsuya Yatagawa

April 06, 2021
Tweet

Transcript

  1. 1. Introduction to OpenGL Tatsuya Yatagawa

  2. What is OpenGL? ◼ OpenGL (Open Graphics Library) ◼ Standard

    library for 3D graphics programming ◼ Khronos Group manages OpenGL ◼ OpenGL features ◼ OS independent (it works on Windows, Mac etc.) ◼ Hardware independent (it works on every CPU, GPU) ◼ Others? ◼ DirectX: Graphics library for Windows (by Microsoft) ◼ Metal: Graphics library for MacOS (by Apple) ◼ Vulkan: Modern (but super-complicated!) graphics library (by Khronos Group) Computer Graphics Course @Waseda University
  3. How can we use OpenGL? ◼ No installation required! ◼

    Already installed when your OS is setup. ◼ But, you should use utility libraries ◼ OpenGL itself does not have OS-dependent features ◼ E.g.) Show up windows, mouse and keyboard interaction. ◼ GLUT (GL Utility Toolkit), GLFW (GL Framework), Qt, openFrameworks are famous utility libraries ◼ This course uses GLFW (it’s basic and good for study!) Computer Graphics Course @Waseda University
  4. GLFW ◼ GLFW (OpenGL Framework) ◼ Utility library for easily

    using OpenGL ◼ GLUT is quite similar, but is rather out-dated ◼ Pros of GLFW ◼ OpenGL version is controllable (4.6 is latest version in 2020) ◼ Easy to implement OS-independent programs ◼ Possible to implement object-oriented programs ◼ Cons of GLFW ◼ GLFW provides minimum (but often enough) functions ◼ Compared to Qt/openFrameworks, source code will be longer Computer Graphics Course @Waseda University
  5. Download GLFW ◼ Access https://github.com/glfw/glfw/releases ◼ Click “glfw-3.x.x.bin.WIN64.zip” in the

    list Click here! Computer Graphics Course @Waseda University
  6. Where to place GLFW files? ◼ Recommends ◼ Make a

    folder at C:/graphics/lib/ ◼ Place “glfw-3.x.x.bin.WIN64” in this folder after renaming it to “glfw” ◼ Locations of your source codes ◼ Make a folder at C:/graphics/src/ ◼ Inside this, make “Day1”, and include source codes in it. Computer Graphics Course @Waseda University
  7. Quick introduction to Visual Studio ◼ Visual Studio ◼ IDE

    for multiple languages by Microsoft ◼ In this course, we use it for C++ ◼ Both code editor and compilers are available ◼ Latest version is Visual Studio 2019 (in Mid 2020.) ◼ Terms for Visual Studio ◼ Build: ◼ Compile source codes and link binaries. ◼ Project: ◼ Set of source codes for building a single executable (or library). ◼ Solution: ◼ Set of projects to provide a solution to your problem. ◼ For this course, you should use 1 solution to 1 class. Computer Graphics Course @Waseda University
  8. FAQ ◼ I’m a Mac user! ◼ Use Homebrew (https://brew.sh/index)

    ◼ Only what you can do is type “brew install glfw” on terminal ☺ ◼ Be careful, homebrew needs Xcode installation (it takes hours!) ◼ What editor should I use? ◼ Visual Studio would be the best (it’s free!) ◼ For Mac users, VS code would be the best choice (sorry, but please setup by yourself). ◼ You should prepare “launch.json” and “tasks.json” for your convenience (check by yourself for details) Computer Graphics Course @Waseda University
  9. Install IDEs (start now!) ◼ Visual Studio Community (for Windows)

    ◼ Access: https://visualstudio.microsoft.com/ja/vs/community/ ◼ Download and install it. ◼ When installing, please tick the package “Desktop development with C++”. ◼ It may take hours! ◼ Xcode (for Mac) ◼ It’s necessary even if you use VS code as an editor. ◼ Install it through Apple Store app. ◼ It may take hours! Computer Graphics Course @Waseda University
  10. Start Visual Studio ◼ Search from application list (with Win-key)

    ◼ Following display is shown up ◼ Proceed to click “Continue without code” Computer Graphics Course @Waseda University Click here
  11. Create a new project ◼ From “File (F)” menu, choose

    “New (N)” → “Project (P)” Computer Graphics Course @Waseda University
  12. Create a new project Computer Graphics Course @Waseda University 2.

    Find out “Empty project” 3. Press “Next” to proceed 1. Specify language as “C++”
  13. Project settings ◼ For example, each item is set as:

    ◼ Project name: Program01 ◼ Location: C:/graphics/src ◼ Solution name: Day1 Computer Graphics Course @Waseda University
  14. Add another project ◼ While you’re opening a solution, ◼

    File(F) → Add(D) → New project(N) Computer Graphics Course @Waseda University
  15. Add a new project Computer Graphics Course @Waseda University ◼

    Setup project as you did to create one Add a project to solution when you work on an assignment (1 project for 1 assignment)
  16. Settings for GLFW ◼ Property sheet ◼ Setup include (for

    header files) and library directories ◼ This can skip common settings for different projects Computer Graphics Course @Waseda University
  17. Settings for GLFW ◼ Show up “Property Manager” ◼ View(V)

    → Property manager(N) Computer Graphics Course @Waseda University
  18. Add a property sheet Computer Graphics Course @Waseda University ◼

    Add a new property sheet ◼ Right click “Release | x64” in “Program01” ◼ Choose “Add new property sheet(P)”
  19. Add a property sheet ◼ Specify name and location ◼

    Name(N): OpenGL.Common.x64.props (Extension necessary!) ◼ Location(L): C:/graphics/src/props/ Computer Graphics Course @Waseda University
  20. Edit property sheet ◼ Double click the name of sheet

    Computer Graphics Course @Waseda University
  21. Setup include directory Computer Graphics Course @Waseda University ◼ On

    “VC++ directory”, ◼ Click down arrow at the right of “Include directory” ◼ Choose “Edit”
  22. Setup include directory ◼ Click “new folder” icon (see figure

    below) Computer Graphics Course @Waseda University
  23. Setup include directory Computer Graphics Course @Waseda University ◼ Then,

    choose C:/graphics/lib/glfw/include
  24. Setup library directory ◼ For library directory in “VC++ directory”,

    ◼ Choose C:/graphics/libs/glfw/lib-vc2019 Computer Graphics Course @Waseda University
  25. After setup Computer Graphics Course @Waseda University Notice: lib-vcXXXX for

    library directory can be changed depending on your VS version
  26. Setup additional dependencies (library names) Computer Graphics Course @Waseda University

    ◼ On “Linker” → “Inputs” → “Additional dependencies” ◼ Choose “Edit” from pull-down menu
  27. Setup additional dependencies (library names) Computer Graphics Course @Waseda University

    Add “opengl32.lib”, “glu32.lib”, and “glfw3.lib”. (Need line breaks!)
  28. After setup Computer Graphics Course @Waseda University Then click “OK”

    to close window.
  29. Save property sheet ◼ Make sure setting on the sheet

    is saved! ◼ Every time after setup, click “Save OpenGL.Common.x64”. Computer Graphics Course @Waseda University
  30. Add existing property sheet Computer Graphics Course @Waseda University ◼

    You can use the sheet in other settings. ◼ Right click “Debug | x64” Choose “Add existing property sheet (E)”
  31. Add existing property sheet Computer Graphics Course @Waseda University ◼

    Choose the sheet you created before
  32. After setup Computer Graphics Course @Waseda University ◼ Make sure

    the sheet is set to both “Release | x64” and “Debug | x64”
  33. Add source code Computer Graphics Course @Waseda University ◼ Add

    a C++ source for project ◼ From “Solution explorer” at the side (maybe at left or right) Right click “Program001” → “Source Files” Then, choose “Add(D)” → “New item(W)”
  34. Add source code Computer Graphics Course @Waseda University ◼ Specify

    file name (main.cpp), and click “OK”
  35. Copy & paste test code ◼ https://github.com/tatsy/OpenGLCourseJP/tree/master/s rc/open_window Computer Graphics

    Course @Waseda University
  36. Build project Computer Graphics Course @Waseda University ◼ Change build

    mode to “Release” and “x64” ◼ “Build(B)” → “Build solution(B)” or ◼ “Ctrl + Shift + B” (Press together)
  37. Build project Computer Graphics Course @Waseda University ◼ After build

    Make sure your build finish successfully (yon can find “1 success”)
  38. Run Computer Graphics Course @Waseda University ◼ “Debug (D)” →

    “Start without debug (H)” or ◼ “Ctrl + F5” (press together)
  39. Finish ◼ Red window will be shown up! Computer Graphics

    Course @Waseda University