# JRuby Swing 中的布局管理 > 原文： [http://zetcode.com/gui/jrubyswing/layout/](http://zetcode.com/gui/jrubyswing/layout/) 在 JRuby Swing 編程教程的這一部分中，我們將介紹布局管理器。 在設計應用的 GUI 時，我們決定要使用哪些組件以及如何在應用中組織這些組件。 為了組織我們的組件，我們使用專門的不可見對象，稱為布局管理器。 Swing 工具箱包含兩種組件。 容器和子項。 容器將子項分組為合適的布局。 要創建布局，我們使用布局管理器。 ## 絕對定位 在大多數情況下，程序員應使用布局管理器。 在某些情況下，我們可以使用絕對定位。 在絕對定位中，程序員以像素為單位指定每個組件的位置和大小。 如果調整窗口大小，則組件的大小和位置不會更改。 在各種平臺上，應用看起來都不同，在 Linux 上看起來不錯，在 Mac OS 上看起來不太正常。 在應用中更改字體可能會破壞布局。 如果將應用翻譯成另一種語言，則必須重做布局。 對于所有這些問題，僅在有理由時才使用絕對定位。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # In this program, we lay out three images # using absolute positioning. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Color import javax.swing.ImageIcon import javax.swing.JLabel import javax.swing.JPanel import javax.swing.JFrame class Example < JFrame def initialize super "Absolute" self.initUI end def initUI panel = JPanel.new panel.setLayout nil panel.setBackground Color.new 66, 66, 66 self.getContentPane.add panel rot = ImageIcon.new "rotunda.jpg" rotLabel = JLabel.new rot rotLabel.setBounds 20, 20, rot.getIconWidth, rot.getIconHeight min = ImageIcon.new "mincol.jpg" minLabel = JLabel.new min minLabel.setBounds 40, 160, min.getIconWidth, min.getIconHeight bar = ImageIcon.new "bardejov.jpg" barLabel = JLabel.new bar barLabel.setBounds 170, 50, bar.getIconWidth, bar.getIconHeight panel.add rotLabel panel.add minLabel panel.add barLabel self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 350, 300 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 在此示例中，我們使用絕對定位顯示了三幅圖像。 ```rb panel.setLayout nil ``` Swing 中的容器已經具有默認的布局管理器。 `JPanel`具有`FlowLayout`管理器作為其默認布局管理器。 我們將`setLayout`方法與`nil`參數一起使用，以刪除默認的布局管理器，而改用絕對定位。 ```rb rot = ImageIcon.new "rotunda.jpg" rotLabel = JLabel.new rot rotLabel.setBounds 20, 20, rot.getIconWidth, rot.getIconHeight ``` 我們創建一個`ImageIcon`對象。 我們將圖標放入`JLabel`組件中以顯示它。 然后，我們使用`setBounds`方法將標簽放置在面板上。 前兩個參數是標簽的 x，y 位置。 第 3 和第 4 個參數是圖標的寬度和高度。 ```rb panel.add rotLabel ``` 我們將標簽添加到面板容器中。  圖：絕對定位 ## 按鈕示例 在下面的示例中，我們將在窗口的右下角放置兩個按鈕。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # In this program, we use the BoxLayout # manager to position two buttons in the # bottom right corner of the window. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Dimension import javax.swing.JButton import javax.swing.JPanel import javax.swing.JFrame import javax.swing.BoxLayout import javax.swing.Box class Example < JFrame def initialize super "Buttons" self.initUI end def initUI basic = JPanel.new basic.setLayout BoxLayout.new basic, BoxLayout::Y_AXIS self.add basic basic.add Box.createVerticalGlue bottom = JPanel.new bottom.setLayout BoxLayout.new bottom, BoxLayout::X_AXIS bottom.setAlignmentX 1.0 okButton = JButton.new "OK" closeButton = JButton.new "Close" bottom.add okButton bottom.add Box.createRigidArea Dimension.new 5, 0 bottom.add closeButton bottom.add Box.createRigidArea Dimension.new 15, 0 basic.add bottom basic.add Box.createRigidArea Dimension.new 0, 15 self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setSize 300, 200 self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 我們將創建兩個面板。 基本面板具有垂直框布局。 底部面板有一個水平面板。 我們將在基礎面板中放置一個底部面板。 我們將右對齊底部面板。 窗口頂部和底部面板之間的空間是可擴展的。 這是通過垂直膠水完成的。 ```rb basic = JPanel.new basic.setLayout BoxLayout.new basic, BoxLayout::Y_AXIS ... bottom = JPanel.new bottom.setLayout BoxLayout.new bottom, BoxLayout::X_AXIS ``` 基本面板具有垂直框布局。 底部面板具有水平框布局。 ```rb bottom.setAlignmentX 1.0 ``` 底部面板右對齊。 ```rb basic.add Box.createVerticalGlue ``` 我們創建一個垂直膠水。 膠水是垂直可擴展的白色空間，它將帶有按鈕的水平框推到底部。 ```rb okButton = JButton.new "OK" closeButton = JButton.new "Close" ``` 這是兩個將進入窗口右下角的按鈕。 ```rb bottom.add okButton bottom.add Box.createRigidArea Dimension.new 5, 0 ``` 我們將“確定”按鈕放入水平框中。 我們在按鈕旁邊放置了一些剛性空間。 這樣兩個按鈕之間會有一些空間。 ```rb basic.add Box.createRigidArea Dimension.new 0, 15 ``` 我們在按鈕和窗口的邊框之間留出一些空間。  圖：按鈕示例 ## Windows 示例 以下示例使用`GroupLayout`管理器創建 Windows 對話框。 該對話框來自 JDeveloper 應用。 `GroupLayout`管理器將布局的創建分為兩個步驟。 第一步，我們沿著水平軸布置組件。 在第二步中，我們沿垂直軸布置組件。 這在布局管理器中是一個不尋常的想法，但效果很好。 有兩種類型的安排：順序安排和并行安排。 在兩種布局中，我們都可以順序或并行排列組件。 在水平布局中，一行組件稱為順序組。 一列組件稱為并行組。 在垂直布局中，一列組件稱為順序組。 一排組件稱為并行組。 您必須正確理解這些定義才能與`GroupLayout`管理器一起使用。 ```rb #!/usr/local/bin/jruby # ZetCode JRuby Swing tutorial # # In this program, GroupLayout # manager to create a Windows # example. # # author: Jan Bodnar # website: www.zetcode.com # last modified: December 2010 include Java import java.awt.Dimension import java.awt.Color import javax.swing.JButton import javax.swing.SwingConstants import javax.swing.JFrame import javax.swing.JLabel import javax.swing.JTextArea import javax.swing.BorderFactory import javax.swing.GroupLayout class Example < JFrame def initialize super "Windows" self.initUI end def initUI layout = GroupLayout.new self.getContentPane self.getContentPane.setLayout layout layout.setAutoCreateGaps true layout.setAutoCreateContainerGaps true self.setPreferredSize Dimension.new 350, 300 windows = JLabel.new "Windows" area = JTextArea.new area.setEditable false area.setBorder BorderFactory.createLineBorder Color.gray activateButton = JButton.new "Activate" closeButton = JButton.new "Close" helpButton = JButton.new "Help" okButton = JButton.new "OK" sg = layout.createSequentialGroup pg1 = layout.createParallelGroup pg2 = layout.createParallelGroup pg1.addComponent windows pg1.addComponent area pg1.addComponent helpButton sg.addGroup pg1 pg2.addComponent activateButton pg2.addComponent closeButton pg2.addComponent okButton sg.addGroup pg2 layout.setHorizontalGroup sg sg1 = layout.createSequentialGroup sg2 = layout.createSequentialGroup pg1 = layout.createParallelGroup pg2 = layout.createParallelGroup sg1.addComponent windows pg1.addComponent area sg2.addComponent activateButton sg2.addComponent closeButton pg1.addGroup sg2 sg1.addGroup pg1 pg2.addComponent helpButton pg2.addComponent okButton sg1.addGroup pg2 layout.setVerticalGroup sg1 layout.linkSize SwingConstants::HORIZONTAL, okButton, helpButton, closeButton, activateButton self.pack self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE self.setLocationRelativeTo nil self.setVisible true end end Example.new ``` 我們使用`GroupLayout`管理器創建由六個組件組成的布局。 組件組沿兩個軸形成。 ```rb sg = layout.createSequentialGroup pg1 = layout.createParallelGroup pg2 = layout.createParallelGroup pg1.addComponent windows pg1.addComponent area pg1.addComponent helpButton sg.addGroup pg1 pg2.addComponent activateButton pg2.addComponent closeButton pg2.addComponent okButton sg.addGroup pg2 layout.setHorizontalGroup sg ``` 第一步，我們有一個水平布局。 它由兩組平行的三個部分組成。 ```rb sg1 = layout.createSequentialGroup sg2 = layout.createSequentialGroup pg1 = layout.createParallelGroup pg2 = layout.createParallelGroup sg1.addComponent windows pg1.addComponent area sg2.addComponent activateButton sg2.addComponent closeButton pg1.addGroup sg2 sg1.addGroup pg1 pg2.addComponent helpButton pg2.addComponent okButton sg1.addGroup pg2 layout.setVerticalGroup sg1 ``` 垂直布局有點復雜。 首先，我們添加一個組件。 然后，我們添加一個包含單個組件的并行組和一個包含兩個組件的順序組。 最后，我們添加兩個組件的并行組。 ```rb layout.linkSize SwingConstants::HORIZONTAL, okButton, helpButton, closeButton, activateButton ``` 此代碼使所有按鈕的大小相同。 我們只需要設置它們的寬度，因為默認情況下它們的高度已經相同。  圖：窗口示例 查看示例的屏幕截圖。 注意，可以將組件分為垂直和水平組件集。 例如，標簽，區域和“幫助”按鈕組件可以形成垂直的組件組。 這正是`GroupLayout`管理器所做的。 它通過形成組件的垂直和水平組來布局組件。 在 JRuby Swing 教程的這一部分中，我們提到了組件的布局管理。