- GUI
- Windows API tutorial
- Introduction to Windows API
- Windows API main functions
- System functions in Windows API
- Strings in Windows API
- Date & time in Windows API
- A window in Windows API
- First steps in UI
- Windows API menus
- Windows API dialogs
- Windows API controls I
- Windows API controls II
- Windows API controls III
- Advanced controls in Windows API
- Custom controls in Windows API
- The GDI in Windows API
- PyQt4 tutorial
- PyQt5 tutorial
- Qt4 tutorial
- Introduction to Qt4 toolkit
- Qt4 utility classes
- Strings in Qt4
- Date and time in Qt4
- Working with files and directories in Qt4
- First programs in Qt4
- Menus and toolbars in Qt4
- Layout management in Qt4
- Events and signals in Qt4
- Qt4 Widgets
- Qt4 Widgets II
- Painting in Qt4
- Custom widget in Qt4
- The Breakout game in Qt4
- Qt5 tutorial
- Introduction to Qt5 toolkit
- Strings in Qt5
- Date and time in Qt5
- Containers in Qt5
- Working with files and directories in Qt5
- First programs in Qt5
- Menus and toolbars in Qt5
- Layout management in Qt5
- Events and signals in Qt5
- Qt5 Widgets
- Qt5 Widgets II
- Painting in Qt5
- Custom widget in Qt5
- Snake in Qt5
- The Breakout game in Qt5
- PySide tutorial
- Tkinter tutorial
- Tcl/Tk tutorial
- Qt Quick tutorial
- Java Swing tutorial
- JavaFX tutorial
- Java SWT tutorial
- wxWidgets tutorial
- Introduction to wxWidgets
- wxWidgets helper classes
- First programs in wxWidgets
- Menus and toolbars in wxWidgets
- Layout management in wxWidgets
- Events in wxWidgets
- Dialogs in wxWidgets
- wxWidgets widgets
- wxWidgets widgets II
- Drag and Drop in wxWidgets
- Device Contexts in wxWidgets
- Custom widgets in wxWidgets
- The Tetris game in wxWidgets
- wxPython tutorial
- Introduction to wxPython
- First Steps
- Menus and toolbars
- Layout management in wxPython
- Events in wxPython
- wxPython dialogs
- Widgets
- Advanced widgets in wxPython
- Drag and drop in wxPython
- Internationalisation
- Application skeletons in wxPython
- The GDI
- Mapping modes
- Creating custom widgets
- Tips and Tricks
- wxPython Gripts
- The Tetris game in wxPython
- C# Winforms Mono tutorial
- Java Gnome tutorial
- Introduction to Java Gnome
- First steps in Java Gnome
- Layout management in Java Gnome
- Layout management II in Java Gnome
- Menus in Java Gnome
- Toolbars in Java Gnome
- Events in Java Gnome
- Widgets in Java Gnome
- Widgets II in Java Gnome
- Advanced widgets in Java Gnome
- Dialogs in Java Gnome
- Pango in Java Gnome
- Drawing with Cairo in Java Gnome
- Drawing with Cairo II
- Nibbles in Java Gnome
- QtJambi tutorial
- GTK+ tutorial
- Ruby GTK tutorial
- GTK# tutorial
- Visual Basic GTK# tutorial
- PyGTK tutorial
- Introduction to PyGTK
- First steps in PyGTK
- Layout management in PyGTK
- Menus in PyGTK
- Toolbars in PyGTK
- Signals & events in PyGTK
- Widgets in PyGTK
- Widgets II in PyGTK
- Advanced widgets in PyGTK
- Dialogs in PyGTK
- Pango
- Pango II
- Drawing with Cairo in PyGTK
- Drawing with Cairo II
- Snake game in PyGTK
- Custom widget in PyGTK
- PHP GTK tutorial
- C# Qyoto tutorial
- Ruby Qt tutorial
- Visual Basic Qyoto tutorial
- Mono IronPython Winforms tutorial
- Introduction
- First steps in IronPython Mono Winforms
- Layout management
- Menus and toolbars
- Basic Controls in Mono Winforms
- Basic Controls II in Mono Winforms
- Advanced Controls in Mono Winforms
- Dialogs
- Drag & drop in Mono Winforms
- Painting
- Painting II in IronPython Mono Winforms
- Snake in IronPython Mono Winforms
- The Tetris game in IronPython Mono Winforms
- FreeBASIC GTK tutorial
- Jython Swing tutorial
- JRuby Swing tutorial
- Visual Basic Winforms tutorial
- JavaScript GTK tutorial
- Ruby HTTPClient tutorial
- Ruby Faraday tutorial
- Ruby Net::HTTP tutorial
- Java 2D games tutorial
- Java 2D tutorial
- Cairo graphics tutorial
- PyCairo tutorial
- HTML5 canvas tutorial
- Python tutorial
- Python language
- Interactive Python
- Python lexical structure
- Python data types
- Strings in Python
- Python lists
- Python dictionaries
- Python operators
- Keywords in Python
- Functions in Python
- Files in Python
- Object-oriented programming in Python
- Modules
- Packages in Python
- Exceptions in Python
- Iterators and Generators
- Introspection in Python
- Ruby tutorial
- PHP tutorial
- Visual Basic tutorial
- Visual Basic
- Visual Basic lexical structure
- Basics
- Visual Basic data types
- Strings in Visual Basic
- Operators
- Flow control
- Visual Basic arrays
- Procedures & functions in Visual Basic
- Organizing code in Visual Basic
- Object-oriented programming
- Object-oriented programming II in Visual Basic
- Collections in Visual Basic
- Input & output
- Tcl tutorial
- C# tutorial
- Java tutorial
- AWK tutorial
- Jetty tutorial
- Tomcat Derby tutorial
- Jtwig tutorial
- Android tutorial
- Introduction to Android development
- First Android application
- Android Button widgets
- Android Intents
- Layout management in Android
- Android Spinner widget
- SeekBar widget
- Android ProgressBar widget
- Android ListView widget
- Android Pickers
- Android menus
- Dialogs
- Drawing in Android
- Java EE 5 tutorials
- Introduction
- Installing Java
- Installing NetBeans 6
- Java Application Servers
- Resin CGIServlet
- JavaServer Pages, (JSPs)
- Implicit objects in JSPs
- Shopping cart
- JSP & MySQL Database
- Java Servlets
- Sending email in a Servlet
- Creating a captcha in a Servlet
- DataSource & DriverManager
- Java Beans
- Custom JSP tags
- Object relational mapping with iBATIS
- Jsoup tutorial
- MySQL tutorial
- MySQL quick tutorial
- MySQL storage engines
- MySQL data types
- Creating, altering and dropping tables in MySQL
- MySQL expressions
- Inserting, updating, and deleting data in MySQL
- The SELECT statement in MySQL
- MySQL subqueries
- MySQL constraints
- Exporting and importing data in MySQL
- Joining tables in MySQL
- MySQL functions
- Views in MySQL
- Transactions in MySQL
- MySQL stored routines
- MySQL Python tutorial
- MySQL Perl tutorial
- MySQL C API programming tutorial
- MySQL Visual Basic tutorial
- MySQL PHP tutorial
- MySQL Java tutorial
- MySQL Ruby tutorial
- MySQL C# tutorial
- SQLite tutorial
- SQLite C tutorial
- SQLite PHP tutorial
- SQLite Python tutorial
- SQLite Perl tutorial
- SQLite Ruby tutorial
- SQLite C# tutorial
- SQLite Visual Basic tutorial
- PostgreSQL C tutorial
- PostgreSQL Python tutorial
- PostgreSQL Ruby tutorial
- PostgreSQL PHP tutorial
- PostgreSQL Java tutorial
- Apache Derby tutorial
- SQLAlchemy tutorial
- MongoDB PHP tutorial
- MongoDB Java tutorial
- MongoDB JavaScript tutorial
- MongoDB Ruby tutorial
- Spring JdbcTemplate tutorial
- JDBI tutorial
Layout management in JRuby Swing
In this part of the JRuby Swing programming tutorial, we will introduce layout managers.
When we design the GUI of our application, we decide what components we will use and how we will organise those components in the application. To organise our components, we use specialised non visible objects called layout managers. The Swing toolkit has two kind of components. Containers and children. The containers group children into suitable layouts. To create layouts, we use layout managers.
Absolute positioning
In most cases, programmers should use layout managers. There are a few situations, where we can use absolute positioning. In absolute positioning, the programmer specifies the position and the size of each component in pixels. The size and the position of a component do not change if you resize a window. Applications look different on various platforms, and what looks OK on Linux, might not look OK on Mac OS. Changing fonts in your application might spoil the layout. If you translate your application into another language, you must redo your layout. For all these issues, use the absolute positioning only when you have a reason to do so.
#!/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
In this example, we show three images using absolute positioning.
panel.setLayout nil
Containers in Swing already have a default layout manager. JPanel
has a FlowLayout
manager as its default layout manager. We use the setLayout
method with a nil
parameter to remove the default layout manager and use absolute positioning instead.
rot = ImageIcon.new "rotunda.jpg" rotLabel = JLabel.new rot rotLabel.setBounds 20, 20, rot.getIconWidth, rot.getIconHeight
We create an ImageIcon
object. We put the icon into the JLabel
component to display it. Then we use the setBounds
method to position the label on the panel. The first two parameters are the x, y positions of the label. The 3th and 4th parameters are the width and the height of the icon.
panel.add rotLabel
We add the label to the panel container.

