HelloTWL Example
Author: Kevin Stokes. If there are problems with this tutorial, please email me.
HelloTWL This is a Windows demo application using LWJGL and TWL. It features a moving 3D geometric object drawn directly on the LWJGL display, with some very simple TWL widgets displayed in HUD style on top of the 3D view. Following this tutorial, you should be able to download all the source and jars you need, then set up the project so you can compile from source and run it. I'll go through the steps used to create the project.
Step 1: Prerequisites
LWJGL The Lightweight Java Game Library.
This is a great library for doing OpenGL with Java. It is easy to setup and use. The main page for LWJGL is here.Go to the download page and download the .zip. Unpack the .zip. We will be importing jars from the 'jars' subfolder, and the native dlls.
MXP1 - The XML Pull Parser
Ok, I'm not totally sure what this is so here is what they say on their website :
"MXP1 is a stable XmlPull parsing engine that is based on ideas from XPP and in particular XPP2 but completely revised and rewritten to take the best advantage of latest JIT JVMs such as Hotspot in JDK 1.4+."
Hmm. I know what XML is, and I know what parsing is, so I'm guessing that it is code that reads XML files in a general way that Java programs can easily use. Anyway, we just want the Jar file.
So go here and download the file xpp3-1.1.4c.jar
TWL The Themable Widget Library
TWL is awesome, which already know since you are reading this tutorial.Go to the main TWL page and go to the source section. I went to the TWL Mercurial Repository. From there you can download a .zip file with an Eclipse project which you can import into your workspace.
So after you've unzipped the TWL file from the repo, we are ready to import it into Eclipse.
Step 2: Getting the TWL source to Compile
Go to Eclipse and select "Import" from the file menu, then select "import existing projects into workspace".Navigate to the folder where you unzipped TWL from the Repo.
NOTE: Check the box 'Copy Projects into Workspace'
Now for some reason when I did this, it was a little messed up. I'm no expert on Java or Eclipse, but for some reason it was thinking the the 'src' folder was part of the package name, so my project looked like this:
To fix this I right-clicked on the TWL project and selected 'Build Path'. Then in the 'Source' tab, I deleted the Twl/src folder, and then added it again.
Then my project was all fixed up. However it did not build yet, because I haven't added the LWJGL and xpp jars to the project.
So I created a folder called 'lib' in the project. In here I put the jars needed to get the source to compile. I'm going import the jars into the actual workspace to keep the project self-contained, rather than having the build path point to somewhere else on my hard drive.
After creating the folder, I right clicked on the folder and selected 'import'. Then I selected 'File System'. Then I browsed to where I had unzipped the LWJGL jars.
I wasn't exactly sure which jars would be necessary, but the ones selected above worked.
So now the project looks like this:
But before it will compile, we need to add these jars to the build path so the compiler can find them:
I right clicked on the Project and selected 'Build Path' and then in the 'Libraries' tab, I added all the jar files in my new lib folder:
After this, I selected 'Clean' from the projects menu, and then TWL compiled without errors!
Once your project is created, we'll need to set up the LWJGL jars and the native libraries.
So create two new folders - 'lib' and 'binlib'. We'll put the LWJGL jars in the 'lib' folder, and the native DLLs in the 'binlib' folder.
After doing this, the HelloTWL project looked like this:
NOTE: This might not have been the best approach, because the TWL project has a lib folder with LWJGL jars in it, and our HelloTWL project does also. If we update to a new version of LWJGL, we should always make sure they are the same version. Since I'm not that experienced with Java or Eclipse, I'll bet there is a better way. However, this works for me.
Now the jars have to be added to the class path by right clicking on the HelloTWL project, selecting Build Path, then 'Configure Build Path', and in the Libraries tab, select 'Add Jars'. Add all the jars in the 'lib' folder.
After adding the jars, we need to tell the project where the native libraries are. To do this, go back to the Libraries tab, and this time click on each LWJGL jar and click on the little arrow next to the LWJGL jar and click on where it says 'native libary location'. Then click on the 'edit' button on the right. In the dialog that comes up, click on the 'Workspace' button to browse to the HelloTWL/binlib folder
Do this for each of the LWJGL jars.
Now we need to add the TWL project to the HelloTWL project. Right click on the HelloTWL project and select Build Path->Configure Build Path, then click on the Projects tab. Click on the Add project button and browse to the 'twl' project we created in Step 2.
Next we add the source code and images. You can download a .zip file with these files here.
Unpack the zip file in a temp directory, and then import the files into your 'src' file in the HelloTWL project.
This is a bit tricky because you want to get the package correct. If you do the import incorrectly, the files appear in the default package and not in the 'hellotwl' package and then it won't compile.
The folder selected when browsing is hello_src. Then you check the 'hellotwl' folder, and nothing appears in the right pane. If you see the list of sources and image files in the right pane, then you need to cancel and try again and select the parent folder of the hellotwl folder instead of the hellotwl folder itself.
Now the final project should look like this in Package Explorer.
Now the project should compile and run!
The source code is very simple, and very close to the official GameUIDemo, which is discussed in the other tutorial, so if you have questions, see the Getting Started information which goes through the GameUIDemo an the xml source and explains the basics.
What is different about HelloTWL is that a real 3D view generated by other code is running, with the TWL widgets displayed over the top. If there are problems with this tutorial please email me.
To fix this I right-clicked on the TWL project and selected 'Build Path'. Then in the 'Source' tab, I deleted the Twl/src folder, and then added it again.
Then my project was all fixed up. However it did not build yet, because I haven't added the LWJGL and xpp jars to the project.
So I created a folder called 'lib' in the project. In here I put the jars needed to get the source to compile. I'm going import the jars into the actual workspace to keep the project self-contained, rather than having the build path point to somewhere else on my hard drive.
After creating the folder, I right clicked on the folder and selected 'import'. Then I selected 'File System'. Then I browsed to where I had unzipped the LWJGL jars.
I wasn't exactly sure which jars would be necessary, but the ones selected above worked.
So now the project looks like this:
But before it will compile, we need to add these jars to the build path so the compiler can find them:
I right clicked on the Project and selected 'Build Path' and then in the 'Libraries' tab, I added all the jar files in my new lib folder:
After this, I selected 'Clean' from the projects menu, and then TWL compiled without errors!
Step 3: Making the HelloTWL project
Choose File -> New -> Project -> Java Project and create a new Eclipse project called HelloTWL. The defaults are ok for everything.Once your project is created, we'll need to set up the LWJGL jars and the native libraries.
So create two new folders - 'lib' and 'binlib'. We'll put the LWJGL jars in the 'lib' folder, and the native DLLs in the 'binlib' folder.
After doing this, the HelloTWL project looked like this:
NOTE: This might not have been the best approach, because the TWL project has a lib folder with LWJGL jars in it, and our HelloTWL project does also. If we update to a new version of LWJGL, we should always make sure they are the same version. Since I'm not that experienced with Java or Eclipse, I'll bet there is a better way. However, this works for me.
Now the jars have to be added to the class path by right clicking on the HelloTWL project, selecting Build Path, then 'Configure Build Path', and in the Libraries tab, select 'Add Jars'. Add all the jars in the 'lib' folder.
After adding the jars, we need to tell the project where the native libraries are. To do this, go back to the Libraries tab, and this time click on each LWJGL jar and click on the little arrow next to the LWJGL jar and click on where it says 'native libary location'. Then click on the 'edit' button on the right. In the dialog that comes up, click on the 'Workspace' button to browse to the HelloTWL/binlib folder
Do this for each of the LWJGL jars.
Now we need to add the TWL project to the HelloTWL project. Right click on the HelloTWL project and select Build Path->Configure Build Path, then click on the Projects tab. Click on the Add project button and browse to the 'twl' project we created in Step 2.
Next we add the source code and images. You can download a .zip file with these files here.
Unpack the zip file in a temp directory, and then import the files into your 'src' file in the HelloTWL project.
This is a bit tricky because you want to get the package correct. If you do the import incorrectly, the files appear in the default package and not in the 'hellotwl' package and then it won't compile.
The folder selected when browsing is hello_src. Then you check the 'hellotwl' folder, and nothing appears in the right pane. If you see the list of sources and image files in the right pane, then you need to cancel and try again and select the parent folder of the hellotwl folder instead of the hellotwl folder itself.
Now the final project should look like this in Package Explorer.
Now the project should compile and run!
The source code is very simple, and very close to the official GameUIDemo, which is discussed in the other tutorial, so if you have questions, see the Getting Started information which goes through the GameUIDemo an the xml source and explains the basics.
What is different about HelloTWL is that a real 3D view generated by other code is running, with the TWL widgets displayed over the top. If there are problems with this tutorial please email me.
on 2010/04/03 11:13