Home  Contents

Dialogs

In this part of the Ruby GTK programming tutorial, we will introduce dialogs.

Dialog windows or dialogs are an indispensable part of most modern GUI applications. A dialog is defined as a conversation between two or more persons. In a computer application a dialog is a window which is used to "talk" to the application. A dialog is used to input data, modify data, change the application settings etc. Dialogs are important means of communication between a user and a computer program.

Message boxes

Message dialogs are convenient dialogs that provide messages to the user of the application. The message consists of textual and image data.

#!/usr/bin/ruby

# ZetCode Ruby GTK tutorial
#
# This example shows message
# dialogs
#
# author: jan bodnar
# website: www.zetcode.com
# last modified: June 2009

require 'gtk2'


class RubyApp < Gtk::Window

    def initialize
        super
    
        set_title "Messages"
        signal_connect "destroy" do 
            Gtk.main_quit 
        end
        
        init_ui

        set_default_size 250, 100
        set_window_position Gtk::Window::POS_CENTER
        
        show_all
    end
    
    def init_ui
    
        table = Gtk::Table.new 2, 2, true
        
        info = Gtk::Button.new "Information"
        warn = Gtk::Button.new "Warning"
        ques = Gtk::Button.new "Question"
        erro = Gtk::Button.new "Error" 

        info.signal_connect "clicked" do
            on_info
        end    
        
        warn.signal_connect "clicked" do
            on_warn
        end
        
        ques.signal_connect "clicked" do
            on_ques
        end
        
        erro.signal_connect "clicked" do
            on_erro
        end
        
        table.attach info, 0, 1, 0, 1
        table.attach warn, 1, 2, 0, 1
        table.attach ques, 0, 1, 1, 2
        table.attach erro, 1, 2, 1, 2
        
        add table

    end
    
    def on_info
        md = Gtk::MessageDialog.new(self,
            Gtk::Dialog::DESTROY_WITH_PARENT, Gtk::MessageDialog::INFO, 
            Gtk::MessageDialog::BUTTONS_CLOSE, "Download completed")
        md.run
        md.destroy
    end
        
    
    def on_erro
        md = Gtk::MessageDialog.new(self, Gtk::Dialog::MODAL |
            Gtk::Dialog::DESTROY_WITH_PARENT, Gtk::MessageDialog::ERROR, 
            Gtk::MessageDialog::BUTTONS_CLOSE, "Error loading file")
        md.run
        md.destroy
    end
    
    
    def on_ques
        md = Gtk::MessageDialog.new(self,
            Gtk::Dialog::DESTROY_WITH_PARENT, Gtk::MessageDialog::QUESTION, 
            Gtk::MessageDialog::BUTTONS_CLOSE, "Are you sure to quit?")
        md.run
        md.destroy
    end
    
    def on_warn
        md = Gtk::MessageDialog.new(self,
            Gtk::Dialog::DESTROY_WITH_PARENT, Gtk::MessageDialog::WARNING, 
            Gtk::MessageDialog::BUTTONS_CLOSE, "Unallowed operation")
        md.run
        md.destroy
    end
end

Gtk.init
    window = RubyApp.new
Gtk.main

In our example, we will show four kinds of message dialogs. Information, Warning, Question and Error message dialogs.

 info = Gtk::Button.new "Information"
 warn = Gtk::Button.new "Warning"
 ques = Gtk::Button.new "Question"
 erro = Gtk::Button.new "Error" 

We have four buttons. Each of these buttons will show a different kind of message dialog.

 def on_info
     md = Gtk::MessageDialog.new(self,
         Gtk::Dialog::DESTROY_WITH_PARENT, Gtk::MessageDialog::INFO, 
         Gtk::MessageDialog::BUTTONS_CLOSE, "Download completed")
     md.run
     md.destroy
 end

If we click on the info button, the Information dialog is displayed. The Gtk::MessageDialog::INFO specifies the type of the dialog. The Gtk::MessageDialog::BUTTONS_CLOSE specifies the button to be displayed in the dialog. The last parameter is the message dislayed. The dialog is displayed with the run method. The programmer must also call either the destroy or the hide method.


Information message dialog   Warning message dialog   Question message dialog   Error message dialog

AboutDialog

The AboutDialog displays information about the application. AboutDialog can display a logo, the name of the application, version, copyright, website or licence information. It is also possible to give credits to the authors, documenters, translators and artists.

#!/usr/bin/ruby

# ZetCode Ruby GTK tutorial
#
# This example demonstrates the
# AboutDialog dialog
#
# author: jan bodnar
# website: www.zetcode.com
# last modified: June 2009

require 'gtk2'


