In brief… This code will create a nice border for your applets:
http://www.bullsquared.com/gameRevolvoManBorder.jsp
Few ways to do this. I have gone for a simple HTML table, 3x3 Cells. Applet Code in middle cell and 8 images (4 corners, top,left, right, bottom). All 8 images combined are about 1K so no issues with file size etc…
HTML Template Code below (Have tested in Firefox and IE):
<html>
<head>
<title>Applet Border - Demo</title>
</head>
<style>
.ab_top { background: url(images/t.png) repeat-x; }
.ab_left { background: url(images/l.png) repeat-y; }
.ab_right { background: url(images/r.png) repeat-y; }
.ab_bottom { background: url(images/b.png) repeat-x; }
</style>
<body>
<h3 align="center">Ultra-Cool Applet</h3>
<div align="center">
<table cellspacing=0 cellpadding=0 border=0>
<tr>
<td><img src="images/tl.png" ></td>
<td class="ab_top"></td>
<td><img src="images/tr.png" ></td>
</tr>
<tr>
<td class="ab_left"></td>
<td>
<!-- Note.. Remove these comments and all blank space between the <td> and applet tags otherwise you get a couple of pixels of blankspace in IE -->
<div id="replace-me-with-applet-code" style="width: 640px; height: 480px; background: black;"></div>
</td>
<td class="ab_right"></td>
</tr>
<tr>
<td><img src="images/bl.png" ></td>
<td class="ab_bottom"></td>
<td><img src="images/br.png" ></td>
</tr>
</table>
</div>
</body>
</html>
You will need 8 images (tr.png, tl.png, br.png, bl.png, l.png, r.png, t.png. b.png) t=top, r=right etc…(12x12 pixels for corners and 12x1 and 1x12 for sides)
If you are creative maybe some non-rounded corners would be nicer:-
http://www.bullsquared.com/gameRevolvoMan.jsp
If you want some simple images with rounded borders then you can use the below:
Usage is explained with comments in the main method…
import java.awt.Color;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.geom.AffineTransform;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.util.Random;
import javax.imageio.ImageIO;
public class BorderImageGenerator { // By SteveyO
public static void main(String[] args) {
BorderImageGenerator big = new BorderImageGenerator();
String imageFolder = "c:/temp/images"; // Change this to where your web page images are located..(Folder must exist)
Color borderColour = new Color(73,93,96); // To generate a Random colour, comment out this line and uncomment the next one.
// Color borderColour = big.generateRandomColor();
// A Cool trick is to run this program, Refresh your browser Window..And keep on repeating until you find one you like.. (Brute Force Method).
Color webPageColour = new Color(0,0,0,0); // The Colour of the Background in your Web Page.
Color borderOutlineColor = Color.BLACK; // The Colour of the Outline Border of the images. If you dont want this set this to null.
int width=12; // Only seems to work for 12x12 for now..
int height=12;
big.createCornerImages(width, height, borderColour, webPageColour, borderOutlineColor, imageFolder); // Create the 4 corner images
big.createHorizImages(width, 1, borderColour, webPageColour, borderOutlineColor, imageFolder); // Create Left and Right images (1 pixel in height)
big.createVertImages(1, height, borderColour, webPageColour, borderOutlineColor, imageFolder); // Create Top and Bottom Images (1 pixel in width).
}
public void createCornerImages(int width, int height, Color bgColour, Color webPageColour, Color borderOutlineColor, String imageFolder) {
BufferedImage image;
Graphics2D g;
// --------------- Create 4 Corner images ----------------------------------
String fname[] = {"tl", "tr", "br", "bl"}; // (tl = topleft,, tr = topright.....)
image = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB);
g = (Graphics2D) image.getGraphics();
g.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
// TTD This code not quite right.. The first image generated (tl.png) is ok but the other 3 are out by 1 or 2 pixels.. Not quite sure how to fix..
//g.rotate(Math.toRadians((i) * 90), width/2, height/2);
g.setColor(webPageColour); g.fillRect(0,0, width,height);
g.setColor(bgColour);
g.fillOval(0, 0, width*2, height*2);
if (borderOutlineColor != null) {
g.setColor(borderOutlineColor);
g.drawOval(0, 0, width*2, height*2);
g.drawLine(width-2, height, width-2, height-2);
g.drawLine(width-2, height-2, width, height-2);
}
for (int i=0; i<4; i++) {
createImage(rotateImg(image,i*90), imageFolder + "/" + fname[i] + ".png"); // Create Top Left Image
} // End of For loop
}
public void createHorizImages(int width, int height, Color bgColour, Color webPageColour, Color borderOutlineColor, String imageFolder) {
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB);
Graphics2D g = (Graphics2D) image.getGraphics();
g.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
// --------------- Create Left Image ----------------------------------
g.setColor(bgColour);
g.fillRect(0,0,width, 1);
if (borderOutlineColor != null) {
g.setColor(borderOutlineColor);
g.drawLine(0,0,0,0);
g.drawLine(width-2,0,width-2,0);
}
createImage(image, imageFolder + "/l.png"); // Create Top Left Image
// --------------- Create Right Image ----------------------------------
g.setColor(bgColour);
g.fillRect(0,0,width, 1);
if (borderOutlineColor != null) {
g.setColor(borderOutlineColor);
g.drawLine(width-1,0,width-1,0);
g.drawLine(1,0,1,0);
}
createImage(image, imageFolder + "/r.png"); // Create Top Left Image
}
public void createVertImages(int width, int height, Color bgColour, Color webPageColour, Color borderOutlineColor, String imageFolder) {
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB);
Graphics2D g = (Graphics2D) image.getGraphics();
g.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
// --------------- Create Top Image ----------------------------------
g.setColor(bgColour);
g.fillRect(0,0,1, height);
if (borderOutlineColor != null) {
g.setColor(borderOutlineColor);
g.drawLine(0,0,0,0);
g.drawLine(0,height-2,0,height-2);
}
createImage(image, imageFolder + "/t.png"); // Create Top Left Image
// --------------- Create Bottom Image ----------------------------------
g.setColor(bgColour);
g.fillRect(0,0,1, height);
if (borderOutlineColor != null) {
g.setColor(borderOutlineColor);
g.drawLine(0,height-1,0,height-1);
g.drawLine(0,1,0,1);
}
createImage(image, imageFolder + "/b.png"); // Create Top Left Image
}
public void createImage(BufferedImage image, String fileName) {
try {
ImageIO.write(image, "png", new File(fileName));
} catch (IOException e) {
e.printStackTrace();
}
}
public static BufferedImage rotateImg(BufferedImage img, int deg){
int w = Math.max(img.getWidth(), img.getHeight());
int h = w;
BufferedImage newImg = new BufferedImage(w, h, BufferedImage.TYPE_INT_ARGB);
AffineTransform xForm = new AffineTransform();
xForm.rotate(Math.toRadians(deg), w/2, h/2);
Graphics2D g = (Graphics2D)newImg.getGraphics();
g.drawImage(img, xForm, null);
return newImg;
}
public Color generateRandomColor() {
Random rand = new Random();
int r = rand.nextInt(255);
int g = rand.nextInt(255);
int b = rand.nextInt(255);
System.out.println("new Color(" + r + "," + g + "," + b + ")");
return new Color(r,g,b);
}
}
Thats all
Hope it works
Steve
