Ubuntu Weekly Recipe

第424回 GUIプログラムをPython/Ruby/ECMAScriptで書く

この記事を読むのに必要な時間:およそ 6.5 分

Rubyの場合

Rubyを使った場合のプログラムは,次のとおりです。

#!/usr/bin/env ruby

require 'gtk3'

class Sample < Gtk::Window
    def initialize()
        super
        self.title = 'Gtk+3 sample'
        self.border_width = 20

        vbox = Gtk::Box.new(Gtk::Orientation::VERTICAL, 10)
        self.add(vbox)

        topbox = Gtk::Box.new(Gtk::Orientation::HORIZONTAL, 10)
        vbox.pack_start(topbox, :expand => true, :fill => true, :padding => 0)

        button = Gtk::Button.new(:label => 'swap')
        button.signal_connect('clicked') { |obj|
            label = @label.text
            @label.set_text(@entry.text)
            @entry.set_text(label)
        }
        topbox.pack_start(button, :expand => true, :fill => true, :padding => 0)

        button = Gtk::Button.new(:label => 'close')
        button.signal_connect('clicked') { |obj|
            Gtk::main_quit()
        }
        topbox.pack_start(button, :expand => true, :fill => true, :padding => 0)

        bottombox = Gtk::Box.new(Gtk::Orientation::HORIZONTAL, 10)
        vbox.pack_start(bottombox, :expand => true, :fill => true, :padding => 0)

        @entry = Gtk::Entry.new()
        @entry.set_text('left')
        bottombox.pack_start(@entry, :expand => true, :fill => true, :padding => 0)
        @label = Gtk::Label.new('result')
        @label.set_text('right')
        bottombox.pack_start(@label, :expand => true, :fill => true, :padding => 0)

        Signal.trap('INT') { |signo|
            Gtk.main_quit()
        }

        self.signal_connect('delete_event') {
            Gtk.main_quit()
        }
    end
end

win = Sample.new()
win.show_all()
Gtk::main()

このプログラムを実行するために,⁠ruby-gtk3」パッケージをインストールしてください。ruby.rbというファイルに保存し,権限を付与して実行すると,Python 3のサンプルとほぼ同じウィンドウが開きます。

$ sudo apt-get install ruby-gtk3
$ gedit ruby.rb
$ chmod a+x ruby.rb
$ ./ruby.rb

ECMAScriptの場合

ECMAScriptは,JavaScriptとして言及される雑多な言語実装の,共通文法となるべきものです。

ECMAScriptを使った場合のプログラムは,次のとおりです。

#!/usr/bin/gjs

const Gtk = imports.gi.Gtk;
const Lang = imports.lang;

const Sample = new Lang.Class ({
    Name: 'Gtk+3-Sample',
    Extends: Gtk.Window,
    _init: function() {
        let params = {
            title: 'Gtk+3 sample',
            border_width: 20,
        };
        this.parent(params);

        params = {
            orientation: Gtk.Orientation.VERTICAL,
        };
        let vbox = new Gtk.Box(params);
        this.add(vbox);

        params = {
            orientation: Gtk.Orientation.HORIZONTAL,
            spacing: 10,
        };
        let topbox = new Gtk.Box(params);
        vbox.pack_start(topbox, true, true, 0);

        params = {
            label: 'swap',
        };
        this.button = new Gtk.Button(params);
        this.button.connect("clicked", Lang.bind(this, this.on_click_swap));
        topbox.pack_start(this.button, true, true, 0);

        params = {
            label: 'close',
        };
        let button = new Gtk.Button(params);
        button.connect('clicked', Lang.bind(this, this.on_click_close));
        topbox.pack_start(button, true, true, 0);

        params = {
            orientation: Gtk.Orientation.HORIZONTAL,
            spacing: 10,
        };
        let bottombox = new Gtk.Box(params);
        vbox.pack_start(bottombox, true, true, 0);

        this.entry = new Gtk.Entry();
        this.entry.text = 'left';
        bottombox.pack_start(this.entry, true, true, 0);

        params = {
            label:  'right',
        };
        this.label = new Gtk.Label(params);
        bottombox.pack_start(this.label, true, true, 0);
    },

    on_click_swap: function() {
        let label = this.label.label;
        this.label.label = this.entry.text;
        this.entry.text = label;
    },

    on_click_close: function() {
        Gtk.main_quit();
    },
});

Gtk.init(null);
var win = new Sample();
win.show_all();
Gtk.main();

このプログラムを実行するために,⁠gjs」パッケージをインストールしてください。ecmascript.jsというファイルに保存し,権限を付与して実行すると,他のサンプルとほぼ同じウィンドウが開きます。

$ sudo apt-get install gjs
$ gedit ecmascript.js
$ chmod a+x ecmascript.js
$ ./ecmascript.js

なお,gjsはGNOMEプロジェクトの成果物です。GNOME Shellというデスクトップシェルを構成するスクリプトの実行環境として開発されています。ECMAScriptを処理するエンジンとしてMozillaプロジェクトのSpiderMonkeyを利用しています。

また,今回のプログラムでは,GNOMEプロジェクトが提供するLangというラッパースクリプトを利用し,Javaのようなクラス志向のプログラムとして読めるようにしました。ECMAScriptらしくプロトタイプチェーン操作を記述することも考えましたが,GNOME Shell向けスクリプトの作法に従いました。その他の作法や便利な抽象は,他のサンプルとの比較を容易とするためにあえて除外しました。GNOME Shell向けスクリプトとして評価するには原始的であることに注意してください。

著者プロフィール

坂本貴史(さかもとたかし)

Ubuntuのマルチメディア編集環境であるUbuntu Studioのユーザ。主にUbuntu日本コミュニティとUbuntu Studioコミュニティで活動。いつかユーザ同士で合作するのが夢。