?? 0092.htm
字號:
<html>
<head>
<title>新時代軟件教程:操作系統(tǒng) 主頁制作 服務(wù)器 設(shè)計軟件 網(wǎng)絡(luò)技術(shù) 編程語言 文字編輯</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
body, table {font-size: 9pt; font-family: 宋體}
a {text-decoration:none}
a:hover {color: red;text-decoration:underline}
.1 {background-color: rgb(245,245,245)}
-->
</style>
</head>
<p align="center"><script src="../../1.js"></script></a>
<p align="center"><big><strong>Java2d</strong></big></p>
<div align="right">---（文/鍾佩珊）</div>
<TABLE width="90%">
<TBODY>
<TR>
<TD class=page><A name=one>一、簡介</A> <BR>
<P>Java 2D API是JFC （Java Fundation Classes）的一員，加強(qiáng)了傳統(tǒng)AWT（ Abstract
Windowing Toolkit ）的描繪功能。在 JDK1.2中已經(jīng)支援 Java 2D 的使用。透過Java 2D API
，Programmer 可以輕松地描繪出任意的幾何圖形、運(yùn)用不同的填色效果、對圖形做旋轉(zhuǎn)（ rotate）、縮放（ scale）、扭曲（
shear）等。如圖一所示，Programmer 透過2D
API所提供的功能，簡單地利用不同類型的線或是填色效果繪出統(tǒng)計圖，以區(qū)分出不同的資料。當(dāng)然， 2D
API還有許多增強(qiáng)AWT能力的部分，像是處理影像檔案可以有不同的濾鏡（filter）效果、對於任意的幾何圖形亦能做碰撞偵測（hit
detection）、圖形重疊混色計算（composite）等功能。文中將會對這些技術(shù)做概略性地介紹。 </P>
<TABLE>
<TBODY>
<TR>
<TD><IMG src="images/2d_f1.gif"> </TD></TR>
<TR>
<TD>
<CENTER>圖一、多種2D的圖形表示法 <A
href="#1">[1]</A>
</CENTER></TD></TR></TBODY></TABLE><A name=two>二、Java 2D API Packages</A>
<BR>
<P>JDK1.2中關(guān)於2D API的Packages如下所述： </P>
<P><B>2.1 java.awt</B></P>
<P>java.awt包含了一些新增的2D API 類別（classes）和介面（interfaces ）。其中 Graphics2D繼承自
java.awt.Graphics
，是描繪2D圖形的物件（object）。如同前版本的JDK所使用的繪圖模式一樣，當(dāng)有物件 要被描繪時，paint或是update
method會自動根據(jù)適當(dāng)?shù)?Graphics Context 來做繪圖的工作。所謂的Graphics Context是與 Graphics
Object相關(guān)狀態(tài)屬性（state attribute）的集合。在Graphics2D中新增了許多狀態(tài)屬性，像是Stroke、
Paint、Clip、 Transform等。</P>
<P><B>2.2 java.awt.geom</B> </P>
<P>java.awt.geom 則包含可以勾勒任何形狀的 GeneralPath類別。它可以由許多不同種類的subpath構(gòu)成，像是lines和
quadratic curves 等。為了兼顧方便性，此package中更定義了許多基本幾何圖形，包括Arc2D 、CubicCurve2D、
Line2D等。這些類別都有兩種型態(tài)，分別是Float precision與Double
precision。此外，還有一種特別的圖形類別：Area，它支援Constructive Area Geometry（
CGA）。CGA是對既有圖形物件做布林運(yùn)算（Boolean Operation）而產(chǎn)生新圖形物件的過程。如圖二所示， Areas支援聯(lián)集（
union）、交集（ intersection）、差集（subtraction ）、Exclusive OR （XOR）等布林運(yùn)算。最後，
AffineTransform 類別則提供圖形物件做Scale、Shear 、Rotate等座標(biāo)上的轉(zhuǎn)換。</P>
<TABLE>
<TBODY>
<TR>
<TD><IMG src="images/2d_f2.gif"> </TD></TR>
<TR>
<TD>
<CENTER>圖二、 Boolean Operation<A
href="#2">[2]</A>
</CENTER></TD></TR></TBODY></TABLE>
<P><B>2.3 java.awt.font</B> </P>
<P>java.awt.font 中定義了 TextLayout類別，負(fù)責(zé)建構(gòu)text shape、執(zhí)行適當(dāng)?shù)?text
operations，如碰撞偵測與打光 (highlighting)等，以及決定text的適當(dāng)位置與順序。 </P>
<P><B>2.4 java.awt.image</B></P>
<P>Java 2D API支援三種影像模式。包括 producer/consumer (push) model、 immediatemode
model和 pipeine(pull) model。Push model 在前版本的JDK中支援。而Pull model 則在即將出現(xiàn)的 Java
Advanced Imaging AP中會支援。於此，我們只探討JDK1.2中出現(xiàn)的Immediate mode imaging
model。在此model下， Programmer可以透過2D API對image data（ BufferedImage or
Raster）做濾鏡的效果。在Package java.awt.image中，immediate mode imaging APIs
可以被歸為六大類： interfaces、image data classes、 image operation classes、sample
model classes、 color model classes和 exceptions。其中 operation classes 即定義了許多
filter ，包括了 AffinTransformOp 、BandCombineOp、 ColorConvertOp、 ConvolveOp、
LookupOp、 RescaleOp等。透過以上所提之濾鏡，可以做到 geometrically transform、blur、
sharpen、enhance contrast、 threshold和color correct images等效果。如圖三所示，source
image經(jīng)過filter，產(chǎn)生出新的圖形。</P>
<TABLE>
<TBODY>
<TR>
<TD><IMG src="images/2d_f3.gif"> </TD></TR>
<TR>
<TD>
<CENTER>圖三、 Image Processing Model <A
href="#3">[3]</A>
</CENTER></TD></TR></TBODY></TABLE>
<P><B>2.5 java.awt.color</B></P>
<P>Package java.awt.color定義了class ColorSpace。此 class提供
Programmer轉(zhuǎn)換色盤的method。 </P>
<P><B>2.6 java.awt.print</B></P>
<P>Java Printing API提供Programmer 列印AWT和Java 2D graphics(composit ed
graphics和 images)的method。并可讓User設(shè)定 print的屬性，如雙面列印等。</P><A
name=three>三、Java 2D Programming初步</A> <BR>
<P> 解了Java 2D API
各相關(guān)的package資訊之後，可以進(jìn)一步地實(shí)做一些簡單的Applications來體認(rèn)2D的美妙。在那之前，我們先學(xué)習(xí)一些基本的2D
programming codes 。 </P>
<P><B>3.1基本步驟 </B></P>
<P>繪圖的第一個步驟是產(chǎn)生 Graphics2D Object 。 接著是設(shè)定你所 要的狀態(tài)屬性。例如你想要對一物件做漸層式的填色，可以設(shè)定屬性
Paint為 GradientPaint。最後再呼叫 Graphics2D所提供的redering method
，fill或是draw，完成整個繪圖的程序。以下即是此基本步驟的范例程式碼：</P>
<P align=center>
<TABLE width="70%">
<TBODY>
<TR>
<TD class=detail><PRE>
import java.awt.*;
import java.awt.geom.*;
public void paint(Graphics g)
{
Ellipse2D.Float shape;
GradientPaint gp;
// create a Graphics2D
Graphics2D g2 = (Graphics2D) g ;
// create a Ellipse2D (x,y,w,h)
shape = new Ellipse2D.Float (200,200,60,60);
// create a Cyclic GradientPaint
// (x1,y1,color1,x2,y2,color2, boolean cyclic)
gp = new GradientPaint (180,190,Color.yellow,220,210,Color.red,true);
g2.setPaint(gp);
g2.fill(shape);
}
</PRE></TD></TR></TBODY></TABLE></P><PRE></PRE>
<P><B>3.2 如何畫線</B></P>
<P>在jdk尚未支援 2D圖形之前， Programmer只可以畫出直的、相同粗細(xì)的線條。現(xiàn)在，我們就教您如何透過2D
API繪出不同粗細(xì)的線條及圓滑的曲線。在package java.awt.geom中提供了Line2D、 QuadCurve2D及
CubicCurve2D等 classes，讓 Programmer輕松地繪出想要的線條。范例程式碼如下所示：</P>
<P align=center>
<TABLE width="70%">
<TBODY>
<TR>
<TD class=detail><PRE>import java.awt.geom.*;
…
Line2D.Float line;
CubicCurve2D.Float cubic;
// create a Line2D
line = new Line2D.Float(20,390,200,390);
// create a CubicCurve2D,比直線多了兩個控制點(diǎn)
cubic = new CubicCurve2D.Float(70,100,120,50,170,270,220,100);
// 設(shè)定描繪的粗細(xì)
g2. setStroke(new BasicStroke(2.0f));
g2.setColor(Color.blue);
g2.draw(line);
line = new Line2D.Float(30,400,250,400);
// 設(shè)定描繪的粗細(xì)
g2. setStroke(new BasicStroke(5.0f));
g2.draw(line);
</PRE></TD></TR></TBODY></TABLE></P><PRE></PRE>
<P><B>3.3顯示字串 </B></P>
<P>透過Java 2D， Programmer可以顯示更細(xì)致的文字。如范例程式碼的效果：顯示出外邊為淡藍(lán)色的字串 " Font Test
"。</P>
<P align=center>
<TABLE width="70%">
<TBODY>
<TR>
<TD class=detail><PRE>
import java.awt.font.*;
…
Shape sha;
FontRenderContext frc =g2.getFontRenderContext();
TextLayout tl = new TextLayout("Font Test",new Font("Modern",
Font.BOLD+Font.ITALIC,20),frc);
sha=tl.getOutline(AffineTransform.getTranslateInstance(50,380));
g2.setColor(Color.blue);
g2.setStroke(new BasicStroke(2.0f));
g2.draw(sha);
g2.setColor(Color.white);
g2.fill(sha);
</PRE></TD></TR></TBODY></TABLE></P><PRE></PRE>
<P><B>3.4圖檔處理 </B></P>
<P>之前，若希望圖形有濾鏡的效果，必須透過可以處理圖形的繪圖軟體來幫忙。在2D API中則提供了一些簡單的method，使得
Programmer可以直接用程式碼來對圖形作濾鏡效果的控制。下面即介紹其中一種效果。范例程式碼如下所示： </P>
<P align=center>
<TABLE width="70%">
<TBODY>
<TR>
<TD class=detail><PRE>
float[] elements = {0.0f, -1.0f, 0.0f,-1.0f, 4.f, -1.0f,0.0f, -1.0f, 0.0f};
Image img = Toolkit.getDefaultToolkit().getImage("boat.gif");
int w = img.getWidth(this);
int h = img.getHeight(this);
BufferedImage bi = new BufferedImage(w,h,BufferedImage.TYPE_INT_RGB);
Graphics2D big = bi.createGraphics();
big.drawImage(img,0,0,this);
BufferedImageOp biop = null;
AffineTransform at = new AffineTransform();
BufferedImage bimg = new BufferedImage(img.getWidth(this),img.getHeight(this),
BufferedImage.TYPE_INT_RGB);
Kernel kernel = new Kernel(3,3,elements);
ConvolveOp cop = new ConvolveOp(kernel,ConvolveOp.EDGE_NO_OP,null);
cop.filter(bi,bimg);
biop = newAffineTransformOp(at,AffineTransformOp.TYPE_NEAREST_NEIGHBOR);
g2 = (Graphics2D)this.getGraphics();
g2.drawImage(bimg,biop,0,0);
</PRE></TD></TR></TBODY></TABLE></P><PRE></PRE>
<P>上面的范例程式碼造成圖四到圖五的變化。 </P>
<TABLE>
<TBODY>
<TR>
<TD><IMG src="images/2d_f4.gif"> </TD></TR>
<TR>
<TD>
<CENTER>圖四、原始圖</CENTER></TD></TR></TBODY></TABLE>
<TABLE>
<TBODY>
<TR>
<TD><IMG src="images/2d_f5.gif"> </TD></TR>
<TR>
<TD>
<CENTER>圖五、經(jīng)過filter處理後的圖形</CENTER></TD></TR></TBODY></TABLE><A
name=four>四、參考資料</A>
<DL>
<DT>
<DD><A name=1>[1]</A> Java Tutorial-2D Graphics-,<A
href="../../java.sun.com/docs/books/tutorial/2d/index.html">http://java.sun.com/docs/books/tutorial/2d/index.html</A>
<DD><A name=2>[2]</A> Java 2D Progrmmer's Guide,Chapter 3-Geometries- <A
href="../../java.sun.com/products/jdk/1.2/docs/guide/2d/spec/j2d-geom.fm2.html">http
://java.sun.com/p roducts/jdk/1.2/d ocs/guide/2d/spec /j2d-geom.fm2.htm
l</A>
<DD><A name=3>[3]</A> [3]Java 2D Programmer;s Guide,Chapter 5-imaging-
<A
href="../../java.sun.com/products/jdk/1.2/docs/guide/2d/spec/j2d-image.fm2.html">htt
p://java.sun.com/ products/jdk/1.2/ docs/guide/2d/spe c/j2d-image.fm2.h
tml</A> </DD></DL></TD></TR></TBODY></TABLE>
</table>
<p align="center"><script src="../../2.js"></script></a>
</body>
</html>?? 快捷鍵說明
復(fù)制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -