flashing text

General Discussion Other

oscar_co

in General Discussion • Other • 9 months ago

Dear All,

I am brand spanking new to processing and trying desperately to get to grips with it - so far I am having problems with my first test, and would be very grateful if anyone is able to help/point me in the right direction.

I have created a text sentence in Processing, and would like each word to flash once, then disappear. I have looked all over for a similar tutorial to no avail - is this relatively straight forward thing to do?

Many thanks in advance!

Replies(7)

GoToLoop

Re: flashing text

9 months ago

You may start learn method split(). It separates a sentence into an array of words -> split()
And you text() to display each one -> text()

Complete Processing reference -> Reference

oscar_co

Re: Re: flashing text

9 months ago

Thank you GoToLoop, that makes a lot of sense to me - presumably I now introduce another element to 'stop' each word, as per PhiLho suggestion below? Apologies if this sounds like child-speak!

this is where I have got so far:

void setup()

{

size(950,200);

background(255,0,0);

PFont font;

font=loadFont("ArialMT-48.vlw");

textFont(font);

textSize(50);

textAlign(CENTER);

fill (10,255,30);

}

void draw()

{

String sentance = "HAVE,A,VERY,MERRY,CHRISTMAS";

String[] list = split (sentance, ',');

// list[0] is now "HAVE", list[1] is "A"...

text (list [0], 10, 80, 150, 150);

text (list [1], 120, 80, 150, 150);

text (list [2], 240, 80, 150, 150);

text (list [3], 400, 80, 200, 150);

text (list [4], 620, 80, 300, 150);

{

}

PhiLho

Re: flashing text

9 months ago

" I have created a text sentence in Processing"
Showing some starting code is often a good way to get help, as we can start on solid (?) ground...
Otherwise, you will just get generic answers, like mine and the one above...

Basically, to make something to disappear, you just stop drawing it... Assuming, of course, that you have put a background() call at the start of draw().

Ah, in addition to GoToLoop's indication, you might be interested by textWidth().

GoToLoop

Re: flashing text

9 months ago

Hi Oscar!

I was fooling around your code, trying to adapt it to work on any sentence.
Result was so-so. Nonetheless, here it is:

P.S.: newer version (v1.9) w/ an enhanced displayWords() , which accepts an idx parameter;
so it only displays words starting w/ that index and on.

/*
 * Flashing Text (v1.9)
 * by Oscar_Co (2012/Dec)
 * 
 * http://forum.processing.org/topic/flashing-text
 *
 */

//final static String sentence = "HAVE,A,VERY,MERRY,CHRISTMAS";
final static String sentence = "HAVE A VERY MERRY CHRISTMAS!";

//final static char delim = ',';
final static char delim = ' ';
final static String[] words  = split(sentence, delim);

final static byte txtSz = 100, offSet = 25;
int centerH, textH;

void setup() {

    textFont( createFont("ArialMT", txtSz) );
    textH = round( textAscent() + textDescent() );

    int gw = (int) textWidth(sentence) + offSet*2;
    int gh = textH*2 + offSet*2;

    size(gw, gh);
    //frameRate(1);
    noLoop();

    background(#FF0000);
    fill(#0AFF20);

    textAlign(LEFT, CENTER);
    rectMode(CORNER);

    centerH = height/2 - textH/5;

    displayWords(0);
}

void displayWords(int idx) {

    for (int i=0, len=words.length, centerW=offSet; i!=len;) {
        if (i >= idx)    text( words[i], centerW, centerH );
        centerW += (int) textWidth( words[i++] + ' ' );
    }
}

oscar_co

Re: Re: flashing text

9 months ago

Hi GoToLoop! - many thanks for this, it's really useful!

GoToLoop

Re: flashing text

9 months ago

Hey Oscar! Here's a tiny update.
This time, sentence starts to lose a word 1 by 1!
No flash yet though.

I don't even know what type of flash you have in mind!
But I believe the state the program is now, it's easy for ya to make a word flash for some moments!

/*
 * Flashing Text (v2.0)
 * by Oscar_Co (2012/Dec)
 * 
 * http://forum.processing.org/topic/flashing-text
 */

final static String sentence = "HAPPY NEW YEAR 2013!";

final static char delim = ' ';
final static String[] words  = split(sentence, delim);

final static byte  txtSz  = 100, offSet = 25;
final static byte  fps = 1, delayCount = 3;
final static color bg = #FF0000, txtCol = #0AFF20;

int centerH, textH;
byte wordIdx;

void setup() {

    textFont( createFont("ArialMT", txtSz) );
    textH = round( textAscent() + textDescent() );

    int gw = (int) textWidth(sentence) + offSet*2;
    int gh = textH*2 + offSet*2;

    size(gw, gh);
    frameRate(fps);

    textAlign(LEFT, CENTER);
    rectMode(CORNER);

    centerH = height/2 - textH/5;
}

void draw() {

    background(bg);

    if (frameCount % delayCount == 0 & wordIdx < words.length)
        ++wordIdx;

    displayWords(wordIdx, txtCol);
}

void displayWords(int idx, color col) {

    fill(col);

    for (int i=0, len=words.length, centerW=offSet; i!=len;) {
        if (i >= idx)    text( words[i], centerW, centerH );
        centerW += (int) textWidth( words[i++] + ' ' );
    }
}

oscar_co

Re: flashing text

9 months ago

Hi GoToLoop! Thanks so much for this, it's near bang on what I was looking for. I just need to repeat the process - presumably that involves me creating a loop for the void draw section? Thanks again!

Top Reply

flashing text

Replies(7)

Re: flashing text

Re: Re: flashing text

Re: flashing text

Re: flashing text

Re: Re: flashing text

Re: flashing text

Re: flashing text

Statistics

Tags

Actions

Related Posts