ruby-****@sourc*****
ruby-****@sourc*****
2004年 11月 9日 (火) 01:56:47 JST
-------------------------
REMOTE_ADDR = 218.231.205.204
REMOTE_HOST =
URL = http://ruby-gnome2.sourceforge.jp/ja/?libglade2-tut-textedit
-------------------------
= Gladeでテキストエディタを作ってみよう
普通はHello Worldからはじめたいところですが、ここではいきなりテキストエディタを作ってみます。いきなり難しすぎるって？これがびっくりするほど簡単なんですって。
アプリケーション名は、そうですねぇ「こんにちは世界エディタ（英語名：Hello World Editor）、プログラム名：hwedit」に決定！
== プライマリ（メイン）ウィンドウを作る
glade-2を起動し、まずは、プライマリウインドウを生成します。
- （画像）
+
+ {{image_right("1.png")}}
+ {{br}}
+
生成したウインドウのプロパティを設定します。
=== Widgetタブ
ひとつひとつ説明していくのが大変なので変更したところだけ（←手抜き）。
:Name
そのウィジェットの名前（ID）です。Rubyから呼び出す際にも使います。ここでは"main_window"にします。IDですからアプリケーションでユニークな値になっている必要があります。
:Title
ウインドウのタイトルバーに表示される文字列です。"Hello World Editor"にします。もちろん日本語でも大丈夫ですが、目指すは国際化されたエディタです！英語にしましょう！
そうそう、ここは後で編集中のファイル名を表示できるようにしたいですね。後ほど説明します。
:Default Width, Default Height
最初に表示したときの画面サイズです。
=== Signalsタブ
ウインドウの右上にある×ボタン（「閉じる」ボタン）がクリックされたらアプリケーションを終了させることにします。
×ボタンがクリックされると、main_windowはdelete_eventを発生させるのでそれを捕捉してHandlerを呼び出します。Signal:にdelete_eventを選択すると、Handlerは自動的に"on_main_window_delete_event"という名前になります。名前を変更しても良いですが、ここではそのまま使います。
＃後で、on_main_window_delete_eventというメソッドをRubyで記述し、実際の終了コードを書きます。
== コンテナウィジェットを追加する
ウインドウにレイアウトコンテナウィジェットを追加します。Gtk::VBox, Gtk::HBox, Gtk::Table, Gtk::Fixed, Gtk::NoteBookなどがあります。
((* ※表示上はGtkVBox, GtkHBoxなど、"::"が無い表記になっていますがこれはglade-2がC言語向けに作られているからです。以下、GtkVBox => Gtk::VBoxと脳内置換します。*))
コンテナウィジェットはそれ自体が子ウィジェットを持つことができるウィジェットです。Gtk::Containerを継承するウィジェットたちですので、実はかなり多くのウィジェットはコンテナウィジェットになりえます。Gtk::Windowももちろんコンテナウィジェットです。
ただし、Gtk::Binを継承したクラスは子ウィジェットを1つしか持てないという性質があります。それに対し、レイアウトコンテナウィジェットは、複数の子ウィジェットを持てたりそれらを配置したりすることができます。
ここでは、縦にメニュー・テキストエディタの2段構成とするため、Gtk::VBoxを追加します。
== メニューを追加する
次にメニューを追加します。
デフォルトでいくつかのメニューが追加されています。この順番はなるべく標準的なものに従うほうがユーザが戸惑わずにすみます。ではどういう順番なら良いのか。((<GNOME Human Interface Guidelines|URL:http://kazehakase.sourceforge.jp/cgi-bin/hiki/hiki.cgi?GNOME_HIG>))のメニューの章を参考にすると良いでしょう。
=== メニューアイテムの編集
次にメニューの中身を編集します。今作ったばかりのメニュー上で右クリックし、「Edit menus...」を選択します。
イメージ図では、「_New」の項目を選択しています。
ちょうど基本的なエディタが必要とするメニューは一通りありますね。サンプルアプリケーションということで、とりあえず「_View」アイテムと「_Edit->_Delete」アイテムは削除するだけにします。もちろん、あなたがアプリケーションを作るときには必要に応じて追加や削除を行う必要があります。
さて、右側の各項目、なんとなくポチポチといじってみればすぐに理解できると思うので要点だけ。Name欄が選択したメニューアイテムのIDとなり、Handler欄はRuby上に定義するメソッド名になります。
詳細は後で説明しますが、ここではNewメニューアイテムが選択されるとon_new1_activateが呼び出されるので、そこで処理を記述するというわけです。
このサンプルではデフォルトのままのName, Handler名称を使いますが、丁寧にやる場合は「new1」とかいう名前は避けるべきでしょうね。「menu_new」とかするとか。それから、プライマリウインドウのところで説明しましたとおり、NameはIDですからアプリケーションでユニークな値になっている必要がありますので気をつけてください。
== テキストエディタ(Gtk::TextView)を追加する
テキストエディタ部分にはGtk::TextViewを使います。
これでもう外見はエディタそのものですね！
== 各種ダイアログを作る
ファイルの保存・オープン用のファイル選択ダイアログと、Aboutダイアログも一緒に作ります。
=== ファイル選択ダイアログ
ファイル選択ダイアログはGtk::FileSelectionとGtk::FileChooserDialogの2種類があります。Gtk::FileSelectionはGTK+-2.0からのウィジェット、Gtk::FileChooserDialogはGTK+2.4移行のウィジェットです。
新しもの好きなのでここでは、Gtk::FileChooserDialogを使ってみましょう。
プロパティで変更したのは以下です。
:Name
デフォルトのままだと長いので、filechooserにしました。
:Position
表示されるポジションです。親ウインドウの中央に表示されるように"Center on Parent"を選択しました。
:Modal
モーダルとはこのウインドウが表示されているとき別のウインドウ（親ウインドウ）を触れなくするというオプションです。ここでは、Yesにしました。
:Skip Taskbar/Pager
タスクバーやページャにこのウインドウを表示させるかどうかの設定です。両方Yesにしました。
ただし、ウインドウマネージャによっては有効にならないときがあるかもしれません。
また、Commonタブの"Visible"プロパティはは"No"にします。起動時は非表示状態にしておくためです。
=== Aboutダイアログ
AboutダイアログはRuby/Gnome2を使うと一発なのですが、ここではRuby/GTK2だけでできるものということで自前で簡単なAboutダイアログを作ることにします。
:Name
"aboutdialog"としました。
:Title
"About ... "としました。
:Position
こちらも親ウインドウの中央に表示されるように"Center on Parent"を選択しました。
:Skip Taskbar/Pager
タスクバーやページャにこのウインドウを表示させるかどうかの設定です。両方Yesにしました。
ただし、ウインドウマネージャによっては有効にならないときがあるかもしれません。
こちらも、Commonタブの"Visible"プロパティはは"No"にします。
ラベルを貼り付けてそこに情報を書き込みます。
:Label
ちょっと長いです。Pango Text Attribute Markupを使って色をつけてみます。Pango MarkupについてはPango APIリファレンスにある((<Pango Text Attribute Markup|URL:http://developer.gnome.org/doc/API/2.0/pango/PangoMarkupFormat.html>))を参照してください（環境によっては使用できない（変化しない）項目もあります）。
<span color="red">hwedit - Hello World Editor</span>
<span color="darkgreen">This is a sample application for Ruby/Glade2</span>
Ruby/Glade2 is a part of Ruby-GNOME2.
Copyright (c) 2004 Ruby-GNOME2 Project Team
:Use Markup
"Yes"を指定します。これをYesにすることで前述のPango Markupが有効になります。Noの場合は、Markupも通常の文字列として認識されます。
:Justify
"Center"を指定し中央寄せで表示します。
次にCloseボタンを選択してボタンがクリックされたときのイベント(clicked)に対しシグナルハンドラを追加します。デフォルトのままで「on_closebutton1_clicked」という名前になります。