Introduction: Proclipsing: Using the Eclipse IDE for Processing Projects

By Scott Kildall Website:
About: Scott Kildall is an new media artist and researcher. He works at Autodesk, Pier 9 and is an artist-in-residence with the SETI Institute

Processing is a fantastic tool for getting non-programmers comfortable with programming. With it, you can easily create interactive drawing applications and much, much more. Its strength is that it can be used cross-platform (Mac, Win, Linux) and for a traditional text-based programming environment has a relatively easy learning curve.

Processing is built with Java and uses a few tricks to hide the complexities of the Java language. The Processing download includes a custom IDE (Integrated Development Environment) — the application that is called "Processing". It is gut-wrenchingly simple to get up and running and is a fantastic tool.

However, the Processing IDE suffocates when your projects become complex. It hinders fast development cycles because the compiler will give you obscure errors and there is no debugger.

The Eclipse IDE (which is a preferred IDE for Java development) is many times better and can be used with Processing. It's a little tricky to get going, but once you switch over to this IDE, your development time will be about 3 times as fast and much less frustrating.

Warning: this Instructuable is the least-exciting one I've written so far, and includes many steps. But if you use complex Processing projects — as I have for both work and for art projects — this could very well be one the most useful Instructables in your repository.

Step 1: Witness the Agony of Processing

Not really — I want to emphasize how great a project Processing is. It provides simple drawing and video functions for artists. There is a vibrant community around Processing. There are many great projects written in Processing. Check out the Processing.org website and OpenProcessing for a welcome community.

From a developer's standpoint, the syntax-checking on Processing is primitive. When you're working with multiple functions and classes, a simple misplaced curly-brace can give you an single error message at the bottom like "unexpected token: void". I've often chased my tail in circles to sort out issues like this, even undoing my changes to revert to an earlier version of the code. It can be infuriating and counter-productive

Eclipse has much better syntax checking, including error-checking before you even run your program and a great file management system.

Plus it has a full-fledged debugger. No more println() needed!

Step 2: Install Eclipse

Now then, let's migrate an existing project to Eclipse. Here is the full guide for your reference. This Instructable will cover the Eclipse installation and more.

