JavaSwing制作水晶效果

1、JavaSwing制作水晶效果一、序言關(guān)于Java做不好桌面”的爭(zhēng)論已經(jīng)由來(lái)已久。雖然Swing和Java2D已經(jīng)有超過(guò)十年的歷史，也有JIDE、JGoodies、TWaver等不少開源Swing組件，但是用Java做桌面程序仍然不 是一件輕松的事。本Java也驚艷系列文章，就是想通過(guò)一些簡(jiǎn)單生動(dòng)的例子，和大家 一起認(rèn)識(shí)Java、探索Swing。其實(shí)你只需要多一點(diǎn)創(chuàng)意、多一點(diǎn)耐心，你的Java程序也可以“驚艷”！本文就帶您一起進(jìn)入Java的“水晶之戀”。二、立體水晶效果受蘋果公司的影響，現(xiàn)在立體水晶風(fēng)格的界面非常流行。Java也可以嗎？我們不妨先嘗試一下用Java繪制一個(gè)立體水晶風(fēng)格的按鈕到底

2、有多難。一個(gè)立體的水晶按鈕應(yīng)當(dāng)有一個(gè)圖 標(biāo)、一個(gè)圓角矩形區(qū)域、邊框以及一些立體反光效果，如下圖：簡(jiǎn)單思路如下：先畫矩形區(qū)域，然后畫圖標(biāo)，然后設(shè)置clip并畫高亮反光區(qū)域，最后畫外部邊框。具體實(shí)現(xiàn)比較簡(jiǎn)單，主要代碼如下：Color color = TWaverUtil.getRa ndomColor();RoundRectangle2D body = new RoundRectangle2D.FIoat(x,y, size, size, size / 3, size/ 3);/draw bodyg2d.setColor(color);Gradie ntPai nt paint = new Gra

3、die ntPai nt(x,y,color.darker(),x,y + size,color.brighter().brighter();g2d.setPa in t(pa in t);g2d.fill(body);/draw imageg2d.setClip(body);Image image = TWaverUtil.getlmage(/glass/ + i + .p ng); g2d.drawlmage(image,x + (size - image.getWidth(null) / 2,y + (size - image.getHeight (nu II) / 2,n ull);g

4、2d.setClip( null);/draw highlight.Shape highlightArea = createHighlightShape(x, y, size, body);g2d.setColor( new Color(255, 255, 255, 150);g2d.fill(highlightArea);/draw outl ine.g2d.setColor(color.darkGray);g2d.draw(body);其中，對(duì)高亮區(qū)域的計(jì)算，可以用一個(gè)圓心在左上方的大圓形和矩形進(jìn)行剪切：private staticShape createHighlightShape(in

5、tcenterX, int centerY, int size, Shapebody) double myRadius = size * 4;double x = cen terX - size * 2.3;double y = cen terY - size * 3.2;Ellipse2D.Double circle = new Ellipse2D.Double(x, y, myRadius, myRadius);Area area = new Area(circle);area.i ntersect( new Area(body);return area;運(yùn)行程序效果如下：三、更多變化 根

6、據(jù)上面例子稍作形狀變換，可以畫出立體水晶球的按鈕。Color color = TWaverUtil.getRandomColor();Ellipse2D.Double circle = new Ellipse2D.Double(centerX - radius, centerY - radius, radius * 2, radius* 2);/draw bodyg2d.setColor(color);GradientPaint paint = new GradientPaint(centerX, centerY,color, centerX, centerY+ radius * 2, col

7、or.brighter().brighter();g2d.setPaint(paint); g2d.fill(circle);/draw image g2d.setClip(circle);Image image = TWaverUtil.getImage(/glass/ + i + .png); g2d.drawImage(image,centerX - image.getWidth(null) / 2,centerY - image.getHeight(null) / 2,null);g2d.setClip(null);/draw highlight.Shape highlightArea

8、 = createHighlightShape(centerX, centerY, radius); g2d.setColor(new Color(255,255, 255, 150);g2d.fill(highlightArea);唯一略有不同的部分是，水晶球的高亮區(qū)域要用兩個(gè)圓形拼切：private static Shape createHighlightShape(int centerX, int centerY, int radius) double myRadius =radius * 0.8;double x = centerX - myRadius;double y1 = cen

9、terY - myRadius - myRadius / 5;double y2 = centerY - myRadius - myRadius / 5 * 2;Ellipse2D.Double circle1 = new Ellipse2D.Double(x, y1, myRadius * 2, myRadius * 2);Ellipse2D.Double circle2 = new Ellipse2D.Double(x, y2, myRadius * 2, myRadius * 2);Area area = new Area(circle1); ersect(new Are

10、a(circle2);return area;運(yùn)行效果如下:四、融入Swing組件以上例子僅使用了Java2D進(jìn)行繪圖。在實(shí)際使用中，需要將這些效果應(yīng)用的Swing組件中,例如按鈕等。一個(gè)簡(jiǎn)單的方式是：將以上圖形效果在內(nèi)存中生成內(nèi)存圖片并封裝到一個(gè)Imagelcon中，然后將Imagelcon圖標(biāo)作為JButton的圖標(biāo)進(jìn)行顯示。public static Image createlmagelc on (Image pha ntom, int size) Bufferedlmage bi = new Bufferedlmage(size, size, Bufferedlmage.TYPE_IN

11、T_ARGB);Graphics2D g2d = bi.createGraphics();g2d.setRe nderi ngHi nt(Re nderi ngHi nts.KEY_ANTIALIASING,Ren deri ngHi nts.VALUE_ANTIALIAS_ON);int cen ter = size / 2;int radius = cen ter;/此處進(jìn)行畫圖g2d.dispose(); return bi;然后，用這些Icon創(chuàng)建一些按鈕并顯示:public static void main(String args) throws Exception JFrame f

12、rame = new JFrame();frame.getC onten tPa ne().setLayout (new FlowLayout();frame.getCo nten tPa ne().add( new JButto n(”按鈕1, newframe.setDefaultCloseOperati on (JFrame.EXIT_ON_CLOSE);TWaverUtil.ce nterWi ndow(frame); frame.setVisible(true);本例子沒有使用Look And Feel。你也可以使用JGoodies來(lái)美化一下，效果肯定更好。五、總結(jié)可以看出，畫出這類立體水晶效果并不難，只需仔細(xì)觀察這些效果的光學(xué)細(xì)節(jié)，并用Java2D的API來(lái)實(shí)現(xiàn)即可。這些例子稍作改進(jìn)，就可以用來(lái)繪制JButton等Swing組件，并用在實(shí)際項(xiàng)目中。或者，也可以應(yīng)用這些技巧來(lái)做一些復(fù)雜圖形界面，如在TWaver中做出的網(wǎng)絡(luò)拓?fù)鋱D效果：.4Ff本文知