ソフトウェア設計及び演習2013
gtk::チュートリアル
第2回～第3回の演習で実際に（自分で手を動かして）学んでもらう内容についてです．
step1からstep6まで，もれなく，順番に進めていき，gtkプログラミングに関する簡単な仕組みを理解してください．
お手本コード置き場
教育用端末なら
[/home/prog/kimura/csd/gtk/tutorial|file:///home/prog/kimura/csd/gtk/tutorial/]
以下にあります．
演習内容
教科書第2章の内容をトレースし，中身を理解する．
[step1] 空ウィンドウ作成
- csd/gtk/image-viewer/1 を作り，
- image-viewer.c を（教科書ソース2-1どおりに）入力
- コンパイル，動作確認
- コンパイルコマンドは
gcc -o image-viewer image-viewer.c `pkg-config --cflags --libs gtk+-2.0`
- 動作確認は
./image-viewer
- プログラムの終了はウィンドウの「×」ボタンか，プログラムを実行した端末ウィンドウで「Ctrl+C」
- Makefile を作成してみる（参考：Makefileの書き方）
- 解答例
# $Id:$ # -*- coding:utf-8; -*- CC = gcc TARGET = image-viewer GTK2FLAG = `pkg-config gtk+-2.0 --cflags --libs` $(TARGET): image-viewer.c $(CC) image-viewer.c $(GTK2FLAG) -o $(TARGET)以下は中級者向け．（$< とか $@ とか .PHONY とか，分からないことは自分で調べてみよう！）
# $Id:$ # -*- coding:utf-8; -*- CC = gcc TRGS = image-viewer GTK2FLAG = `pkg-config gtk+-2.0 pango gdk-pixbuf-2.0 --cflags` GTK2LIBS = `pkg-config gtk+-2.0 pango gdk-pixbuf-2.0 --libs` CFLAGS = -g -Wall -DG_DISABLE_DEPRECATED -DGTK_DISABLE_DEPRECATED -DGDK_DISABLE_DEPRECATED -DGDK_PIXBUF_DISABLE_DEPRECATED -I . all: $(TRGS) .c.o: $(CC) -c $< $(GTK2FLAG) $(CFLAGS) image-viewer: image-viewer.o $(CC) -o $@ $^ $(GTK2LIBS) image-viewer.o: image-viewer.c .PHONY: clean clean: rm -f *~ *.o $(TRGS)
step1で理解すべき項目
- GTK+の関数を利用する場合のインクルードファイル指定，コンパイル・リンク法
- GTK+の初期化法
- ウィンドウの作成，大きさ変更，表示
[step2] 終了ボタンの追加
- csd/gtk/image-viewer/2 を作り，
- image-viewer.c を（教科書ソース2-2どおりに）入力
- Makefile作成
- step1との差分をよく確認する
(cd ~/csd/gtk; meld 1 2) 表示されたウィンドウでimage-viewer.cを選択（どちら側でもよい）
- コンパイル，実行
step2で理解すべき項目
- ボタンウィジェットの作成，配置
- コンテナ
- コールバック関数，イベント
[step3] 画像の表示
- csd/gtk/image-viewer/3 を作り，
- image-viewer.c を（教科書ソース2-3どおりに）入力
- Makefile作成
- step2との差分をよく確認する
(cd ~/csd/gtk; meld 2 3)
-
コンパイル，実行
- 実行の際，コマンドラインで「表示したい画像ファイル名」を指示すること
教科書と同じ画像は以下にあります．
/home/prog/kimura/csd/gtk/tutorial/birds.png
step3で理解すべき項目
- イメージウィジェットの作成，配置法
- パッキングボックス
[step4] スクロールバーの追加
- csd/gtk/image-viewer/4 を作り，
- image-viewer.c を（教科書ソース2-4どおりに）入力
- Makefile作成
- step3との差分をよく確認する
(cd ~/csd/gtk; meld 3 4)
-
コンパイル，実行
- スクロールバーで画像が動くことを確認する
- ウィンドウを大きくするとスクロールバーはどうなる？
step4で理解すべき項目
- スクロールバー付ウィジェット
- スクロールバーの設定法
[step5] メニューバーの追加
- 先に教科書の内容をよく読んでGtkUIManagerについて簡単に知っておいた方がベターです．その後，
- csd/gtk/image-viewer/5 を作り，
- image-viewer.c を（教科書ソース2-5どおりに）入力
- ソースがかなり長くなるので注意！
- 129行めを，image = gtk_image_new_from_file( argv[1] ); として，画像を表示してみるのもいいかもしれません．
- Makefile作成
- step4との差分をよく確認する
(cd ~/csd/gtk; meld 4 5)
-
コンパイル，実行
- メニューの内容とプログラムに記載した事項をよく確認する
step5で理解すべき項目
- メニュー作成の手順
- メニュー構成を記述するXMLファイル
- メニューアイテムを設定するGtkActionEntry
- GtkUIManager
- ショートカットキーを使う場合の設定法
- メニューバーウィジェット
最終更新日：2013/10/17 10:37:41