If you are having multiple headlines (which may overlap) you might want to create a class; you can use textWidth ( http://processing.org/reference/textWidth_.html) etc to find out how big your headline is then check for clicks over the text and fade as required. Your class might contain the actual text, the colours, the position and size of the headline and a flag to indicate whether it had faded completely and needs to be restarted, ignored or replaced.

When there's a mouseclick, you'd go through each member of your class and see if the click was over that particular headline.

In the main loop you'd loop through all members of the class and fade the colour.

Anyway, walk before you run... this little bit of code fades some text - expand the basic idea to get colour instead of black and white!

It works by drawing the text in a lighter shade of grey each time. As you noticed, you could get the same effect by keeping it's fill color and manipulating the alpha/transparency value. This latter idea is maybe the way to go if you have headlines in different colours on different backgrounds or if they overlap.

1. color myColor;
2. int nDatum;
3. String sHeadline="HEADLINE";
4.  
5. void setup(){
6.  size(600, 400);
7.  myColor=0;
8.  // 1/100 of a second hence
9.  nDatum=millis() + 10;
10. }
11. void draw(){
12.  
13.  
14.   background(255);
15.   fill(myColor);
16.   text(sHeadline, 40, 60);
17.   if(millis()>=nDatum){
18.      nDatum=millis() + 10;
19.     if(myColor<255) myColor++;
20.    
21.   }
22. }

I was bored so I wrote a rather ugly version of what you want - you'll need to create a font to run the code.

If you click a headline it will be reset to maximum alpha. If headlines overlap where you click, both will respond.

Like most 'animations', this change in alpha should really be timed so it happens at the same rate on any computer.

1. PFont hFont;
2. class Headline {
3.   color hColor;
4.   int nAlpha;
5.   int nX, nY;
6.   String sText;
7.   int nFontSize;
8.   Headline() {
9.     hColor=color(int(random(255)), int(random(255)), int(random(255)));
10.     nAlpha=100+int(random(155));
11.     nX=int(random(width));
12.     nY=int(random(32, height));
13.     nFontSize=4*int(random(2,8));
14.     sText="I Am A Headline!";
15.   }
16. }
17. Headline[] myHeadlines= new Headline[10];
18. void setup() {
19.   size(640, 480);
20.   hFont=loadFont("DejaVuSans-Bold-32.vlw"); 
21.   //init the headlines
22.   for (int nLoop=0; nLoop<10; nLoop++)
23.     myHeadlines[nLoop]=new Headline();
24. }
25. void draw() {
26.   background(0);
27.   //display each headline
28.   for (int nLoop=0; nLoop<10; nLoop++){
29.     fill(myHeadlines[nLoop].hColor, myHeadlines[nLoop].nAlpha);
30.     textFont(hFont , myHeadlines[nLoop].nFontSize);
31.     text(myHeadlines[nLoop].sText, myHeadlines[nLoop].nX, myHeadlines[nLoop].nY);
32.    
33.     //uncomment to see rectangle bounding text
34.     //float nWidth=textWidth(myHeadlines[nLoop].sText);
35.     //noFill();
36.     //stroke(myHeadlines[nLoop].hColor);
37.     //rect(myHeadlines[nLoop].nX, myHeadlines[nLoop].nY, nWidth, -myHeadlines[nLoop].nFontSize);
38.    
39.     //fade
40.     if(--myHeadlines[nLoop].nAlpha == 0) myHeadlines[nLoop].nAlpha=255;
41.   }
42.   
43. }
44. void mouseClicked(){
45.  
46.   for (int nLoop=0; nLoop<10; nLoop++){
47.   
48.     //if mouse within extents of rectangle around text
49.     float nWidth=textWidth(myHeadlines[nLoop].sText);
50.     if((mouseX >= myHeadlines[nLoop].nX) && (mouseX <= myHeadlines[nLoop].nX + nWidth))
51.       if((mouseY <= myHeadlines[nLoop].nY) && (mouseY >= myHeadlines[nLoop].nY - myHeadlines[nLoop].nFontSize))
52.         myHeadlines[nLoop].nAlpha=255;
53.   
54.   }
55. }

Thank you so much not_55. Your code has helped me a great deal. ^^

Unfortunatly there are still some things I couldn't figure out:

The Fading is way to fast. How can I influence that? When it fades to the color 255, i.e. Background color, it should vanish not always reappearing..

I found a code on the forum for a second window, but it is still not working properly. The window opens when I press the right mousebutton (but should only when the mouse is over the text..), but it doesn't show the text and I can't close it without closing the main window.

It's a bit urgend.. need to finish the code until thursday evening.. >.<

 

 

1. import controlP5.*;
2. import processing.serial.*;
3.  
4. PFrame f;
5. secondApplet s;
6. ControlP5 cp5;
7. Serial serial;
8. Serial myPort;
9.  ListBox l;
10. PFont hFont;
12. class HeadlineA {
13. color aColor;
14. float Alpha;
15. int X, Y;
16. String Text;
17. int FontSize;
19. HeadlineA() {
20.     aColor=color(50);
21.     Alpha=0.1;
22.     X=int(20);
23.     Y=int(30);
24.     FontSize=int(20);
25.     Text="I Am A Headline!";
26.   }
27. }
29. HeadlineA[] myHeadlinesA= new HeadlineA[1];
31. void setup() {
32.    size(300, 100);
33.    hFont=createFont("Arial", 22, true);
35.   //Einfuehren Headlines
36. for (int i=0; i<1; i++)
37.     myHeadlinesA[i]=new HeadlineA();
38. }
40. void draw() {
41.    background(255);
42.     //Anzeige Headline
43.   for (int i=0; i<1; i++) {
44. fill(myHeadlinesA[i].aColor, myHeadlinesA[i].Alpha);
45. textFont(hFont , myHeadlinesA[i].FontSize);
46. text(myHeadlinesA[i].Text, myHeadlinesA[i].X, myHeadlinesA[i].Y);
48. //fading
49. if(--myHeadlinesA[i].Alpha == 0) {
50.     myHeadlinesA[i].Alpha=255;
51.    }
52.   }
53. }
55. public class PFrame extends Frame {
56. public PFrame()
57. {
58.     setBounds(600, 300, 400, 300);
59.     s = new secondApplet();
60.     add(s);
61.     s.init();
62.     show();
63.   }
64.  }
66. public class secondApplet extends PApplet {
67.    public void setup()
68.     {
69.      size(400, 300);
71.     cp5 = new ControlP5(this);
72.     cp5.addBang("Close")
73.        .setPosition(140, 190)
74.           .setSize(50, 20)
75.             .getCaptionLabel().align(ControlP5.CENTER, ControlP5.CENTER) ;
76. }
78. public void draw() {
79.      background(0);
80.    }
81.  }
83. void mouseClicked() {
84.    if (mouseButton == RIGHT) {
86.      //don't get why this doesn't work..
87.     //for (int i=0; i<1; i++){
88.     //if mouse within extents of rectangle around text
89.     //float nWidth=textWidth(myHeadlinesA[i].Text);
90.     //if((mouseX >= myHeadlinesA[i].X) && (mouseX <= myHeadlinesA[i].X + nWidth))
91.     //if((mouseY <= myHeadlinesA[i].Y) && (mouseY >= myHeadlinesA[i].Y - myHeadlinesA[i].FontSize))
93.    PFrame f = new PFrame();
94.    s.background(0, 0, 255);
95.    s.textFont(hFont); s.fill(50);
96.    s.text("Hello" ,10,20);
98.    //is this necessary?
99.    s.redraw();
100.       }
102.    if(mouseButton == LEFT){
103.    for (int i=0; i<1; i++){
104.  
105. //if mouse within extents of rectangle around text
106.   float nWidth=textWidth(myHeadlinesA[i].Text);
107.      if((mouseX >= myHeadlinesA[i].X) && (mouseX <= myHeadlinesA[i].X + nWidth))      
108.            if((mouseY <= myHeadlinesA[i].Y) && (mouseY >= myHeadlinesA[i].Y - myHeadlinesA[i].FontSize))
109.                   myHeadlinesA[i].Alpha= 255;
110.     }
111.   }
112. }