# 在 JRuby Swing 中繪圖 > 原文： [http://zetcode.com/gui/jrubyswing/painting/](http://zetcode.com/gui/jrubyswing/painting/) 在 JRuby Swing 編程教程的這一部分中，我們將進行繪圖。 我們使用繪圖來創建圖表，自定義組件或創建游戲。 要進行繪圖，我們使用 Swing 工具包提供的繪圖 API。 繪圖是在`paintComponent`方法中完成的。 在繪圖過程中，我們使用`Graphics2D`對象。 它是一個圖形上下文，允許應用繪制到組件上。 它是渲染二維形狀，文本和圖像的基礎類。 ## 色彩 顏色是代表紅色，綠色和藍色（RGB）強度值的組合的對象。 我們使用`Color`類在 Swing 中處理顏色。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # In this example we draw nine rectangles # filled with nine different colors. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Color import javax.swing.JFrame import javax.swing.JPanel class Canvas < JPanel def paintComponent g self.drawColorRectangles g end def drawColorRectangles g g.setColor Color.new 125, 167, 116 g.fillRect 10, 15, 90, 60 g.setColor Color.new 42, 179, 231 g.fillRect 130, 15, 90, 60 g.setColor Color.new 70, 67, 123 g.fillRect 250, 15, 90, 60 g.setColor Color.new 130, 100, 84 g.fillRect 10, 105, 90, 60 g.setColor Color.new 252, 211, 61 g.fillRect 130, 105, 90, 60 g.setColor Color.new 241, 98, 69 g.fillRect 250, 105, 90, 60 g.setColor Color.new 217, 146, 54 g.fillRect 10, 195, 90, 60 g.setColor Color.new 63, 121, 186 g.fillRect 130, 195, 90, 60 g.setColor Color.new 31, 21, 1 g.fillRect 250, 195, 90, 60 end end class Example < JFrame def initialize super "Colors" self.initUI end def initUI canvas = Canvas.new self.getContentPane.add canvas self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 360, 300 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 在代碼示例中，我們繪制了九個矩形，并用不同的顏色值填充它們。 ```rb def paintComponent g ``` 在大多數情況下，自定義繪圖是在`paintComponent`中完成的。 `g`參數是圖形上下文。 我們稱此對象為繪圖操作。 ```rb g.setColor Color.new 125, 167, 116 ``` 我們將上下文的當前顏色設置為指定的顏色。 使用此圖形上下文的所有后續圖形操作均使用此指定的顏色。 ```rb g.fillRect 10, 15, 90, 60 ``` 我們使用上面指定的顏色值填充位于`x = 10`，`y = 15`且寬度`= 90`和高度`= 60`的矩形。  圖：顏色 ## 形狀 Swing 繪圖 API 可以繪制各種形狀。 以下編程代碼示例將顯示其中的一些。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # This example draws simple shapes # on a panel. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Color import java.awt.RenderingHints import java.awt.geom.Ellipse2D import javax.swing.JFrame import javax.swing.JPanel class Canvas < JPanel def paintComponent g self.drawShapes g end def drawShapes g g.setColor Color.new 150, 150, 150 rh = RenderingHints.new RenderingHints::KEY_ANTIALIASING, RenderingHints::VALUE_ANTIALIAS_ON rh.put RenderingHints::KEY_RENDERING, RenderingHints::VALUE_RENDER_QUALITY g.setRenderingHints rh g.fillRect 20, 20, 50, 50 g.fillRect 120, 20, 90, 60 g.fillRoundRect 250, 20, 70, 60, 25, 25 g.fill Ellipse2D::Double.new 10, 100, 80, 100 g.fillArc 120, 130, 110, 100, 5, 150 g.fillOval 270, 130, 50, 50 end end class Example < JFrame def initialize super "Shapes" self.initUI end def initUI canvas = Canvas.new self.getContentPane.add canvas self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 350, 250 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 在此代碼示例中，我們在窗口上繪制了六個不同的形狀。 正方形，矩形，圓角矩形，橢圓形，弧形和橢圓形。 我們不會繪制形狀的輪廓，但是會用灰色填充形狀的內部空間。 ```rb rh = RenderingHints.new RenderingHints::KEY_ANTIALIASING, RenderingHints::VALUE_ANTIALIAS_ON ``` 借助渲染提示，我們可以控制繪圖的質量。 在上面的代碼中，我們實現了抗鋸齒。 使用抗鋸齒，形狀更平滑。 ```rb g.setColor Color.new 150, 150, 150 ``` 我們將以某種灰色繪圖。 ```rb g.fillRect 20, 20, 50, 50 g.fillRect 120, 20, 90, 60 g.fillRoundRect 250, 20, 70, 60, 25, 25 ``` 在這里，我們繪制一個矩形，一個正方形和一個圓角矩形。 這些方法中的前四個參數是 x，y 坐標以及寬度和高度。 `fillRoundRect`的最后兩個參數是四個角處圓弧的水平和垂直直徑。 ```rb g.fill Ellipse2D::Double.new 10, 100, 80, 100 g.fillArc 120, 130, 110, 100, 5, 150 g.fillOval 270, 130, 50, 50 ``` 這三條線繪制一個橢圓，一個弧形和一個橢圓形。  圖：形狀 ## 透明矩形 透明性是指能夠透視材料的質量。 了解透明度的最簡單方法是想象一塊玻璃或水。 從技術上講，光線可以穿過玻璃，這樣我們就可以看到玻璃后面的物體。 在計算機圖形學中，我們可以使用 alpha 合成來實現透明效果。 Alpha 合成是將圖像與背景組合以創建部分透明外觀的過程。 合成過程使用 Alpha 通道。 （wikipedia.org，answers.com） ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # This program draws ten # rectangles with different # levels of transparency. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Color import java.awt.AlphaComposite import javax.swing.JFrame import javax.swing.JPanel class Canvas < JPanel def paintComponent g g.setColor Color::BLUE for i in 1..10 do g.setComposite AlphaComposite.getInstance AlphaComposite::SRC_OVER, i * 0.1 g.fillRect 50 * i, 20, 40, 40 end end end class Example < JFrame def initialize super "Transparent rectangles" self.initUI end def initUI canvas = Canvas.new self.getContentPane.add canvas self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 590, 120 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 在示例中，我們將繪制十個具有不同透明度級別的矩形。 ```rb g.setComposite AlphaComposite.getInstance AlphaComposite::SRC_OVER, i * 0.1 ``` `AlphaComposite`類實現基本的 alpha 合成規則。  圖：透明矩形 ## 甜甜圈形狀 在下面的示例中，我們通過旋轉一堆橢圓來創建復雜的形狀。 仿射變換由零個或多個線性變換（旋轉，縮放或剪切）和平移（移位）組成。 `AffineTransform`是 Swing 中用于執行仿射變換的類。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # In this code example, we create # a Donut shape. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.BasicStroke import java.awt.Color import java.awt.RenderingHints import java.awt.geom.AffineTransform import java.awt.geom.Ellipse2D import javax.swing.JFrame import javax.swing.JPanel class Canvas < JPanel def paintComponent g self.drawDonut g end def drawDonut g rh = RenderingHints.new RenderingHints::KEY_ANTIALIASING, RenderingHints::VALUE_ANTIALIAS_ON rh.put RenderingHints::KEY_RENDERING, RenderingHints::VALUE_RENDER_QUALITY g.setRenderingHints rh size = self.getSize w = size.getWidth h = size.getHeight e = Ellipse2D::Double.new 0, 0, 80, 130 g.setStroke BasicStroke.new 1 g.setColor Color.gray deg = 0 72.times do at = AffineTransform.getTranslateInstance w / 2, h / 2 at.rotate deg/180.0 * Math::PI g.draw at.createTransformedShape e deg += 5 end end end class Example < JFrame def initialize super "Donut" self.initUI end def initUI canvas = Canvas.new self.getContentPane.add canvas self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 350, 320 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 在此示例中，我們創建一個甜甜圈。 形狀類似于曲奇，因此得名“甜甜圈”。 甜甜圈在窗口中居中。 ```rb size = self.getSize w = size.getWidth h = size.getHeight ``` 在這里，我們確定窗口的寬度和高度。 我們需要這些值來使甜甜圈形狀居中。 ```rb e = Ellipse2D::Double.new 0, 0, 80, 130 ``` 我們創建一個橢圓形。 我們將旋轉此橢圓以創建甜甜圈形狀。 ```rb g.setStroke BasicStroke.new 1 g.setColor Color.gray ``` 我們為形狀的輪廓設置筆觸和顏色。 ```rb deg = 0 72.times do ``` 我們繪制一個橢圓對象 72 次。 每次，我們再將橢圓旋轉 5 度。 這將創建我們的甜甜圈形狀。 ```rb at = AffineTransform.getTranslateInstance w / 2, h / 2 at.rotate deg/180.0 * Math::PI g.draw at.createTransformedShape e ``` 在`AffineTransform`類的幫助下，我們將圖形轉換到窗口的中心。 然后我們進行旋轉。 `createTransformedShape`方法會將這些仿射變換應用于橢圓。 然后使用`draw`方法繪制變換后的橢圓。 `rotate`方法以弧度表示角度，因此我們以度為單位計算弧度。 ## 繪制文字 在最后一個示例中，我們將在窗口上繪制文本。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # In this example we draw lyrics of a # song on the window panel. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Color import java.awt.Font import java.awt.RenderingHints import java.awt.geom.Ellipse2D import javax.swing.JFrame import javax.swing.JPanel class Canvas < JPanel def paintComponent g self.drawLyrics g end def drawLyrics g rh = RenderingHints.new RenderingHints::KEY_ANTIALIASING, RenderingHints::VALUE_ANTIALIAS_ON rh.put RenderingHints::KEY_RENDERING, RenderingHints::VALUE_RENDER_QUALITY g.setRenderingHints rh g.setFont Font.new "Purisa", Font::PLAIN, 13 g.drawString "Most relationships seem so transitory", 20, 30 g.drawString "They're all good but not the permanent one", 20, 60 g.drawString "Who doesn't long for someone to hold", 20, 90 g.drawString "Who knows how to love you without being told", 20, 120 g.drawString "Somebody tell me why I'm on my own", 20, 150 g.drawString "If there's a soulmate for everyone", 20, 180 end end class Example < JFrame def initialize super "Soulmate" initUI end def initUI canvas = Canvas.new self.getContentPane.add canvas self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 400, 250 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 我們在窗口上畫一首歌的歌詞。 ```rb rh = RenderingHints.new RenderingHints::KEY_TEXT_ANTIALIASING, RenderingHints::VALUE_TEXT_ANTIALIAS_ON g.setRenderingHints rh ``` 我們在畫上應用文字抗鋸齒。 ```rb g.setFont Font.new "Purisa", Font::PLAIN, 13 ``` 我們指定字體名稱，樣式和磅值，并在其中繪制歌詞。 ```rb g.drawString "Most relationships seem so transitory", 20, 30 ``` `drawString`方法繪制文本。  圖：繪制文本 在 JRuby Swing 編程教程的這一部分中，我們做了一些繪圖。