Join Now
Quality Rating:
  • Currently 4.0 / 5
(4.0 / 5 - 1 vote cast)
Expertise Level:
  • Currently 3.0 / 5
(3.0 / 5 - 1 vote cast)

This page was last modified 12:04, 18 June 2008.

How to create a color fading text in Java ME

From Forum Nokia Wiki

We'll implement a simple class to draw text that changes multiple colors with a fading effect.
You can view it in action here.
Image:J2me_color_fade_text.gif
So, let's start defining our ColorFadeText class.

Source code: ColorFadeText class

We start defining the necessary properties:

//will hold the colors to fade
int[] colors = null;
 
//duration of a single fade
int fadeDuration = 0;
 
//effect start time
long startTime = 0;
 
//property used to check if effect has started
public boolean started = false;
 
//the text to be drawn
String text = null;

Now, we define the main constructor, that will accept the following arguments:

  • the text to be drawn
  • an int[] array containing the colors to fade into
  • the duration of a single fade
public ColorFadeText(String text, int[] colors, int fadeDuration)
{
	if(colors.length == 0)
	{
		throw new IllegalArgumentException("You must define at least 1 color");
	}
	this.text = text;
	this.colors = colors;
	this.fadeDuration = fadeDuration;
}

The effect start() method will simply set the startTime value to current time and the started property to true

public void start()
{
	startTime = System.currentTimeMillis();
 
	started = true;
}

Then, we have the paint() method, that will be used to paint the text on the given Graphics instance:

public void paint(Graphics g, int x, int y, int anchor)
{
	if(started)
	{
		long diff = System.currentTimeMillis() - startTime;
 
		int module = (int)(diff % fadeDuration);
 
		int colorIndex = (int)(diff / fadeDuration) % colors.length;
 
		int midColor = midColor(
			colors[(colorIndex + 1) % colors.length],
			colors[colorIndex],
			module,
			fadeDuration
		);
 
		g.setColor(midColor);
	}
	else
	{
		g.setColor(colors[0]);
	}
 
	g.drawString(text, x, y, anchor);
}

The following utility method will be the one actually used to get the current text color:

static int midColor(int color1, int color2, int prop, int max)
{
	int red =
		(((color1 >> 16) & 0xff) * prop +
		((color2 >> 16) & 0xff) * (max - prop)) / max;
 
	int green =
		(((color1 >> 8) & 0xff) * prop +
		((color2 >> 8) & 0xff) * (max - prop)) / max;
 
	int blue =
		(((color1 >> 0) & 0xff) * prop +
		((color2 >> 0) & 0xff) * (max - prop)) / max;
 
	int color = red << 16 | green << 8 | blue;
 
	return color;
}

How to use it?

Using the ColorFadeText object is quite simple, since it'll be very similar to use a common String. Just follow this plain steps.

1. Create a ColorFadeText instance

ColorFadeText text = new ColorFadeText(
	"I'M A FADING TEXT!",
	new int[]{0xff0000, 0x00ff00, 0x0000ff, 0xff00ff},
	1000
);

2. Start it...

text.start();

3. Paint it, using the same arguments used by Graphics drawString() method (adding a reference to the Graphics instance):

text.paint(g,
	getWidth() / 2,
	2,
	Graphics.HCENTER | Graphics.TOP
);

Just a side note: since it's an animated effect, you'll need to repaint it quite frequently, so, for example, you can use a Thread to periodically call Canvas repaint() method.

Source code download

You can download source code of ColorFadeText, together with a sample Canvas that makes use of it, here: Image:J2me color fading text.zip

Related Discussions
Thread Thread Starter Forum Replies Last Post
****Data writing on a text file in the mobile******** amit.das1980 Mobile Java General 2 2006-01-19 22:19
displaying arabic using j2me raghda Mobile Java General 12 2008-06-29 07:41
如何设置设置列表项的 编辑部分 文本? fn_wyq Symbian 8 2007-01-31 02:04
problem with canvas.text and appuifw.text luke14free Python 1 2006-11-01 09:43
Porting Pure C Code to Symbian c++(Series 60 2nd Edition) jennie General Symbian C++ 3 2007-10-30 14:19
 
Powered by MediaWiki
     
     RDF Facets:
     
     
     qfnZtopicQUqfnTopicZjavaQ
     qfnZtypeQUqfnTypeZCommunityContentQ
     qfnZtypeQUqfnTypeZWebpageQ
     qfnZtypeQUqfnTypeZWikiContentQ
     qmarsZlanguageQUxhttpE3aE2fE2fswE2enokiaE2ecomE2flanguageE2d1E2fenX