Wednesday, July 19, 2017

Setting up Eclipse and OpenGL using MSYS2/MinGW - Part 2

In Part 1 of this tutorial we installed Eclipse, the GCC compiler suite, and the OpenGL libraries that we would use. If you followed through that tutorial, then you be good to go for this tutorial which covers setting up a template project for OpenGL. Let's begin.
  1. Open up Eclipse then start by clicking File >> New >> C++ Project. In the New Project dialog, enter the name of the project (e.g. OpenGLTemplate) and choose the location. While still in the dialog, make sure that Show Project types and toolchains only if they are supported on the platformis unchecked. Select  Empty Project as project type and selectMinGW GCC from the among the options in Toolchains. Take a look at Figure 1 below for reference. Afterwards, click Finish.
    Figure 1. Options that need to be considered when creating a new OpenGL project.
  2. Your project should now be in the Project Explorer pane on the left side Eclipse. Expand the project by double-clicking it. Right-click the project folder, select New >> Source Folder and name the folder as src.
  3. Right-click on the newly created src folder, New >> Source File. In the dialog that just came up, name the file as main.cpp. In the template dropdown, Default C++ source template.Then, click Finish.
  4. Next, we will need to include a library called GLAD that will make creating OpenGL projects more convenient. Go to the GLAD web service, set the language to C++ and in the API section, select an OpenGL version of at least 3.3, higher versions are ok as well. Also make sure the profile is set to Core and that the Generate a loader option is ticked. You can ignore the extensions for now. Click Generate to produce the resulting library files. You will be provided with a zip file containing two include folders (glad and KHR) and a single glad.c file.
  5. Extract the zip file that you got in Step 4 directly into your Eclipse project directory. By this time, your Project directory must now have an include folder that contains two folders namely glad and KHR. Inside your src folder, an additional file named glad.c should be present. Now go back to your Eclipse IDE and refresh the Project Explorer pane and you should see a similar structure as Figure 2 below.
    Figure 2. Project Explorer directory structure after adding GLAD libraries.
  6. Right-click the main project folder and select  Properties. Go to  C/C++ Build >> Settings >> Tool Settings. Click on  Includes under  GCC C++ Compiler then add a new item to  Include paths (-l). In the dialog window that came up, click the  Workspace button, select and expand the current project directory (in this case, OpenGLTemplate), select the  include folder but not its contents, then click OK. You will be taken back to the Add directory path dialog box which should now look like Figure 3, then click OK.
    Figure 3. Content of "Add directory path" after selecting include folder.
  7. While you are still in the Tool Settings pane, click on  Includes but under  GCC C Compiler and do the same thing that you did in Step 6.
  8. Again, while still in the Tool Settings pane, click on  Libraries under  MinGW C++ Linker then add the following items to  Libraries (-l) one by one: glfw3, glew32, freeglut, opengl32, glu32,freeimage. Take note that the order of the entries will matter. Your Libraries (-l) pane should now look like Figure 4. Now, click OK and accept the prompts that will follow to complete the configuration of your project!
    Figure 4. The Libraries pane of the MinGW C++ Linker after adding the OpenGL libraries.
  9. To test the project, copy the code which can be found here, this is code from https://learnopengl.com, a great site to learn OpenGL. After copying the code, go back to your Eclipse project and double-click main.cpp. Paste the code over and then save the file. There might be several error messages right after you paste the code...that is normal since Eclipse is still running the Indexer. The errors should clear once the Indexer is done.
  10. Now, right-click the Project Folder in the Project Explorer and click Build Project. If the build is successful, you shouldn't see any problems. Click the Run button in the toolbar and you should see a window like Figure 5.
    Figure 5. The LearnOpenGL Window
    You can press the ESC button on your keyboard to close the window. And that's it! Head on over to https://learnopengl.com and go over their tutorials. You can skip the topic on configuring Visual Studio, cmake, and compiling GLFW as we took care of that part in this tutorial. Enjoy learning!

Tuesday, July 18, 2017

Setting up Eclipse and OpenGL using MSYS2/MinGW - Part 1

I am trying to learn some computer graphics and have decided to use Eclipse in Windows. If you notice some mistakes in this tutorial, please do not hesitate to drop a comment.

I. Installing the Eclipse IDE.
I will be using the Eclipse IDE for C/C++ Developers. If you have an existing Eclipse IDE and used it for anything other than C/C++, then you need to download and install the CDT plugin for Eclipse. In this tutorial, I will be assuming that you'd want to use a fresh install of Eclipse for C/C++.
  1. Head on over to https://www.eclipse.org/downloads/eclipse-packages/ and download the package. Choose the appropriate version of the package for your operating system, whether 32-bit or 64-bit.
  2. After downloading the ZIP file, extract it to a convenient location, then create a shortcut for the Eclipse executable and place it somewhere convenient like your desktop or Windows Taskbar for easier access later. Let us now move on to the next part.

II. Installing MSYS2/MinGW.
  1. Download the appropriate msys2 one click installer for your OS architecture here: http://www.msys2.org/ and follow the installation instructions on that page. Take note of the location where you installed msys2 because we will need it in the following steps.
  2. After you've finished the installation (including the updating), we will now update our PATH variable to include the path where our compilers and libraries will be installed.
  3. Open Control Panel » System » Advanced » Environment Variables
  4. We will now add an new item to the PATH variable. You probably need Administrator privileges for this. Assuming you followed all the instructions in the msys2.org website and installed msys2 to to the default location, add a new item pointing to C:\msys32\mingw32\bin if you are on a 32-bit system. If you are on a 64-bit system, add two new entries pointing C:\msys64\mingw32\bin and C:\msys64\mingw32\bin. 
  5. Apply and save changes to the PATH variable and start your msys2 shell.

III. Installing the compilers and OpenGL libraries.
  1. If you are using a 64-bit system, enter this command in the prompt then wait for the installation to finish:
  2. pacman -S gcc
    After the previous installation is done, enter the next command and wait for it to finish:
    pacman -S mingw-w64-x86_64-gcc
    After the installation, you should now have a working suite of compilers for C and C++!
  3. To check if the install is indeed successful, type gcc or g++ in the prompt and you should be greeted with an error about no input files. That should indicate a successful install since you didn't really include a source file to compile in the command.
  4. As for the OpenGL specific libraries, msys2 makes it convenient. If you are using a 32-bit system, type in the following commands, accept all prompts by typing "Y", and then wait for the installation to finish:
  5. pacman -S mingw-w64-i686-glfw mingw-w64-i686-glew mingw-w64-i686-freeglut mingw-w64-i686-freeimage mingw-w64-i686-glm
    For a 64-bit system, enter the following command:
    pacman -S mingw-w64-i686-glfw mingw-w64-x86_64-glfw mingw-w64-i686-glew mingw-w64-x86_64-freeimage mingw-w64-x86_64-glew mingw-w64-i686-freeglut mingw-w64-x86_64-freeglut mingw-w64-i686-glm mingw-w64-x86_64-glm
    Once the installation is done, we can now proceed to creating our Eclipse project template. In Part 2 of this tutorial, we will set up Eclipse to use OpenGL in our project.