class RubyApp < Gtk::Window

    def initialize
        super
    
        set_title "About dialog"
        signal_connect "destroy" do 
            Gtk.main_quit 
        end
        
        init_ui

        set_default_size 300, 150
        set_window_position Gtk::Window::POS_CENTER
        
        show_all
    end
    
    def init_ui
    
        button = Gtk::Button.new "About"
        button.set_size_request 80, 30
        
        button.signal_connect "clicked" do
            on_clicked
        end
        
        fix = Gtk::Fixed.new
        fix.put button, 20, 20
   
        add fix

    end
    
    def on_clicked
        about = Gtk::AboutDialog.new
        about.set_program_name "Battery"
        about.set_version "0.1"
        about.set_copyright "(c) Jan Bodnar"
        about.set_comments "Battery is a simple tool for battery checking"
        about.set_website "http://www.zetcode.com"
        about.set_logo Gdk::Pixbuf.new "battery.png"
        about.run
        about.destroy
    end
end

Gtk.init
    window = RubyApp.new
Gtk.main

The code example uses a AboutDialog with some of its features.

 about = Gtk::AboutDialog.new

We create an AboutDialog.

 about.set_program_name "Battery"
 about.set_version "0.1"
 about.set_copyright "(c) Jan Bodnar"

Here we specify the name, the version and the copyright.

 about.set_logo Gdk::Pixbuf.new "battery.png"

This line creates a logo.


AboutDialog
Figure: AboutDialog

FontSelectionDialog

The FontSelectionDialog is a dialog for selecting fonts. It is typically used in applications, that do some text editing or formatting.

#!/usr/bin/ruby

# ZetCode Ruby GTK tutorial
#
# This example works with the
# FontSelectionDialog
#
# author: jan bodnar
# website: www.zetcode.com
# last modified: June 2009

require 'gtk2'


class RubyApp < Gtk::Window

    def initialize
        super
    
        set_title "FontSelectionDialog"
        signal_connect "destroy" do 
            Gtk.main_quit 
        end
        
        init_ui

        set_default_size 300, 150
        set_window_position Gtk::Window::POS_CENTER
        
        show_all
    end
    
    def init_ui
    
        set_border_width 10
        @label = Gtk::Label.new "The only victory over love is flight."
        button = Gtk::Button.new "Select font"
        
        button.signal_connect "clicked" do
            on_clicked
        end

        fix = Gtk::Fixed.new
        fix.put button, 100, 30
        fix.put @label, 30, 90
        add fix

    end
    
    def on_clicked
        fdia = Gtk::FontSelectionDialog.new "Select font name"
        response = fdia.run
              
        if response == Gtk::Dialog::RESPONSE_OK
            font_desc = Pango::FontDescription.new fdia.font_name
            if font_desc
                @label.modify_font font_desc
            end
        end
        fdia.destroy
    end     
end

Gtk.init
    window = RubyApp.new
Gtk.main

In the code example, we have a button and a label. We show the FontSelectionDialog by clicking on the button.

 fdia = Gtk::FontSelectionDialog.new "Select font name"

We create the FontSelectionDialog.

 if response == Gtk::Dialog::RESPONSE_OK
     font_desc = Pango::FontDescription.new fdia.font_name
     if font_desc
         @label.modify_font font_desc
     end
 end 

If we click on the OK button, the font of the label widget changes to the one, that we selected in the dialog.


FontSelectionDialog
Figure: FontSelectionDialog

ColorSelectionDialog

ColorSelectionDialog is a dialog for selecting a color.

#!/usr/bin/ruby

# ZetCode Ruby GTK tutorial
#
# This example works with the
# ColorSelectionDialog
#
# author: jan bodnar
# website: www.zetcode.com
# last modified: June 2009

require 'gtk2'


class RubyApp < Gtk::Window

    def initialize
        super
    
        set_title "ColorSelectionDialog"
        signal_connect "destroy" do 
            Gtk.main_quit 
        end
        
        init_ui

        set_default_size 350, 150
        set_window_position Gtk::Window::POS_CENTER
        
        show_all
    end
    
    def init_ui
    
        set_border_width 10
        @label = Gtk::Label.new "The only victory over love is flight."
        button = Gtk::Button.new "Select color"
        
        button.signal_connect "clicked" do
            on_clicked
        end

        fix = Gtk::Fixed.new
        fix.put button, 100, 30
        fix.put @label, 30, 90
        add fix
    end
    
    def on_clicked
        cdia = Gtk::ColorSelectionDialog.new "Select color"
        response = cdia.run
              
        if response == Gtk::Dialog::RESPONSE_OK
            colorsel = cdia.colorsel
            color = colorsel.current_color
            @label.modify_fg Gtk::STATE_NORMAL, color
        end
        
        cdia.destroy
    end
end

Gtk.init
    window = RubyApp.new
Gtk.main

The example is very similar to the previous one. This time we change the color of the label.

 cdia = Gtk::ColorSelectionDialog.new "Select color"

We create the ColorSelectionDialog.

 if response == Gtk::Dialog::RESPONSE_OK
     colorsel = cdia.colorsel
     color = colorsel.current_color
     @label.modify_fg Gtk::STATE_NORMAL, color
 end

If the user pressed OK, we get the color value and modify the label's color.


ColorSelectionDialog
Figure: ColorSelectionDialog

In this part of the Ruby GTK tutorial, we presented dialogs.