Buttons example
In the following example, we will position two buttons in the bottom right corner of the window.
#!/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
We will create two panels. The basic panel has a vertical box layout. The bottom panel has a horizontal one. We will put a bottom panel into the basic panel. We will right align the bottom panel. The space between the top of the window and the bottom panel is expandable. It is done by the vertical glue.
basic = JPanel.new basic.setLayout BoxLayout.new basic, BoxLayout::Y_AXIS ... bottom = JPanel.new bottom.setLayout BoxLayout.new bottom, BoxLayout::X_AXIS
The basic panel has a vertical box layout. The bottom panel has a horizontal box layout.
bottom.setAlignmentX 1.0
The bottom panel is right aligned.
basic.add Box.createVerticalGlue
We create a vertical glue. The glue is vertically expandable white space, which will push the horizontal box with the buttons to the bottom.
okButton = JButton.new "OK" closeButton = JButton.new "Close"
These are the two buttons that will go into the bottom right corner of the window.
bottom.add okButton bottom.add Box.createRigidArea Dimension.new 5, 0
We put the OK button into the horizontal box. We put some rigid space next to the button. So that there is some space between the two buttons.
basic.add Box.createRigidArea Dimension.new 0, 15
We put some space between the buttons and the border of the window.

Windows example
The following example creates the windows dialog using the GroupLayout
manager. The dialog comes from the JDeveloper application.
The GroupLayout
manager divides the creation of the layout into two steps. In one step, we lay out components alongside the horizontal axis. In the second step, we lay out components along the vertical axis. This is an unusual idea within layout managers, but it works well.
There are two types of arrangements: sequential and parallel. In both kinds of layouts we can arrange components sequentially or in parallel. In a horizontal layout, a row of components is called a sequential group. A column of components is called a parallel group. In a vertical layout, a column of components is called a sequential group. And a row of components is called a parallel group. You must understand these definitions right in order to work with the GroupLayout
manager.
#!/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
We use GroupLayout
manager to create a layout which consists of six components. Groups of components are formed along both axes.
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
In the first step, we have a horizontal layout. It consists of two parallel groups of three components.
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
Vertical layout is a bit more complex. First, we add a single component. Then we add a parallel group of a single component and a sequential group of two components. Finally, we add a parallel group of two components.
layout.linkSize SwingConstants::HORIZONTAL, okButton, helpButton, closeButton, activateButton
This code makes all buttons the same size. We only need to set their width, because their height is already the same by default.

Look at the screenshot of the example. Notice that components can be grouped into vertical and horizontal sets of components. For example, the label, the area and the Help button components can form a vertical group of components. This is exactly what the GroupLayout
manager does. It lays out components by forming vertical and horizontal groups of components.
In this part of the JRuby Swing tutorial, we mentioned layout management of components.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论