?? java 2d.txt
字號(hào):
一、 引言
在本文中,我們將向你展示如何為扁平形狀添加一種燈光效果以實(shí)現(xiàn)一種類3D外觀。
也許你比較滿意于自己的文字表達(dá)能力,但一幅圖片往往能夠產(chǎn)生更好的效果。對(duì)于圖形處理來說,也是如此;不妨請(qǐng)參考一下圖1中的兩種圖形。在本文中,我將向你展示如何克服左邊扁平形狀所帶來的煩惱而以一種更為光滑的更具舒服感的形狀代替。
圖1.普通扁平形狀與施加Java 2D效果后的形狀
二、 實(shí)現(xiàn)技術(shù)分析
借助于適當(dāng)?shù)念伾憧梢允褂帽疚闹薪榻B的技術(shù)來模擬一種彩色光閃耀"越過"你的形狀,從而生成一種微妙的發(fā)光效果。我們是如何實(shí)現(xiàn)這一效果的呢?請(qǐng)分析下面的代碼;在方法drawBorderGlow()上面的注釋更為細(xì)致地介紹了關(guān)鍵實(shí)現(xiàn)方法:
import java.awt.geom.*;
import java.awt.image.*;
private static final Color clrHi = new Color(255, 229, 63);
private static final Color clrLo = new Color(255, 105, 0);
private static final Color clrGlowInnerHi = new Color(253, 239, 175, 148);
private static final Color clrGlowInnerLo = new Color(255, 209, 0);
private static final Color clrGlowOuterHi = new Color(253, 239, 175, 124);
private static final Color clrGlowOuterLo = new Color(255, 179, 0);
private Shape createClipShape() {
float border = 20.0f;
float x1 = border;
float y1 = border;
float x2 = width - border;
float y2 = height - border;
float adj = 3.0f; //幫助圓化類銳的拐角
float arc = 8.0f;
float dcx = 0.18f * width;
float cx1 = x1-dcx;
float cy1 = 0.40f * height;
float cx2 = x1+dcx;
float cy2 = 0.50f * height;
GeneralPath gp = new GeneralPath();
gp.moveTo(x1-adj, y1+adj);
gp.quadTo(x1, y1, x1+adj, y1);
gp.lineTo(x2-arc, y1);
gp.quadTo(x2, y1, x2, y1+arc);
gp.lineTo(x2, y2-arc);
gp.quadTo(x2, y2, x2-arc, y2);
gp.lineTo(x1+adj, y2);
gp.quadTo(x1, y2, x1, y2-adj);
gp.curveTo(cx2, cy2, cx1, cy1, x1-adj, y1+adj);
gp.closePath();
return gp;
}
private BufferedImage createClipImage(Shape s) {
// 創(chuàng)建一半透明的中間圖像,我們可以使用它來實(shí)現(xiàn)軟修剪效果
GraphicsConfiguration gc = g.getDeviceConfiguration();
BufferedImage img = gc.createCompatibleImage(width, height, Transparency.TRANSLUCENT);
Graphics2D g2 = img.createGraphics();
//清除圖像,這樣所有的像素都具有零alpha
g2.setComposite(AlphaComposite.Clear);
g2.fillRect(0, 0, width, height);
// 把我們的修剪形狀生成到圖像上。注意,我們啟動(dòng)了
// 反走樣功能以實(shí)現(xiàn)軟修剪效果。你可以
//嘗試注釋掉啟動(dòng)反走樣的這一行,那么
//你會(huì)看到通常的生硬的修剪效果.
g2.setComposite(AlphaComposite.Src);
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2.setColor(Color.WHITE);
g2.fill(s);
g2.dispose();
return img;
}
private static Color getMixedColor(Color c1, float pct1, Color c2, float pct2) {
float[] clr1 = c1.getComponents(null);
float[] clr2 = c2.getComponents(null);
for (int i = 0; i < clr1.length; i++) {
clr1[i] = (clr1[i] * pct1) + (clr2[i] * pct2);
}
return new Color(clr1[0], clr1[1], clr1[2], clr1[3]);
}
//下面是實(shí)現(xiàn)技巧:為了實(shí)現(xiàn)發(fā)光效果,我們開始使用一種"內(nèi)部"顏色粗筆
//和筆劃需要的形狀。然后,我們不斷地把筆變細(xì),
//并且不斷地移向"外部"顏色,
//并且不斷地提高顏色的不透明度以便使其朝向形狀的內(nèi)部看上去暗淡。
//我們使用已經(jīng)生成到我們的目的圖像上的"修剪形狀",這樣以來,
//SRC_ATOP規(guī)則就會(huì)修剪在我們的形狀外部的筆劃部分。
private void paintBorderGlow(Graphics2D g2, int glowWidth) {
int gw = glowWidth*2;
for (int i=gw; i >= 2; i-=2) {
float pct = (float)(gw - i) / (gw - 1);
Color mixHi = getMixedColor(clrGlowInnerHi, pct,clrGlowOuterHi, 1.0f - pct);
Color mixLo = getMixedColor(clrGlowInnerLo, pct,clrGlowOuterLo, 1.0f - pct);
g2.setPaint(new GradientPaint(0.0f, height*0.25f, mixHi,0.0f, height, mixLo));
//g2.setColor(Color.WHITE);
g2.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_ATOP, pct));
g2.setStroke(new BasicStroke(i));
g2.draw(clipShape);
}
}
Shape clipShape = createClipShape();
//Shape clipShape = new Ellipse2D.Float(width/4, height/4, width/2, height/2);
//把背景清除為白色
g.setColor(Color.WHITE);
g.fillRect(0, 0, width, height);
//設(shè)置修剪形狀
BufferedImage clipImage = createClipImage(clipShape);
Graphics2D g2 = clipImage.createGraphics();
//使用漸變填充形狀
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2.setComposite(AlphaComposite.SrcAtop);
g2.setPaint(new GradientPaint(0, 0, clrHi, 0, height, clrLo));
g2.fill(clipShape);
//應(yīng)用邊界發(fā)光效果
paintBorderGlow(g2, 8);
g2.dispose();
g.drawImage(clipImage, 0, 0, null);
注意:聰明的讀者可以已經(jīng)注意到,上面應(yīng)用于paintBorderGlow()方法中的技術(shù)也可以用于沿形狀添加一種投影效果。你不妨先猜測(cè)一下如何實(shí)現(xiàn)這一點(diǎn)……好,時(shí)間到!不是在形狀的頂部生成邊緣(記住,修剪能夠確保筆劃僅影響形狀的內(nèi)部),我們可以預(yù)先繞著我們的形狀生成一種可變的灰色邊界。這意味著,陰影筆劃將出現(xiàn)在我們的形狀的外邊;陰影筆劃的內(nèi)部將會(huì)通過我們的形狀而有效地生成。
你可以把下面的一些代碼插入到上面的例子中以便在相應(yīng)的同一個(gè)形狀上添加一種陰影邊界效果:
private void paintBorderShadow(Graphics2D g2, int shadowWidth) {
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_ON);
int sw = shadowWidth*2;
for (int i=sw; i >= 2; i-=2) {
float pct = (float)(sw - i) / (sw - 1);
g2.setColor(getMixedColor(Color.LIGHT_GRAY, pct,Color.WHITE, 1.0f-pct));
g2.setStroke(new BasicStroke(i));
g2.draw(clipShape);
}
}
//在我們繪制形狀的其它部分前應(yīng)用邊界的陰影效果。
paintBorderShadow(g, 6);
下面圖2是最終的結(jié)果圖像:
圖2.施加Java 2D效果后的最終結(jié)果形狀
三、 小結(jié)
在本文中,我僅向你介紹了快速地添加一種陰影效果的方法。如果有時(shí)間的話,我很可能會(huì)使用一種亮灰色和一種非線性斜面來實(shí)現(xiàn)一種更為真實(shí)的效果。還要注意的是,這里介紹的僅是使用Java 2D實(shí)現(xiàn)投影效果的許多方法之一。注意,Romain在他的博客中已經(jīng)討論了多種不同的投影實(shí)現(xiàn)方法。SwingLabs成員在SwingX工程中也提供了一種DropShadowBorder實(shí)現(xiàn);而DropShadowPanel當(dāng)前正在開發(fā)中。
?? 快捷鍵說明
復(fù)制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號(hào)
Ctrl + =
減小字號(hào)
Ctrl + -