Date post: | 01-Jun-2018 |
Category: |
Documents |
Upload: | holly-williams |
View: | 221 times |
Download: | 0 times |
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 1/57
Java Two Dimensional Graphics
with Afne Transorms
Sasank Upadrasta
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 2/57
Contents
• Introduction to 2D usin Java
• Drawin Geometric !rimitives
• "hat are Afne Transorms
• Java #rame "orks $ afne
• %eerences
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 3/57
Introduction to 2D usin Java
• Java2D A!I includes these packaesjava.awt
java.awt.image
java.awt.color
java.awt.font
java.awt.geom
java.awt.print
java.awt.renderable
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 4/57
Shapes and Areas
• Shapes & create standard shape o'(ects anddraw them in one method call instead odrawin each sement with multiple methodcalls) The shapes include rectanles andellipses and also ar'itrar* shapes such as the!ol*on class) The shape classes implementthe Shape interace and provide a !athIteratorthat steps throuh the sements o the ivenshape)
• Areas & com'ine shapes in di+erent wa*s tocreate new areas)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 5/57
• Stroke & var* the thickness o a line, producear'itrar* dot&dash se-uences, select howcorners and line ends are shaped, etc)
• Paint & .ll the interiors o shapes, as well asoutlines, not (ust with solid colors 'ut with– gradients o one color to another, and
– textured patterns o tiled imaes)
Strokes and !aint
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 6/57
Afne Transormations
• Transformations & afne transormations /i)e)those eometrical transormations that keepparallel lines parallel0 can take a shape and
translate it, rotate it, shear it, compress ore1pand it) ultiple transormations can 'ecompounded toether)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 7/57
Compositin and Clippin
• Compositing & overla* shapes and imaesaccordin to several optional rules that takeadvantae o the alpha transparenc*)
• Clipping & to speed up perormance, onl*redraw the portion o the displa* that lieswithin a iven outline or clip) "ith Java2d onecan use ar'itrar* clip outlines rather than (ust
rectanles)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 8/57
Te1t, Color and Imaes
• Text & vast arra* o te1t renderin capa'ilitiesthat rane rom the 'asic drawStrin/0 methodto creatin *our own editor rom scratch)
• Color & lots o tools to help render colors in aconsistent manner reardless o the device onwhich the* are displa*ed)
• Images & use man* o the a'ove tools and
techni-ues that are used with shapes & e))transormations, compositin, clippin etc) & onimaes)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 9/57
Imae #ilters and !rintin
• Image processing & appl* imae .lters& ede enhancement, 'lurrin,
inversion, etc) are availa'le)• Printing & print the raphics displa* to
the local printer as shown on themonitor)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 10/57
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 11/57
The Graphics class
• The vast ma(orit* o uses or the Java2D A!I utili3e a small su'set o its
capa'ilities encapsulated in thejava.awt.Graphics class) ost methods othe Graphics class can 'e divided into
two 'asic roups4
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 12/57
5) Draw and .ll methods, ena'lin *ou torender 'asic shapes, te1t, and imaes
2) Attri'utes settin methods, which a+ect
how that drawin and .llin appears
• ethods such as setFont and setColor de.ne how draw and .ll methods
render)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 13/57
Drawin method e1amples
• drawStrin $ #or drawin te1tg.drawString("Hello", 10, 10);
• drawImae $ #or drawin imaes
g.drawImage(img, 0, 0, width, height, 0, 0,imageWidth, imageHeight, null);
• draw6ine, drawArc, draw%ect, draw7val,drawPolgon ! For drawing geometri sha#es
g$.draw(new %ine$&.&ou'le(0, 0, 0, 0));
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 14/57
Imae scalin
• 8ou can choose one o several methodsin the Graphics class 'ased on whether
*ou want to render the imae at thespeci.ed location in its oriinal si3e orscale it to .t inside the iven rectanle
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 15/57
Transparenc* and #ill
• 8ou can .ll the transparent areas o theimae with color or keep them
transparent• #ill methods appl* to eometric shapesand include *ill+r, *illet, *ill-al,*illPolgon)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 16/57
2D Coordinates
• "hether *ou draw a line o te1t or an imae,remem'er that in 2D raphics ever* point is
determined '* its 1 and * coordinates) All o
thedraw and .ll methods need this inormationwhich determines where the te1t or imaeshould 'e rendered)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 17/57
Usin 1,* Coordinates
• #or e1ample, to draw a line, an applicationcalls the ollowin4
/aa.awt.ra#his.draw%ine(int 1, int 1, int
$, int $)
In this code (x1, y1) is the start point o theline, and (x2, y2) is the end point o the line)
• So the code to draw a hori3ontal line is as
ollows4ra#his.draw%ine($0, 100, 1$0, 100);
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 18/57
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 19/57
"eather e1ample /continued0
The setFont and drawString methods render thetemperature and the weather condition)
...
77 Free4ing, Cold, Cool, Warm, Hot,
77 8lue, reen, 9ellow, -range, edFont *ont 2 new Font("Seri*", Font.P%+I:, );g.setFont(*ont);String tem#String 2 *eels < " " < tem#erature<"F";FontenderContet *r 2((ra#his$&)g).getFontenderContet();...
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 20/57
"eather e1ample /continued0
The setFont and drawString methods render thetemperature and the weather condition)
...
g.setColor(tetColor);
int =et=em# 2 r>?(int)'ounds=em#.get>(); int =et=em# 2 r9?(int)'ounds=em#.get9();g.drawString(tem#String, =et=em#, =et=em#);int =etCond 2 r>?(int)'oundsCond.get>();int =etCond 2 r9?(int)'oundsCond.get9() <(int)'ounds=em#.getHeight(); g.drawString(ondStr,
=etCond, =etCond);
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 21/57
Introduction to 2D usin Java/contd 90
• The *illet method allows *ou to draw a rectanle .lled withthe speci.ed color)...
etangle$& 'ounds=em# 2
*ont.getString8ounds(tem#String, *r);etangle$& 'oundsCond 2 *ont.getString8ounds(ondStr,*r);int w=et 2 @ath.ma((int)'ounds=em#.getWidth(),(int)'oundsCond.getWidth());int h=et 2 (int)'ounds=em#.getHeight() <(int)'oundsCond.getHeight();
int r> 2 (si4e.width?w=et)7$;int r9 2 (si4e.height?h=et)7$;g.setColor(Color.%IH=A+9);g$.*illet(r>, r9, w=et, h=et);...
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 22/57
Geometric !rimitives
• The Java 2D: A!I provides several classes thatde.ne common eometric o'(ects such aspoints, lines, curves, and rectanles) These
eometr* classes are part o the /aa.awt.geom packae)
• The PathIterator interace de.nes methods orretrievin elements rom a path)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 23/57
Shape Interace
• The Sha#e interace provides a set o methodsor descri'in and inspectin eometric patho'(ects) This interace is implemented '* the
eneralPath class and other eometr* classes)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 24/57
Geometric !rimitives
• All e1amples represented in this section createeometries '* usin /aa.awt.geom and thenrender them '* usin the ra#his$& class) To
'ein *ou o'tain a ra#his$& o'(ect, ore1ample '* castin the ra#his parameter othe #aint() method)
#u'li oid #aint (ra#his g) 5
ra#his$& g$ 2 (ra#his$&) g;
...
6
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 25/57
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 26/57
!oint 6ocations
• To create a point with the coordinates <,< *ouuse the deaultconstructor, Point$&.&ou'le() )
8ou can use the set%oation method to set the
position o the point as ollows4
set%oation(dou'le , dou'le ) $ To set thelocation o the point& de.nin coordinates asdou'le values
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 27/57
Set 6ocation
• set%oation(Point$& #) $ To set the location othe point usin the coordinates o anotherpoint)
Also, the Point$& class has methods tocalculate the distance 'etween the currentpoint and a point with iven coordinates, orthe distance 'etween two points)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 28/57
6ine
• The %ine$& class represents a line sement in/1, *0 coordinate space) The %ine$&.Float and%ine$&.&ou'le su'classes speci* lines in ;oat
and dou'le precision) #or e1ample4
77 draw %ine$&.&ou'le
g$.draw(new %ine$&.&ou'le(1, 1, $, $));
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 29/57
Set 6ine methods
• This class includes several set%ine() methodsto de.ne the endpoints o the line)Alternativel*, the endpoints o the line could
'e speci.ed '* usin the constructor or the%ine$&.Float class as ollows4– %ine$&.Float(*loat >1, *loat 91, *loat >$,*loat 9$)
– %ine$&.Float(Point$& #1, Point$& #$)
• Use the StroBe o'(ect in the Graphics2D classto de.ne the stroke or the line path)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 30/57
=llipse
• The =llipse2d class represents an ellipsede.ned '* a 'oundin rectanle) Thelli#se$&.Float and lli#se$&.&ou'le su'classes
speci* an ellipse in ;oat and dou'le precision)lli#se is ull* de.ned '* a location, a widthand a heiht) #or e1ample4
77 draw lli#se$&.&ou'le
g$.draw(new lli#se$&.&ou'le(, , retwidth,retheight));
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 31/57
%ectanle
• Classes that speci* primitives represented inthe ollowin e1ample e1tend theetangularSha#e class, which implements the
Sha#e interace and adds a ew methods o itsown)
These methods ena'les *ou to et inormationa'out a shape>s location and si3e, to e1aminethe center point o a rectanle, and to set the
'ounds o the shape)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 32/57
%ectanle
• The etangle$& class represents arectanle de.ned '* a location /1, *0and dimension /w 1 h0) Theetangle$&.Float andetangle$&.&ou'le su'classes speci* arectanle in ;oat and dou'le precision)#or e1ample4
77 draw etangle$&.&ou'leg$.draw(new etangle$&.&ou'le(, , retwidth,retheight));
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 33/57
%ounded %ectanle
• The oundetangle$& class represents arectanle with rounded corners de.ned '* alocation /1, *0, a dimension /w 1 h0, and the
width and heiht o the corner arc) Theoundetangle$&.Float andoundetangle$&.&ou'le su'classes speci* a
round rectanle in ;oat and dou'le precision)
S i i % d d
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 34/57
Speci*in %ounded%ectanle
• The rounded rectanle is speci.ed withollowin parameters4
– 6ocation– "idth
– ?eiht
– "idth o the corner arc
– ?eiht o the corner acr
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 35/57
%ounded %ectanle location
• To set the location, si3e, and arcs o aoundetangle$& o'(ect, use the methodsetoundet(dou'le a, dou'le , dou'le w,
dou'le h, dou'le arWidth, dou'le arHeight))#or e1ample4
77 draw oundetangle$&.&ou'le
g$.draw(new oundetangle$&.&ou'le(, ,
retwidth, retheight, 10, 10));
D i G t i
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 36/57
Drawin Geometric!rimitives /Contd 90
• The e1ample athttp4@@(ava)sun)com@docs@'ooks@tutorial@2d@eometr*@e1amples@ShapesDemo2D)(ava code
contains implementations o+ all the descri'edeometric primitives)
• #or more inormation a'out classes andmethods represented in this section see the
http4@@(ava)sun)com@(avase@@docs@api@(ava@awt@eom@packae&summar*)html speci.cation)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 37/57
"hat is an Afne TransormB
• The Ane Transform class represents a2D Afne transorm that perorms a linearmappin rom 2D coordinates to other 2D
coordinates that preserves thestraihtness and parallelness o lines)Afne transormations can 'e constructedusin se-uences o translations, scales,
;ips, rotations, and shears)
"h t i f T
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 38/57
"hat is afne Transorm /contd90
• An Ane Transform is a linear transorm, so thetransormation can 'e e1pressed in the matri1 notationo linear ale'ra) An ar'itrar* Ane Transform can'e mathematicall* e1pressed '* si1 num'ers in a
matri1 like this4 sx shx tx
shy sy ty• The symols or factors sx and sy are scale factors that
accomplish scaling! The factors tx and ty are scalefactors that accomplish translation! The factors shx
and shy are scale factors that accomplish shear!
"hat is afne Transorm
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 39/57
"hat is afne Transorm /contd90
• 8our raphics can 'e transormed in theollowin wa*s 'eore 'ein displa*ed
on the output device4Scalin
Translation
Shear
%otation
/rotation is a com'ination o scalin and shearin, sothere are not separate rx and ry num'ers) 0
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 40/57
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 41/57
Translation
Translation moves the oriin o thecoordinate s*stem in device space)
Another use o translation /incom'ination with scalin0 is to ;ip thedeault positive direction o the verticala1is so that increasin positive values o
up instead o down, which is the deault)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 42/57
Shear
• Jonathan Enudsen descri'es shear in his 'ookentitled Java 2D Graphics as4
FTake a stack o paper /like *ou miht place in
*our laser printer0 and draw a picture on theside o the stack) Then deorm the stack sothat the side o the stack on which *ou drewthe picture takes the orm o a paralleloram)e especiall* careul to keep the oppositesides parallel) Then look at *our picture) Itwill have 'een su'(ected to shear in onedimension)H
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 43/57
Afne Transorm class
• #u'li lass +**ine=rans*ormetends -'/etim#lements Clonea'le, Seriali4a'le
• The +**ine=rans*orm class represents a 2Dafne transorm that perorms a linearmappin rom 2D coordinates to other 2Dcoordinates that preserves the straihtnessand parallelness o lines) Afne
transormations can 'e constructed usinse-uences o translations, scales, ;ips,rotations, and shears)
Afne Transorms as matri1
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 44/57
Afne Transorms as matri1multiplications
• Such a coordinate transormation can 'erepresented '* a row '* column matri1 with animplied last row o < < 5 K) This matri1 transormssource coordinates /1, *0 into destinationcoordinates /1L, *L0 '* considerin them to 'e acolumn vector and multipl*in the coordinatevector '* the matri1 accordin to the ollowinprocess4
D E D m00 m01 m0$ D D m00 < m01 < m0$ D E 2 D m10 m11 m1$ D 2 D m10 < m11 < m1$
D 1 D 0 0 1 D 1 D 1
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 45/57
%otation
• %otation is eas* to visuali3e /'ut thecom'ination o rotation and shear can 'e ver*difcult to visuali3e0) To visuali3e rotation,
draw a picture on a piece o paper) Use asinle tack to attach it to a 'ulletin 'oard)
Then rotate the paper a ew derees aroundthe tack) 8ou will have rotated the picture
around the coordinates o the tack '* thespeci.ed num'er o derees)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 46/57
%otation in Java 2D
• Java 2D works the same wa*) In the process otransormin a raphic rom user space todevice space, *ou can cause it to 'e rotated '*
a speci.ed anle around a speci.ed coordinateposition)
• ?owever, in Java 2D, the anle must 'especi.ed in radians instead o derees) I *ouare unamiliar with the use o radian measure
to speci* an anle, (ust remem'er theollowin identit*4
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 47/57
%adiand and Derees
• !I radians M 5N< derees
• !I is the numeric value *ou learned a'out ineometr* class)
• !I has a value o )5O5PQ))))))))))) ?owever, *oudon>t have to remem'er the value o !I) It isavaila'le as a static .nal constant in the Math class) 8ou can access the value as Math.PI)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 48/57
Dividin !I %adians
• I this sounds conusin, *ou miht alsowant to remem'er the ollowin
identities4• !I@2 M Q< derees!I@O M OP derees!I@N M 22)P derees
!I@5 M 55)2P derees, etc)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 49/57
%otation direction
• !ositive anles o rotation proceed in aclockwise direction) This ma* 'e
'ackwards rom what *ou areaccustomed to in various science andenineerin endeavors where counter&clockwise rotation is oten thouht o as
the positive direction o rotation)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 50/57
Java #rame "orks & afne
• JavaLs A'stract "indow Toolkit /A"T0 providesa Graphics class with methods or drawinlines, ovals, rectanles, te1t, pol*ons, and
other shapes) A !anel, #rame, or other A"Tcomponent draws itsel usin the Graphicsinstance passed to its paint method) The GUIenvironment automaticall* calls this method
whenever the component needs redrawin)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 51/57
Java #rame "orks $ afne
• Sun added the Java 2D ramework on top othe oriinal A"T Graphics class, addin man*new eatures to the Java core A!I) 7ne
important Java2D eature is known as theafne transormation) It works '* transorminthe coordinate s*stem 'eore an* drawin isdone on the Graphics o'(ect)
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 52/57
J#rame e1ample
• To illustrate this, weLll skew the coordinateswith a shearin transormation and draw somete1t and raphics to see how it looks with and
without the transormation) #irst, letLs drawsome te1t, usin the deault coordinates, "eLlldo this in the paint method o a GFrame4
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 53/57
=1ample /pae 50
im#ort /aa.awt.Font;im#ort /aa.awt.ra#his;im#ort /aa.awt.ra#his$&;im#ort /aa.swing.GFrame; #u'li lass @=rans*orm etends GFrame 5
#u'li @=rans*orm(String title) 5
su#er(title);6 #u'li oid #aint(ra#his g) 5 ra#his$& g$d 2 (ra#his$&) g;
g$d.setFont(Font.deode("arial?'old?"));g$d.drawString("+**init", 100, 100);
g$d.draw-al(100, 10, , 0); g$d.draw-al(1, 10, , 0);
6
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 54/57
=1ample /pae 20
#u'li stati oid main(StringD args) 5 @=rans*orm a*t 2 new @=rans*orm("+**init");a*t.setSi4e(00,00);
a*t.set&e*aultClose-#eration(GFrame.>I=A-:AC%-S);
a*t.setisi'le(true);6
6
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 55/57
Java afne #rameworks
• In all afne transormations , the chanea+ects the entire coordinate s*stem and not
(ust individual o'(ects) "e call the methods to
appl* the transorms 'eore callin thedrawin methods) 6etLs displa* the a'ove te1twith a shearin transorm, This is a transormwhere lines are shited in a new direction 'utparallel lines still remain parallel) The call to
the shear method happens 'eore the drawinoccurs) ?ere is code to perorm the transorm4
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 56/57
odi.cations to =1ample
#u'li oid #aint(ra#his g) 5
ra#his$& g$d 2 (ra#his$&) g;
g$d.shear(0.,0.);
g$d.setFont(Font.deode("arial?'old?"));g$d.drawString("+**init", 100, 100);g$d.draw-al(100, 10, , 0);
g$d.draw-al(1, 10, , 0);6
8/9/2019 Affine Transforms
http://slidepdf.com/reader/full/affine-transforms 57/57
%eerences
http4@@(ava)sun)com@
http4@@www)developer)com@
http4@@www)particle)kth)se@htmlnew@