TweetFollow Us on Twitter

Blinking Letters
Volume Number:12
Issue Number:8
Column Tag:Getting Started

Blinking Letters, Before

By Dave Mark

Note: Source code files accompanying article are located on MacTech CD-ROM or source code disks.

I just got back from the World Wide Developer’s Conference, where I got very little sleep but had a fantastic time. I saw Gil Amelio’s long-awaited speech, reunited with friends I only get to see a few times a year, got a chance to hone my Java skills, smoked some cigars, and even took a small side trip to Napa Valley.

Before I got to the show, I wrote a small applet for this month’s column. All puffed up with pride, I showed the applet to Peter Lewis (if you don’t know Peter, check out Anarchie, along with his other cool Internet shareware, and peruse the May 1996 issue of MacTech™ Magazine, in which he features heavily), and asked him if he had any comments. What I got back from Peter was a complete rewrite that had a better design, and ran a lot faster to boot!

So here’s what I’m going to do. This month, we’ll go over my original applet, step by step. Once you understand the applet, take some time to think about how you might improve the design. Next month, we’ll take a look at Peter Lewis’ rewrite.

The Original Applet

My applet started life as one of the standard sample Java applets that ships with the JDK. The original Blink was written by Arthur van Hoff (thanks, Arthur) and is shown in Figure 1. It paints a specified string in the applet window, then repeatedly and randomly redraws the words in the window in a series of related colors. (Some words are drawn in the background color, rendering them invisible.)

Figure 1. The original Blink,
as found in the Sun Java sample applets

I rewrote Blink so that it would display its string in a bigger font, blinking the individual letters in completely random colors, as opposed to the related colors used by original Blink. Since I used CodeWarrior to build the applet, I renamed it CWBlink.

Figure 2. My rewrite of Blink, now called CWBlink

Creating the CWBlink Applet

Here’s how I created the CWBlink applet. I started in the CodeWarrior IDE. Since CodeWarrior uses a front-end/back-end architecture (front-end drop-ins for language, back-end drop-ins for target machines), they use the same IDE and debugger for Java as they use for C, C++, and Pascal.

Inside the IDE, I created a new project, using the Java Applet stationery (Figure 3).

Figure 3. The New Project dialog box,
showing the Java Applet stationery

Figure 4. The new Java Applet project window,
before we replace the .html and .java files

Once the project was created (Figure 4), the next step was to replace the .html and .java files with our own. First, I double-clicked the file <replace me Applet>.html in the Project window. When the stationery file opens (notice that it is marked as read-only), I selected Save As... from the File menu and saved the file as CWBlink.html. Next, I replaced the text in the .html file with the following:

<title>Blinking CodeWarrior</title>
<hr>
<applet codebase="CWBlink Classes" code="CWBlink.class" width=530 height=100>
<param name=blinker value="CodeWarrior!!!">
<param name=speed value=1000>
</applet>
<hr>
<a href="CWBlink.java">The source.</a>

Once your HTML is typed in, save the code and close the file.

The HTML code should look familiar. Note that the codebase attribute tells the Java virtual machine the name of the folder containing your class files. The code attribute tells the VM the name of the class file to start with. The blinker parameter is the string that does the blinking. The speed parameter lets you change the speed of the blinking.

Next, double-click the file <replace me Applet>.java. Save the file as CWBlink.java. Replace the contents of the file with the following:

import java.awt.*;

public class CWBlink extends java.applet.Applet
 implements Runnable
{
 Thread blinkThread;
 String blinkString;
 Font   font;
 int    speed;

 public void init()
 {
 font = new java.awt.Font(
 "TimesRoman", Font.PLAIN, 64);
 
 String att = getParameter("speed");
 speed = (att == null) ? 400 :
 (1000 / Integer.valueOf(att).intValue());
 
 att = getParameter("blinker");
 blinkString = (att == null) ? "CodeWarrior!!!" : att;
 }
  
 public void paint(Graphics g)
 {
 int x = 0, y = font.getSize()-10;

 g.setColor(Color.black);
 g.setFont(font);
 FontMetrics fm = g.getFontMetrics();
 
 for (int index=0; index<blinkString.length(); index++ )
 {
 int red = (int)(Math.random() * 256);
 int green = (int)(Math.random() * 256);
 int blue = (int)(Math.random() * 256);
 
 char character = blinkString.charAt(index);
 int w = fm.charWidth(character);
   
 g.setColor( new java.awt.Color( red, green, blue ) );
 
 Character c = new Character( character );
 g.drawString(c.toString(), x, y );
 x += w;
 }
 }

 public void start()
 {
 blinkThread = new Thread(this);
 blinkThread.start();
 }

 public void stop()
 {
 blinkThread.stop();
 }

 public void run()
 {
 while (true)
 {
 try {Thread.currentThread().sleep(speed);}
 catch (InterruptedException e){}
 repaint();
 }
 }
}

The last step in setting up your project is to tell CodeWarrior how you want your applet classes saved. Select Preferences from the Edit menu. When the Preferences dialog appears (Figure 5), select the Java Project item under the Project heading. Make sure “Class Folder” is selected from the Project Type popup. Now type CWBlink Classes in the Folder Name field. This tells CodeWarrior to save all of your classes as .class files in a folder named CWBlink Classes, which is what’s expected by the HTML you typed in earlier.

Figure 5. The Java Project pane from
CodeWarrior’s Preferences dialog

Select Make from the Project menu to compile your .java file and save out your new .class file. Once your code compiles, CodeWarrior will create a new folder called CWBlink Classes, then create a new class file named CWBlink.class inside the CWBlink Classes folder. Once that happens, drag your HTML file onto the Metrowerks Java application. Metrowerks Java will parse your HTML code and run your brand new blinking applet.

Let’s take a look at the source code.

CWBlink Source Code

CWBlink.java starts by importing the java.awt classes. Next, the CWBlink class is defined. Notice that CWBlink extends the Applet class (you’ve seen this before) and also implements the Runnable interface (something new). Here’s what the Sun HTML doc has to say about the java.lang.Runnable interface:

“This interface is designed to provide a common protocol for Objects that wish to execute code while they are active. For example, Runnable is implemented by class Thread. Being active simply means that a thread has been started and has not yet been stopped.

“In addition, Runnable provides the means for a class to be active while not subclassing Thread. A class that implements Runnable can run without subclassing Thread by instantiating a Thread instance and passing itself in as the target. In most cases, the Runnable interface should be used if you are only planning to override the run() method and no other Thread methods. This is important because classes should not be subclassed unless the programmer intends on modifying or enhancing the fundamental behavior of the class.”

Basically, extending an existing class is the traditional subclassing mechanism you are used to from C++. An interface defines a set of methods and variables that will be available from within any class implementing that interface. For example, to implement the Runnable interface, you must provide a method named run() that gets executed when your object is activated. As the HTML summary indicates, the Runnable interface is implemented by the Thread class. The run() method is where the thread’s action takes place.

import java.awt.*;

public class CWBlink extends java.applet.Applet
 implements Runnable
{
 Thread blinkThread;
 String blinkString;
 Font   font;
 int    speed;

The init() method is called when the applet is created. We’ll start off the initialization process by creating a Font object that defines how the blinking text will appear. Next, we’ll load the speed and blinker parameters. Note that speed gets a default value of 400 (otherwise, the value is 1000 divided by the provided value) and blinkString gets a default value of "CodeWarrior!!!".

 public void init()
 {
 font = new java.awt.Font(
 "TimesRoman", Font.PLAIN, 64);
 
 String att = getParameter("speed");
 speed = (att == null) ? 400 :
 (1000 / Integer.valueOf(att).intValue());
 
 att = getParameter("blinker");
 blinkString = (att == null) ? "CodeWarrior!!!" : att;
 }

paint() gets called when the applet’s pane gets an update event. We’ll draw the blinkString at the x and y coordinates. We use the font’s point size to calculate the point where we draw the string in the applet’s pane.

 public void paint(Graphics g)
 {
 int x = 0, y = font.getSize()-10;

We’ll set the foreground color to black and the current font to font. We’ll also build a FontMetrics object from the current Graphics environment. To learn about FontMetrics, see the HTML file java.awt.FontMetrics. This will give us access to methods like charWidth() which lets us calculate the proper x-coordinate for the next letter to be drawn, based on the width of the current character.

 g.setColor(Color.black);
 g.setFont(font);
 FontMetrics fm = g.getFontMetrics();

Next, we’ll step through the blinkString, one letter at a time. For each letter, we’ll calculate a random value for red, green, and blue. We’ll store the current character in character, then calculate the character’s width.

 for (int index=0; index<blinkString.length(); index++ )
 {
 int red = (int)(Math.random() * 256);
 int green = (int)(Math.random() * 256);
 int blue = (int)(Math.random() * 256);
 
 char character = blinkString.charAt(index);
 int w = fm.charWidth(character);

We’ll set the current color using our random red, green, and blue values. Next, we’ll create a new Character object (note that Character is different from char - see java.lang.Character), which gives us an easy way to convert a single character to a string. We need a string to pass to drawString(), and the Character wrapper gives us an easy way to get there. If anyone out there can think of a simpler way to draw the character on the screen at the specified x and y location, please let me know. Just be sure you test your theory before you write!

Once we draw the character, we’ll bump x by the width of the character.

 g.setColor( new java.awt.Color( red, green, blue ) );
 
 Character c = new Character( character );
 g.drawString(c.toString(), x, y );
 x += w;
 }
 }

start() is similar to init(), but gets called when the applet’s document is visited. We’ll create a new Thread object and call its start() method. When the applet’s document is no longer on the screen, the stop() method is called. In our case, we’ll call the Thread’s stop() method to stop the thread.

 public void start()
 {
 blinkThread = new Thread(this);
 blinkThread.start();
 }

 public void stop()
 {
 blinkThread.stop();
 }

Remember that the run() method contains the body of the thread we are starting up. Our thread enters an infinite loop. The loop tries a sleep() for speed milliseconds. We catch the InterruptedException exception (which occurs when another Thread interrupts this thread), but we do nothing about it. The loop ends by forcing a repaint of the applet.

 public void run()
 {
 while (true)
 {
 try {Thread.currentThread().sleep(speed);}
 catch (InterruptedException e){}
 repaint();
 }
 }
}

