Question

In this part of the JRuby Swing tutorial, we will introduce the Swing toolkit and create our first programs using the JRuby programming language.

The purpose of this tutorial is to get you started with the Swing toolkit with the JRuby language. Images used in this tutorial can be downloaded here . I used some icons from the Tango icons pack of the Gnome project.

About

Swing library is an official Java GUI toolkit for the Java programming language. It is used to create Graphical user interfaces with Java. Swing is an advanced GUI toolkit. It has a rich set of components. From basic ones like buttons, labels, scrollbars to advanced components like trees and tables. Swing itself is written in Java. Swing is available for other languages too. For example JRuby, Jython, Groovy, or Scala.

JRuby is a Java implementation of the Ruby programming language. JRuby can import any Java class.

There are two basic ways to execute the examples in this tutorial. One way is to install a Ruby NetBeans plugin. It contains JRuby as well. When you create a new Ruby project, be sure to select the JRuby platform.

The other way is to download a release from the jruby.org website.

$ tar -xzvf jruby-bin-1.5.6.tar.gz
$ mv jruby-1.5.6/ ~/bin

Installing JRuby is very easy. We extract the contents of the compressed archive and move the directory to a selected location. On my system, I have moved the directory to the bin directory of my home directory.

$ ~/bin/jdk1.6.0_21/bin/java -jar ~/bin/jruby-1.5.6/lib/jruby.jar simple.rb

We have installed JRuby in a selected directory. In the lib subdirectory, we will find jruby.jar file, which is used to execute JRuby scripts.

$ cat /usr/local/bin/jruby 
#!/bin/bash

~/bin/jdk1.6.0_21/bin/java -jar ~/bin/jruby-1.5.6/lib/jruby.jar $1

Optionally, we can create a bash file which will automatically start our JRuby scripts. We can then put the #!/usr/local/bin/jruby path to our scripts.

Simple example

In our first example, we will show a basic window on the screen.

#!/usr/local/bin/jruby

# ZetCode JRuby Swing tutorial
# 
# This example shows a simple
# window in the center of the screen.
# 
# author: Jan Bodnar
# website: www.zetcode.com
# last modified: December 2010

include Java

import javax.swing.JFrame


class Example < JFrame
  
  def initialize
    super "Simple"
    
    self.initUI
  end
    
  def initUI
    
    self.setSize 300, 200
    self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE
    self.setLocationRelativeTo nil
    self.setVisible true
  end
end

Example.new

While this code is very small, the application window can do quite a lot. It can be resized, maximised, minimised. All the complexity that comes with it has been hidden from the application programmer.

include Java

We include Java API to JRuby.

import javax.swing.JFrame

We import a JFrame class. The JFrame is a top-level window with a titlebar and a border.

self.initUI

We delegate the creation of the user interface to the initUI method.

self.setSize 300, 200

We set the size of the window.

self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE

This method ensures that the window terminates if we click on the close button of the titlebar. By default nothing happens.

self.setLocationRelativeTo nil

We center the window on the screen.

self.setVisible true

Finally, the window is showed on the screen.

Tooltip

A tooltip is a small rectangular window, which gives a brief information about an object. It is usually a GUI component. It is part of the help system of the application.

#!/usr/local/bin/jruby

# ZetCode JRuby Swing tutorial
# 
# This code shows a tooltip on
# a window and a button
# 
# author: Jan Bodnar
# website: www.zetcode.com
# last modified: December 2010

include Java

import javax.swing.JButton
import javax.swing.JFrame
import javax.swing.JPanel


class Example < JFrame
  
  def initialize
    super "Tooltips"
    
    self.initUI
  end
    
  def initUI
    
    panel = JPanel.new
    self.getContentPane.add panel

    panel.setLayout nil 
    panel.setToolTipText "A Panel container"

    button = JButton.new "Button"
    button.setBounds 100, 60, 100, 30
    button.setToolTipText "A button component"

    panel.add button
    
    self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE
    self.setSize 300, 200
    self.setLocationRelativeTo nil
    self.setVisible true
  end
  
end

Example.new

In the example, we set the tooltip for the frame and the button.

panel = JPanel.new
self.getContentPane.add panel

We create a JPanel component. It is a generic lightweight container. JFrame has an area, where you put the components called the content pane. We put the panel into this pane.

panel.setLayout nil 

By default, the JPanel has a FlowLayout manager. The layout manager is used to place widgets onto the containers. If we call setLayout nil we can position our components absolutely. For this, we use the setBounds method.

panel.setToolTipText "A Panel container"

To enable a tooltip, we call the setTooltipText method.

Figure: Tooltip

Quit button

In the last example of this section, we will create a quit button. When we press this button, the application terminates.

#!/usr/local/bin/jruby

# ZetCode JRuby Swing tutorial
#
# This program creates a quit
# button. When we press the button,
# the application terminates. 
#
# author: Jan Bodnar
# website: www.zetcode.com
# last modified: December 2010

include Java

import javax.swing.JButton
import javax.swing.JFrame
import javax.swing.JPanel
import java.lang.System


class Example < JFrame
  
  def initialize
    super "Quit button"
    
    self.initUI
  end
    
  def initUI
    
    panel = JPanel.new
    self.getContentPane.add panel

    panel.setLayout nil

    qbutton = JButton.new "Quit"
    qbutton.setBounds 50, 60, 80, 30
    qbutton.add_action_listener do |e|
      System.exit 0
    end
    
    panel.add qbutton  
    
    self.setDefaultCloseOperation JFrame::EXIT_ON_CLOSE
    self.setSize 300, 200
    self.setLocationRelativeTo nil
    self.setVisible true
  end
  
end

Example.new

We position a JButton on the window. We will add an action listener to this button.

qbutton = JButton.new "Quit"
qbutton.setBounds 50, 60, 80, 30

Here we create a button. We position it by calling the setBounds method.

qbutton.add_action_listener do |e|
  System.exit 0
end

We add an action listener to the button. The listener terminates the application.

Figure: Quit button

This section was an introduction to the Swing toolkit with the JRuby language.