I have not run the code as yet but you can check out local-guru's technique without the white fill you can probably create a PImage(), createImage() or PGraphics() image of a font with no background colour apply aliasing and then apply this technique



Here is the link to the .pde and webpage

http://www.local-guru.net/processing/shadow/shadow.pde
http://www.local-guru.net/processing/shadow/shadow.jar

http://www.local-guru.net/processing/shadow
http://www.local-guru.net/blog/page/2

Here is the code (you may have to download the above listed .jar file and extract the images)

1. /**
   cool looking shadows on a mini-'workflow' by <a href="http://www.local-guru.net/blog/">guru</a>
   */
   void setup() {
     size(450,100);
     smooth();
     PFont font = createFont("Arial",32);
     textFont( font );
   }
   
   
   void draw() {
     background(255);
     paint( g, true );
     filter( BLUR, 4 );
     translate(-4,-4);
     paint( g, false );
     
   }
   
   void paint( PGraphics g, boolean full ) {
      if (full) {
        g.fill(128);
      } else {
        g.fill(255);
      }
      g.strokeWeight(2);
      g.stroke(0);
      
      g.line( 190, 55, 260, 55);
      g.line( 250, 50, 260, 55);
      g.line( 250, 60, 260, 55);
   
      
      g.rect( 40,25,150,60 );
      g.rect( 260,25,150,60 );
      g.fill(0);
      g.text( "Cause", 70, 65 );
      g.text( "Effect", 295, 65 );
   
   }
   
   

cool.

g is a Processing defined variable which refers to the g.buffer or graphics buffer. Basically you are referring to Processing pixel array without actually using loadPixels();

its the default layer of your sketch, so you can right off the bat say...

g.fill(255,0,00;
g.rect(0,0,width,height);

You have a red background rect.

ok thanks :)

For all: no idea for outline?

Why not use an outlined font to begin with. This saves you the trouble of having to outline it afterwards in Processing.

outlined fonts is probably not the best idea, its still a shape and not a real outline.
so you cant edit it using stroke or strokeWeight...


you can use geomerative to get the outline of a font, and draw it then.
but i am still thinking about a better way, without the need of a library.

Thx amnon.owed, it let me a good idea if I don't find anything else :) It's not what I really want but it could be an alternative.

its actually not really hard.
you just use font.draw instead of text()

something like this :

1. import geomerative.*;
2. RFont font;
3. void setup(){
4.   size(400,400);
5.   RG.init(this);
6.   smooth();
7.   font = new RFont( "lucon.ttf", 80, RFont.CENTER);
8.   stroke(255,0,0);
9.   fill(120);
10. }
11. void draw(){
12.   background(255);
13.   strokeWeight(4);
14.   translate(width/2,height/2);
15.   font.draw("Hello?");
16. }

It a bit low tech but the idea works for some of my sketches where I draw 2d and 3d lines with dots

You just take each letter and since processing renders each letter as a bitmap you can render it to a PGraphic or even the pixel array and find the midpoints after searching top-down, left-right, right-left, down-up, inside-out

Once you have a list of the midpoints you can just offset them by a value +1,+2 or whatever you want the outline width to be.


The only issue you have is that it's a bit crude. You have to pay attention to the orientation of the font.

Note: Even during the search algorithm when the algorithm detects a change in colour, you can store the pixel location of when it changes and then when it changes back. You have an inserting and exiting pixel location from there you can offset -1 or -2 along the x-axis and y-axis for insertion pixels and +1 or +2 along the x-axis and y-axis for exiting pixels.

Based on the language the font is in, the english alphabet only has 26 letters, then you have the special characters, symbols , numbers , etc)
e.g(abcdefghijklmnopqrstuvwxyz1234567890-=~!@#$%^&*()_+ABCDEFGHIJKLMNOPQRSTUVWXYZ)

Another crude method would be to take the 77 (letters,special characters,uppercase and lowercase letters) and store them in an array. The sketch loads the font and then a procedure pre-calculates the points for each item in the array.

Then after that it's only a factor of scale.

The fonts on the system are static files; however if a sketch was written to generate these objects to point array type during the sketch startup then the procedure would only have to be referred to when the font changes.

There are a number of ways you can do this. I searched on the old forum and found a few albeit  most using libraries. However a few are executed without the aid of libraries. It all comes back to the fact that Processing renders fonts to images and then you have pixelation and antialiasing to enact.

The calculation would be done during the setup process. Real-time point detection would only be necessary when/if the font changes.

Also you can load a text file or use it in realtime for user input. However I don't see the benefit of realtime generation.

You can have realtime input and still have the pre-calculation whereas the images are for each letter are stored and then can be always stored on disk for later use since they are images  at best.

It is a bit crude I admit but it works (in theory).