Java-Gaming.org Hi !
Featured games (83)
games approved by the League of Dukes
Games in Showcase (542)
Games in Android Showcase (133)
games submitted by our members
Games in WIP (604)
games currently in development
News: Read the Java Gaming Resources, or peek at the official Java tutorials
 
    Home     Help   Search   Login   Register   
Pages: [1]
  ignore  |  Print  
  Applet Border/Frame Generator  (Read 1896 times)
0 Members and 1 Guest are viewing this topic.
Offline steveyO
« Posted 2009-05-26 20:58:39 »

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):

1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
15  
16  
17  
18  
19  
20  
21  
22  
23  
24  
25  
26  
27  
28  
29  
30  
31  
32  
33  
34  
35  
36  
37  
38  
39  
40  
41  
42  
43  
 <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..

1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
15  
16  
17  
18  
19  
20  
21  
22  
23  
24  
25  
26  
27  
28  
29  
30  
31  
32  
33  
34  
35  
36  
37  
38  
39  
40  
41  
42  
43  
44  
45  
46  
47  
48  
49  
50  
51  
52  
53  
54  
55  
56  
57  
58  
59  
60  
61  
62  
63  
64  
65  
66  
67  
68  
69  
70  
71  
72  
73  
74  
75  
76  
77  
78  
79  
80  
81  
82  
83  
84  
85  
86  
87  
88  
89  
90  
91  
92  
93  
94  
95  
96  
97  
98  
99  
100  
101  
102  
103  
104  
105  
106  
107  
108  
109  
110  
111  
112  
113  
114  
115  
116  
117  
118  
119  
120  
121  
122  
123  
124  
125  
126  
127  
128  
129  
130  
131  
132  
133  
134  
135  
136  
137  
138  
139  
140  
141  
142  
143  
144  
145  
146  
147  
148  
149  
150  
151  
152  
153  
154  
155  
156  
157  
158  
159  
160  
161  
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

https://play.google.com/store/apps/details?id=com.bullsquared.alggame Annoying Little Gits (Android)
www.bullsquared.com   Play java (applet) games! www.chessclockpro.com Free Online Chess Clock
Offline zoto

Senior Devvie


Medals: 4



« Reply #1 - Posted 2009-05-27 01:33:43 »

This fixes the pixel off bug and adds support for transparency so the web page color isn't needed.

1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
15  
16  
17  
18  
19  
20  
21  
22  
23  
24  
25  
26  
27  
28  
29  
30  
31  
32  
33  
34  
35  
36  
37  
38  
39  
40  
41  
42  
43  
44  
45  
46  
47  
48  
49  
50  
51  
52  
53  
54  
55  
56  
57  
58  
59  
60  
61  
62  
63  
64  
65  
66  
67  
68  
69  
70  
71  
72  
73  
74  
75  
76  
77  
78  
79  
80  
81  
82  
83  
84  
85  
86  
87  
88  
89  
90  
91  
92  
93  
94  
95  
96  
97  
98  
99  
100  
101  
102  
103  
104  
105  
106  
107  
108  
109  
110  
111  
112  
113  
114  
115  
116  
117  
118  
119  
120  
121  
122  
123  
124  
125  
126  
127  
128  
129  
130  
131  
132  
133  
134  
135  
136  
137  
138  
139  
140  
141  
142  
143  
144  
145  
146  
147  
148  
149  
150  
151  
152  
153  
154  
155  
156  
157  
158  
159  
160  
161  
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);
   }

}
Offline steveyO
« Reply #2 - Posted 2009-05-27 07:11:04 »

Thanks zoto,  Works great!  Will update my original post later with your changes.  Wink

https://play.google.com/store/apps/details?id=com.bullsquared.alggame Annoying Little Gits (Android)
www.bullsquared.com   Play java (applet) games! www.chessclockpro.com Free Online Chess Clock
Games published by our own members! Check 'em out!
Legends of Yore - The Casual Retro Roguelike
Offline steveyO
« Reply #3 - Posted 2009-05-28 20:52:43 »

Original post updated with pixel off bug fixed (thnx zoto). Seems to work perfectly now.

Demo updated too (now have a purple border .. the random colour generator is great if you are stuck for ideas!)
http://www.bullsquared.com/gameRevolvoManBorder.jsp

https://play.google.com/store/apps/details?id=com.bullsquared.alggame Annoying Little Gits (Android)
www.bullsquared.com   Play java (applet) games! www.chessclockpro.com Free Online Chess Clock
Pages: [1]
  ignore  |  Print  
 
 
You cannot reply to this message, because it is very, very old.

 

Add your game by posting it in the WIP section,
or publish it in Showcase.

The first screenshot will be displayed as a thumbnail.

Elsealabs (9 views)
2014-12-28 10:39:27

CopyableCougar4 (16 views)
2014-12-28 02:10:29

BurntPizza (20 views)
2014-12-27 22:38:51

Mr.CodeIt (13 views)
2014-12-27 04:03:04

TheDudeFromCI (18 views)
2014-12-27 02:14:49

Mr.CodeIt (25 views)
2014-12-23 03:34:11

rwatson462 (56 views)
2014-12-15 09:26:44

Mr.CodeIt (46 views)
2014-12-14 19:50:38

BurntPizza (93 views)
2014-12-09 22:41:13

BurntPizza (114 views)
2014-12-08 04:46:31
How do I start Java Game Development?
by gouessej
2014-12-27 19:41:21

Resources for WIP games
by kpars
2014-12-18 10:26:14

Understanding relations between setOrigin, setScale and setPosition in libGdx
by mbabuskov
2014-10-09 22:35:00

Definite guide to supporting multiple device resolutions on Android (2014)
by mbabuskov
2014-10-02 22:36:02

List of Learning Resources
by Longor1996
2014-08-16 10:40:00

List of Learning Resources
by SilverTiger
2014-08-05 19:33:27

Resources for WIP games
by CogWheelz
2014-08-01 16:20:17

Resources for WIP games
by CogWheelz
2014-08-01 16:19:50
java-gaming.org is not responsible for the content posted by its members, including references to external websites, and other references that may or may not have a relation with our primarily gaming and game production oriented community. inquiries and complaints can be sent via email to the info‑account of the company managing the website of java‑gaming.org
Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines | Managed by Enhanced Four Valid XHTML 1.0! Valid CSS!