Till Next Month...

This month’s applet introduced the concept of FontMetrics, type wrappers (in our case, java.lang.Character), and Threads, along with a quick tour of CodeWarrior’s Java environment. Next month, we’ll take a look at Peter Lewis’ rewrite of this applet. Think about how you might improve the design of this applet. What changes would you make? Peter’s changes were very interesting and definitely worth exploring. See you next month.

 

Community Search:
MacTech Search:

Software Updates via MacUpdate

Dropbox 193.4.5594 - Cloud backup and sy...
Dropbox is a file hosting service that provides cloud storage, file synchronization, personal cloud, and client software. It is a modern workspace that allows you to get to all of your files, manage... Read more
Google Chrome 122.0.6261.57 - Modern and...
Google Chrome is a Web browser by Google, created to be a modern platform for Web pages and applications. It utilizes very fast loading of Web pages and has a V8 engine, which is a custom built... Read more
Skype 8.113.0.210 - Voice-over-internet...
Skype is a telecommunications app that provides HD video calls, instant messaging, calling to any phone number or landline, and Skype for Business for productive cooperation on the projects. This... Read more
Tor Browser 13.0.10 - Anonymize Web brow...
Using Tor Browser you can protect yourself against tracking, surveillance, and censorship. Tor was originally designed, implemented, and deployed as a third-generation onion-routing project of the U.... Read more
Deeper 3.0.4 - Enable hidden features in...
Deeper is a personalization utility for macOS which allows you to enable and disable the hidden functions of the Finder, Dock, QuickTime, Safari, iTunes, login window, Spotlight, and many of Apple's... Read more
OnyX 4.5.5 - Maintenance and optimizatio...
OnyX is a multifunction utility that you can use to verify the startup disk and the structure of its system files, to run miscellaneous maintenance and cleaning tasks, to configure parameters in the... Read more
Hopper Disassembler 5.14.1 - Binary disa...
Hopper Disassembler is a binary disassembler, decompiler, and debugger for 32- and 64-bit executables. It will let you disassemble any binary you want, and provide you all the information about its... Read more

Latest Forum Discussions

See All

Zenless Zone Zero opens entries for its...
miHoYo, aka HoYoverse, has become such a big name in mobile gaming that it's hard to believe that arguably their flagship title, Genshin Impact, is only three and a half years old. Now, they continue the road to the next title in their world, with... | Read more »
Live, Playdate, Live! – The TouchArcade...
In this week’s episode of The TouchArcade Show we kick things off by talking about all the games I splurged on during the recent Playdate Catalog one-year anniversary sale, including the new Lucas Pope jam Mars After Midnight. We haven’t played any... | Read more »
TouchArcade Game of the Week: ‘Vroomies’
So here’s a thing: Vroomies from developer Alex Taber aka Unordered Games is the Game of the Week! Except… Vroomies came out an entire month ago. It wasn’t on my radar until this week, which is why I included it in our weekly new games round-up, but... | Read more »
SwitchArcade Round-Up: ‘MLB The Show 24’...
Hello gentle readers, and welcome to the SwitchArcade Round-Up for March 15th, 2024. We’re closing out the week with a bunch of new games, with Sony’s baseball franchise MLB The Show up to bat yet again. There are several other interesting games to... | Read more »
Steam Deck Weekly: WWE 2K24 and Summerho...
Welcome to this week’s edition of the Steam Deck Weekly. The busy season has begun with games we’ve been looking forward to playing including Dragon’s Dogma 2, Horizon Forbidden West Complete Edition, and also console exclusives like Rise of the... | Read more »
Steam Spring Sale 2024 – The 10 Best Ste...
The Steam Spring Sale 2024 began last night, and while it isn’t as big of a deal as say the Steam Winter Sale, you may as well take advantage of it to save money on some games you were planning to buy. I obviously recommend checking out your own... | Read more »
New ‘SaGa Emerald Beyond’ Gameplay Showc...
Last month, Square Enix posted a Let’s Play video featuring SaGa Localization Director Neil Broadley who showcased the worlds, companions, and more from the upcoming and highly-anticipated RPG SaGa Emerald Beyond. | Read more »
Choose Your Side in the Latest ‘Marvel S...
Last month, Marvel Snap (Free) held its very first “imbalance" event in honor of Valentine’s Day. For a limited time, certain well-known couples were given special boosts when conditions were right. It must have gone over well, because we’ve got a... | Read more »
Warframe welcomes the arrival of a new s...
As a Warframe player one of the best things about it launching on iOS, despite it being arguably the best way to play the game if you have a controller, is that I can now be paid to talk about it. To whit, we are gearing up to receive the first... | Read more »
Apple Arcade Weekly Round-Up: Updates an...
Following the new releases earlier in the month and April 2024’s games being revealed by Apple, this week has seen some notable game updates and events go live for Apple Arcade. What The Golf? has an April Fool’s Day celebration event going live “... | Read more »

