Tuesday, 10 July 2012

Scrolling Text

I've been able to create some pretty cool stuff using Xcode and embedding Quartz Composer compositions within views.  Embedding QC on Xcode allows a standalone application to be created and parameters to be changed through a nice GUI.  I used such an application to drive a large billboard with scrolling text at an event in London recently.

This was a very straight forward QC composition as shown in the picture below:

When embedded in an Xcode application I had two windows.  One showed the scrolling text that could be made full screen with the text at 'Y Position' parameter to it could be tweaked to show on the wide but short LED screen (see below).  The other window showed all the published parameters just like the inspector window in QC.  This worked very well allowing all settings to be changed on the fly and was quite straightforward to implement.

Initially the scrolling stuttered and this was really noticeable on the large screen.  I considered all sorts of reasons for the stutter/jerk... processing peaks, frame rate inconsistencies, coordinates not representing whole pixels... etc.  One area hinted at was stochastic binafication - a great phrase but not much out there to find so far.

I shut down lots of processor interrupting applications on my MacBook Air to see if I could reduce the stutter but that didn't make much difference.  Xcode allows the frame rate of the QC View to be set in the attributes inspector.  Frame rate of 1 shows the whole text moving a chunk (dependent on the interpolation duration) every 1 second.  A frame rate of 15, 24 etc. had a weird blurriness, but 60 fps didn't have this 'blur' possibly because it matched the Hz of the display (my screen at 60Hz).  This looked really good, but there was still a random but very noticeable stutter caused by something... possibly processor going off to do something else.

I took my standalone application to the Apple Store in Covent Garden, London and tried running it on their most powerful machine - a Macbook Pro.  The stutter was still there which ruled out processing issues.

After some searching, playing and frustrating dead-ends including rounding the coordinates in QC I looked into OpenGL as it allows direct access to GPUs and is the way we used to generate Outside World Displays, and display symbology in cockpit demonstrators.  The Apple developer library says "OpenGL greatly eases the task of writing real-time 2D or 3D graphics applications" - it should allow lots more control and performance to give ultimate smooth scrolling.

Before going deep into arcania I tried to overcome Quartz Composer's lack of frame rate control using a custom javascript patch.  This does seem to have worked and I now have nice scrolling text coming out of Quartz Composer.  I am really pleased that I can continue to use QC rather than coding as it reduces develop time to minutes rather than days, is incredibly intuitive and integrates well like everything Mac.

Here are some useful OpenGL links I found on the way to my QC solution:

Google image search for OpenGL text example
The Red Book (essential tutorial to OpenGL)
iPlany youtube tutorial one and two.
The usual stackoverflow can of worms: How do I draw text with GLUT / OpenGL in C++?
Freetype - getting fonts into OpenGL
Bitmap Font Generator - from Truetype fonts which might be *really* useful and has some interesting tutorials
Cocoa OpenGL page with text rendering example from Apple Developer Form


Copyright 2012 Matt Mapleston