技術メモ (ソフトウェア開発) > Gtk+/GNOME開発メモ >

Glade 3 でGUI開発

(2008.8.7)

Gtk+/GNOME アプリケーションを開発するための、ユーザインターフェイスデザイナ Glade について。

Gladeとは

GUIアプリケーションを作るとき、ウィンドウを開いたり部品 (コントロール) を配置するプログラムをいちいち手で書くのは現実的ではありません。余白などはプログラム上で数値を書いてもピンときませんし。

Gladeは、Gtk+/GNOMEアプリケーションのウィンドウなどをGUIでデザインできます。

Gladeが生成するgladeファイルは、C/C++, Python などで扱えます。

Gladeのインストール

Fedora 9 Linux には Glade3 バージョン3.4.4のパッケージが用意されています。yumコマンドでインストールします。 

# yum install glade3
Note.

Glade3以外にも、Gazpacho, Glade2 でもgladeファイルを編集できます。Glade2はC言語のソースを出力することもできます。

やってみよう

簡単なGUIアプリを作ってみましょう。

gladeを開き、簡単なダイアログボックスを作ります。ボタンのプロパティで、コールバック関数の名前を設定してください。

Glade3はGUIデザインを表現する glade ファイルを出力するだけです。プログラムでそのファイルを読み込んで、ウィンドウなどを構築させます。

  1. #define GTK_DISABLE_DEPRECATED 1
  2. #define LIBGLADE_DISABLE_DEPRECATED 1
  3. #include <gtk/gtk.h>
  4. #include <glade/glade.h> // --------- (1)
  6. G_BEGIN_DECLS
  7. void on_button2_clicked();
  8. G_END_DECLS
  10. void on_button2_clicked() {
  11. printf("clicked!\n");
  12. }
  14. int main(int argc, char* argv[]) {
  15. GladeXML* xml;
  16. GtkWidget* window;
  18. gtk_init(&argc, &argv);
  20. xml = glade_xml_new("glade_test.glade", NULL, NULL); // --- (2)
  21. if (!xml) {
  22. printf("glade file error.\n");
  23. return 1;
  24. }
  25. window = glade_xml_get_widget(xml, "window"); // --- (3)
  26. glade_xml_signal_autoconnect(xml); // --- (4)
  28. g_object_unref(G_OBJECT(xml));
  30. gtk_widget_show(window);
  31. gtk_main();
  33. return 0;
  34. }

順に説明しますと、

  1. <glade/glade.h> をincludeします。
  2. glade_xml_new() 関数にgladeファイルのファイル名を渡して、glade XMLデータを読み込みます。文字列データからXML木を構築するときは、glade_xml_new_from_buffer() を使います。XML木を構築した後で、ノードを追加したり削除したりはできないようです。
  3. Widgetへの参照は、glade_xml_get_widget() で得られます。内部の動作を追っていませんが、このタイミングで各widgetが生成されるのだろうと思います。
  4. シグナルのコールバック関数への接続は、glade_xml_signal_autoconnect() で、いっぺんに、自動的にできます。シンボル名で探すので、コールバック関数は、Cスタイルで書かないといけません。プロトタイプ宣言をG_BEGIN_DECLS / G_END_DECLS で囲みます。

コンパイルは、例えば、次のようにします。 

$ gcc -Wall first.cc `pkg-config --cflags --libs libglade-2.0 gmodule-2.0` -lstdc++

glade_xml_signal_autoconnect() を使うときは、libgmodule-2.0 も必要になります。

C++の場合

プログラムを C++ で書く場合は次のようになります。C++では glade_xml_signal_autoconnect() が使えないので、一手間増えます。

次のサンプルコードは、gtkmm での派生クラスのサンプルも兼ねています。

  1. #define GTKMM_DISABLE_DEPRECATED 1
  2. #include <libglademm/xml.h>
  3. #include <gtkmm.h>
  4. #include <iostream>
  5. #include <cassert>
  7. typedef Glib::RefPtr<Gnome::Glade::Xml> glade_ref_t;
  9. // 派生クラスのサンプル
  10. class MyDialog: public Gtk::Dialog
  11. {
  12. typedef Gtk::Dialog super;
  13. glade_ref_t glade_xml;
  14. public:
  15. MyDialog(BaseObjectType* cobject, const glade_ref_t& glade_xml_): // (1)
  16. super(cobject),
  17. glade_xml(glade_xml_)
  18. {
  19. Gtk::Widget* drawing = NULL;
  20. glade_xml->get_widget("drawingarea", drawing); // (2)
  21. assert(drawing);
  23. // (3)
  24. glade_xml->connect_clicked("button2",
  25. sigc::mem_fun(*this, &MyDialog::on_button_clicked));
  26. }
  28. void on_button_clicked() {
  29. std::cout << "clicked!\n";
  30. }
  31. };
  33. int main(int argc, char* argv[]) {
  34. Gtk::Main kit(argc, argv);
  36. glade_ref_t glade_xml;
  37. try {
  38. glade_xml = Gnome::Glade::Xml::create("glade_test.glade"); // (4)
  39. }
  40. catch (const Gnome::Glade::XmlError& ex) {
  41. std::cerr << ex.what() << std::endl;
  42. return 1;
  43. }
  45. MyDialog* dialog = NULL;
  46. glade_xml->get_widget_derived("window", dialog); // (5)
  47. assert(dialog);
  49. kit.run(*dialog);
  50. return 0;
  51. }
  1. gtkmmのクラスを派生させるときは、決まったコンストラクタを持たなければなりません。cobject はそのままスーパクラスへ渡します。
  2. widgetへの参照を得るのは、get_widget() メソッドです。第2引数に得たいクラスのポインタを渡します。dynamic_cast は不要です。
  3. シグナルの接続ですが、ボタンについては簡便なメソッドが用意されています。それ以外のときは、普通にgtkmmの流儀で接続します。
  4. gladeファイルを読み込むのは、create() クラスメソッドです。
  5. 派生クラスのインスタンスを得たいときは、get_widget() ではなく、get_widget_derived() を呼び出すようにします。

コンパイルは次のようにします。 

$ gcc -Wall sample02.cc `pkg-config --cflags --libs libglademm-2.4` -lstdc++

外部リンク

gtkmm - the C++ interface to GTK+
gtkmm の公式サイト。Documentation のセクションで提供される、Programming with gtkmm が優れている。
gtkmm 入門
さまざまなサンプルプログラムがある。