Price Scanner via MacPrices.net

Apple Education is offering $100 discounts on...
If you’re a student, teacher, or staff member at any educational institution, you can use your .edu email address when ordering at Apple Education to take $100 off the price of a new M3 MacBook Air.... Read more
Apple Watch Ultra 2 with Blood Oxygen feature...
Best Buy is offering Apple Watch Ultra 2 models for $50 off MSRP on their online store this week. Sale prices available for online orders only, in-store prices may vary. Order online, and choose... Read more
New promo at Sams Club: Apple HomePods for $2...
Sams Club has Apple HomePods on sale for $259 through March 31, 2024. Their price is $40 off Apple’s MSRP, and both Space Gray and White colors are available. Sale price is for online orders only, in... Read more
Get Apple’s 2nd generation Apple Pencil for $...
Apple’s Pencil (2nd generation) works with the 12″ iPad Pro (3rd, 4th, 5th, and 6th generation), 11″ iPad Pro (1st, 2nd, 3rd, and 4th generation), iPad Air (4th and 5th generation), and iPad mini (... Read more
10th generation Apple iPads on sale for $100...
Best Buy has Apple’s 10th-generation WiFi iPads back on sale for $100 off MSRP on their online store, starting at only $349. With the discount, Best Buy’s prices are the lowest currently available... Read more
iPad Airs on sale again starting at $449 on B...
Best Buy has 10.9″ M1 WiFi iPad Airs on record-low sale prices again for $150 off Apple’s MSRP, starting at $449. Sale prices for online orders only, in-store price may vary. Order online, and choose... Read more
Best Buy is blowing out clearance 13-inch M1...
Best Buy is blowing out clearance Apple 13″ M1 MacBook Airs this weekend for only $649.99, or $350 off Apple’s original MSRP. Sale prices for online orders only, in-store prices may vary. Order... Read more
Low price alert! You can now get a 13-inch M1...
Walmart has, for the first time, begun offering new Apple MacBooks for sale on their online store, albeit clearance previous-generation models. They now have the 13″ M1 MacBook Air (8GB RAM, 256GB... Read more
Best Apple MacBook deal this weekend: Get the...
Apple has 13″ M2 MacBook Airs available for only $849 today in their Certified Refurbished store. These are the cheapest M2-powered MacBooks for sale at Apple. Apple’s one-year warranty is included,... Read more
New 15-inch M3 MacBook Air (Midnight) on sale...
Amazon has the new 15″ M3 MacBook Air (8GB RAM/256GB SSD/Midnight) in stock and on sale today for $1249.99 including free shipping. Their price is $50 off MSRP, and it’s the lowest price currently... Read more

Jobs Board

Early Preschool Teacher - Glenda Drive/ *Appl...
Early Preschool Teacher - Glenda Drive/ Apple ValleyTeacher Share by Email Share on LinkedIn Share on Twitter Read more
Senior Software Engineer - *Apple* Fundamen...
…center of Microsoft's efforts to empower our users to do more. The Apple Fundamentals team focused on defining and improving the end-to-end developer experience in Read more
Relationship Banker *Apple* Valley Main - W...
…Alcohol Policy to learn more. **Company:** WELLS FARGO BANK **Req Number:** R-350696 **Updated:** Mon Mar 11 00:00:00 UTC 2024 **Location:** APPLE VALLEY,California Read more
Medical Assistant - Surgical Oncology- *Apple...
Medical Assistant - Surgical Oncology- Apple Hill WellSpan Medical Group, York, PA | Nursing | Nursing Support | FTE: 1 | Regular | Tracking Code: 200555 Apply Now Read more
Early Preschool Teacher - Glenda Drive/ *Appl...
Early Preschool Teacher - Glenda Drive/ Apple ValleyTeacher Share by Email Share on LinkedIn Share on Twitter Read more
All contents are Copyright 1984-2011 by Xplain Corporation. All rights reserved. Theme designed by Icreon.