DOWNLOAD Vertext (12-01-07)

 

Vertext is...
an OpenGL-enabled Processing vector font library. This enables you to draw giant, detailed typography at high frame-rates.

 

The above image is rendered with the following code...

 import flux.vertext.*;
 import processing.opengl.*; 
 
 Vertext bigFont; 
 Vertext giantFont; 
 
 PFont regularFont; 
 
 void setup(){ 
   size(1000,400, OPENGL); 
   P5Extend.register(this); 
 
   giantFont = new Vertext("TimesNewRoman", 800, 210);  
   bigFont = new Vertext("EurostileBold", 255, 80); 
 
   regularFont = createFont("Georgia-Bold", 24); 
 } 
 
 void draw(){ 
   background(240); 
 
   giantFont.text("Q", -200, 300); 
   bigFont.text("VERTEXT", -10, 200); 
 
   fill(120); 
   noStroke(); 
   textFont(regularFont, 24); 
   text("not just plain 'ol pfonts", 40, 300); 
 } 

 

Please explain...
PFonts are great for every-day hacking. When you're writing a Processing app on the bus, these are fine and dandy.

 

However, Processing renders fonts as bitmapped sprites by default. Upon zooming in, they reveal their true colors!

 

Yuck! So you might try and create bigger and bigger PFonts. More pixels is more detail, right? This is not so great when you run out of memory because your font textures are too big.

 

What if we can have just one PFont object that represents all the different typographical sizes you might need? Thankfully, the Processing Gods have given us textMode(SHAPE). With this, you can force Processing to render typography as vector shapes instead of bitmaps. Infinitely scaleable!

 

Unfortunately these shapes are really slow to render. Your computer will hate you.

 

With the magic of OpenGL and Display Lists (represented here as a cat), we can pre-cache all that vector data into your graphics card. Fast, scalable typography can now be yours!

 

P5Extend(PApplet);
Call this before using Vertext. Replace PApplet with "this" (without quotes, dummy) for Processing apps.

Vertext myFont; // placed outside setup() or draw()
myFont = new Vertext("Font Name", size, color); // do this in setup()

This creates a new Vertext instance that you can use for drawing the typography. Size determines how big your type is. Color locks the font into a specific color (see notes below). You can also use Processing's color() method to insert a color inside the constructor.

IMPORTANT!! - Vertext does not use .vlw fonts created from Processing. Run PFont.list(); in Processing to see a list of fonts, and use the name of the font you want in the constructor. So, if I want Arial Bold, and PFont.list() tells me I have it installed in my system and it tells me it's called "ArialBold", the constructor should look like

new Vertext("ArialBold", 24, 255);

myFont.text("hello world?", 0, 150);
This draws the text you want, at an x, y coordinate.

That's it! That's all there is to it.

 

Some tech notes you will want to read before you come crying

  • You must use Vertext with OpenGL Processing apps. This means size(200,200,OPENGL); This may not be obvious to beginners.
  • You must call P5Extend(this); before creating any Vertext objects. This is a convenience, so you don't have to send a PApplet reference to every new Vertext object you instantiate! In fact, this may be the new standard for all my libraries. It's simple, it's easy, it's fun.
  • Fonts should be selected from PFont.list(), not from a .vlw file. As of now I'm unsure how to use loadFont() with textMode(SHAPE) (the method just complains and punches you in the face if you try that). This also means...
  • You can only use fonts installed on your system. I know, more suckage :(
  • Vertext requires that you define a fill color and NEVER CHANGE IT. This sucks, I know. It's because Vertext uses GL Display Lists, and my GL skills are pitiful at best. If someone wants to break open the source code (included) and hack it, be my guest. My honorable, precious guest. For now, just think of it as a carefully selected color palette :)
  • Transparencies do not work properly. Again, a display-list issue. What one will give up for speed...
  • Everything looks pixelated because Processing turns off strokes for rendering typography into shapes. The drawback is that only strokes get anti-alias, not shapse. To get around this issue completely, use the hacked OpenGL jar from Processing Hacks. Apparently this is fixed since Processing-0133, so I'm a bit behind on the cutting edge; if you update to the latest and greatest you may not have this problem at all!
  • Vertext currently has no formatting options. Sorry typography nerds. No right align and kerning. Maybe at a later version?
  • Why does this library suck so much? Because it's stuff I made at work, never meant for public consumption. It's kind of scrapped together in one night, give me a break :) Send your grief to flux dot blackcat at gmail dot com.