Choose your operating system (I'm using Mac OSX for the sake of the screenshots) and then download the Eclipse IDE for Java Developers from the Eclipse website.

The download takes a long time. Copy the package to your Applications directory. Run Eclipse and use the default settings for the location of your workspace.

Optionally, you can install some nice Color Themes for Eclipse here for eye-pleasing colored text on a black or gray background.



Step 3: Install Processing

The Processing download is on the Processing site, here. In case you are using a fresh computer or don't have the latest, make sure you download Processing and install it in your Applications directory, or equivalent if you're not using the Mac OS.

Launch Processing, make sure it runs fine and then quit the application.


Step 4: What Is Proclipsing?

Proclipsing is an open source project which consists of an Eclipse add-on that refers to the path to your Processing application. Using it, you can select libraries that you want to add to a new Eclipse Java project. Additionally, it will create an empty project, package structure and application which inherits from PApplet.

You can use the Processing drawing libraries in Eclipse without Proclipsing — by adding them manually — but the Proclipsing add-on makes it easier to create new projects as well as export finished applications.

Once again, the full guide to installing Proclipsing is here, however I will break down the installation into a few steps.

Here's an example of how Proclipsing can be incredibly useful. Pictured above is the animation engine for Tweets in Space. I wrote the software in Java, using Proclipsing to get it started. The application is a dual-projection animation that taps into an SQL database, which captures all live tweets with the hashtag #tweetsinspace. The tweets scroll up the side of the building, the lights in the building turn on and off, satellite dishes move back and forth and "beam" the tweets to spaceships which take them into deep space. This is exactly the kind of project that would be filled with frustration to do in the Processing IDE.


Step 5: Install Proclipsing, Step 1

In Eclipse, go to the Help menu and choose Install New Software

In the "Work with" field, enter the name of the download (on Google code):
http://proclipsing.googlecode.com/svn/tags/current_releases/proclipsingSite/

Click on "Add".



Step 6: Install Proclipsing, Step 2

You will see the "Add Repository" dialog box

The location field will contain the URL you just typed in.

For the Name field, enter Procilpsing

Press OK.

Step 7: Install Proclipsing, Step 3

At the "Available Software" dialog:

Check core
Check export

Click Next.


Step 8: Install Proclipsing, Step 4

At the "Install Details" dialog, Click Next.

This will take you to the Review Licenses dialog. Accept the terms of the license and click on Finish.

Now, it will take a few minutes for Proclipsing to install on Eclipse. If you get a security warning, click on OK and continue. You'll be asked to restart Eclipse and you will now have Proclipsing available for use.

Step 9: Building a New Project With the Processing Libraries

To build your first Java project using the Processing libraries, choose File->New and you will see the "New Project" dialog. Select Processing Project and choose Next.

Here is where you will be presented with the Processing Wizard — this is Proclipsing — which will let you select different Java libraries you want to include in your project. You could configure this manually, but it's a pain. Now, you can choose any of the "Processing Path" libraries (these are the ones included with Processing) or the "Processing Sketch Path" libraries (these are the ones you may have added).

Select Application (unless you want to run this as an Applet, but most people want a standalone executable).

This will create a new project in your Eclipse folder, import the libraries and create a Processing-based skeleton. Now, you're on your way.

Step 10: Examine the Skeleton Code

My project name is "AwesomeFun" because you are going to have awesome fun as a coding geek now that you have a kick-ass IDE that still uses the great drawing tools of Processing.

Notice how it includes the setup() and draw() function, just like in Processing. You can add keyPressed(), mousePressed() and all other functions that are normally available in Processing.

Our application class is now called AwesomeFun, which extends PApplet. This, in turn, extends Java's Applet class.




Step 11: PConstants

There are many small changes in using Processing with Eclipse and this Instructable will only cover the two most common stumbling blocks that I've found. The first is that constant values are now in a statically-accessed through a PConstants class.

I've added some code into the setup() and draw() functions. Now, the textAlign() function calles PConstants.CENTER instead of just CENTER. Processing does a number of contortions to hide this from you, so now you have to find these in the the PConstants class.

Fortunately, Eclipse has some handy auto-fill features, so after you type in "PConstants." (don't forget the dot), it will give you a popup list with names of various constants you can select.

By the way, you never need to instantiate the PConstants class. It is a container for all the constant variables.

Step 12: PApplet in Other Classes

The other aspect about migrating to Processing using Java is that the functions of PApplet are no longer universally available to other classes and functions. To get around this, you'll need to pass in a PApplet object to all of your classes.

Bear with me, we're knee-deep in the technical bits here.

First, add code for a Ball class — just to see how this all works. In the constructor for Ball, we pass in the instance of AwesomeFun, which in turn can access all of the PApplet functions.

Now, go to File->New->Class and create a new class called Ball.

The code I have here shows a pretty standard technique where we save a copy of the PApplet object in the constructor. We later use this for the drawing functions: p.fill, p.ellipse, etc. Because the drawing functions are methods (or member variables, depending on your parlance) of PApplet, they need a valid instance of the PApplet class.

Once you get used to doing this for all your class constructors, it won't seem so weird.

Step 13: Export As an Application

The other thing that Proclipsing offers is an easy way to export applications for Mac, Windows and Linux with the P5Exporter. Press the Processing icon and you'll be presented with this P5Exporter. Choose Application as your output and AwesomeFun as your Project and Run-Config.

Press Finishand the executables for all three platforms will appear in your workspace directory (i.e. in directories called application.macosx, application.linux, application.windows).

Boom. You have an application now that draws Hello World and a red ball on the center of the screen.

Step 14: Additional Questions

This Instructable is already long enough and just covers the basics. Undoubtedly, you will run into questions. Some may be general Java question and some may be Proclipsing-related.

If you get stuck, the Integration & Hardware forum on the Processing.org site seems to be the best place for Proclipsing questions.

Happy coding!