Blog | Tag | Local | Guest | Login | Write |  RSS
GTK+ "Hello World"


안녕하세요. 한주동안 잘지내셨는지요?^ ^;
오늘은 Hello World를 출력하는(?) 화면을 만들어 볼 생각입니다. ^ ^

모든 Programming 언어의 책의 첫장을 보면 화면에 Hello World를 띄우는 것부터 연습를 하죠? ^ ^; 그래서 저도 오늘은 Hello World를 화면에 보여주려고 합니다. 가장 기초적인 부분부터 뼈대를 만들어 가볼까요? ㅋㅋㅋ

이번에는 Source를 분석할때는 시그널(이벤트) 함수와 시그널 핸들러 함수에 대해서 집중적으로 설명해 볼까 합니다.

1. Hello World를 들어가기에 앞서..

이번에는 여태까지 내용과는 달리 중요한 부분이 몇가지 나오는 것 같아요. 중요한 부분이라면, gtk프로그래밍에서 interface를 다루는 부분이죠. interface란 사용자와 컴퓨터(or 윈도우) 사이의 관계를 말하며, 사용자가 요구하는 대로 반응하는 환경을 구현하는 것이 interface 프로그래밍이라고 합니다.

어떤 식으로 Hello World를 출력해 볼까요? 일단, 버튼과 label을 하나 만들어 볼까해요~ 버튼을 누르면 label의 내용이 "Hello World Open"으로 바뀌었다가 다시 한번 더 누르면 "Hello World Closed"로 바꾸도록 만들어 보겠습니다. 그럼 여기서도 알 수 있듯이 오늘은 버튼을 누름에 따라 변화를 구현하는부분이 핵심이라는 것을 알 수 있죠?

2. Hello World


#include <gtk/gtk.h>

GtkWidget *label;

void button_clicked ( gtkwidget *widget, gpointer data)
{

          static int toggle = 1; 

          if (toggle == 1) 
          { 
                    gtk_label_set_text ( gtk_label(label) , "hello world opened"); 
                    toggle = 0; 
          } 
          else 
          { 
                    gtk_label_set_text ( gtk_label(label) , "hello world closed"); 
                    toggle = 1; 
          }
}

void delete_event ( gtkwidget *widget, gdkevent *event, gpointer data)

          gtk_main_quit ();
}

int main( int argc,char *argv[] )

          gtkwidget *window, *button; 
          gtkwidget *vbox; 
          gtk_init (&argc, &argv); 
          window = gtk_window_new (gtk_window_toplevel); 
          gtk_window_set_title(gtk_window (window), "upgrade hello world");

          gtk_signal_connect ( gtk_object(window), "delete_event", 
          gtk_signal_func ( delete_event), null); 
          gtk_container_set_border_width ( gtk_container ( window), 10 ); 
          vbox = gtk_vbox_new ( false,0); 
          gtk_container_add ( gtk_container ( window ), vbox); 

          label = gtk_label_new ("hello world closed");

          gtk_box_pack_start (gtk_box(vbox), label, true, true, 0); 
          gtk_widget_show ( label);

          button = gtk_button_new_with_label ("Click");

          gtk_signal_connect ( gtk_object (button), "clicked");
          gtk_signal_func ( button_clicked ), null); 
          gtk_box_pack_start (gtk_box(vbox), button, true, true, 0); 
          gtk_widget_show (button); 
          gtk_widget_show (vbox); 
          gtk_widget_show (window); 

          gtk_main (); 
          return(0);
}


3. Hello World Source 설명

main()을 보면 보지못했던 새로운 함수들이 보이죠?

                    gtk_window_set_title(); 
                    gtk_signal_connect(); 
                    gtk_container_set_border_width(); 
                    gtk_vbox_new(); 
                    gtk_button_new_with_label(); 
                    gtk_box_pack_start();

gtk_window_set_title();
위의 함수는 메인 윈도우의 제목을 정해 주는 부분입니다. title!! 이 글자만 봐도 대충 감이 잡히죠? ^ ^; 

gtk_container_set_border_width();
이 함수는 window 의 border 의 크기를 정의합니다.

gtk_vbox_new();
gtk에서 윈도우 안의 여러가지 위젯들을 배열하기 위해서 box라는 위젯을 많이 씁니다. gtk는 window 안에 window를 삽입 할 수 가 없어서 이러한 도구를 앞으로도 많이 사용할 것입니다. table과 frame이 주로 사용되는 도구들 중의 하나이죠 ^ ^
box는 실제로 보여지는 위젯은 아니지만 다른 widget들을 배열하기 위해 사용하지요. box인데 vbox라고 사용한 것에 대해 의심이 가지 않아요? box는 두가지 종류가 있습니다. vbox와 hbox가 사용됩니다. 이것은 수직박스와 수평박스를 나타내지요. 물론 gtk_*_new()으로 정의할 수 있습니다. hbox와 vbox의 조합으로 위젯의 위치를 정해서 좀더 직관화된 인터페이스를 만들 수 있죠.
위의 "Hello World" source는 vbox를 정의하고 그곳에 레이블과 버튼을 올려놓습니다(packing). packing이라는 말은 widget들을 쌓아 넣는다고 보면됩니다. 예를들어 커다란 여행 가방에 여러가지 물품들을 차곡차곡 정리해야 한다면 vbox로 나눈뒤 수직 방향의 박스에 차곡차곡 widget을 넣어서 보기좋게 정돈되는 과정이라고 생각하시면 되죠 ^ ^ 머리속으로 그림을 그리면 좀더 쉽게 이해가 되실 겁니다.

gtk_button_new_with_label();
button을 정의하는데 label을 넣고 싶을 때 쓰는 함수입니다. 버튼에는 일반적으로 label이 보여서 사용자에게 어떤 역할을 하는지 알려주는 역할을 하죠.  

gtk_box_pack_start();
gtk_container_add와 비슷한데.(기억나시죠? container에 무언가 추가하는^ ^;) 여기서는 박스에 쌓기(packing) 위해서 위 함수를 쓴다. gtk_box_pack_start()는 hbox 위젯의 왼쪽에서 오른쪽, vbox부분에서는 위쪽에서 아래쪽의 순으로 쌓는다는 의미이며, 반대 역할을 하는 gtk_box_pack_end()함수도 있습니다. 뒤에 붙는 인자들은 expand, fill할 것인가에 대한 선택이며, 마지막이 padding의 크기를 정의합니다. 

이제부터.. 가장 중요한 부분을 설명해 보겠습니다. 제가 처음에 말씀드렸죠. 오늘은 가~장 중요한 무언가가 나올것이라구요.
이제 나타날 때가 되었습니다. 짜~~~잔!!!^ ^* 

gtk_signal_connect(   gtkobject *object, 
                                gchar *name, 
                                gtksignalfunc func, 
                                gpointer func_data
                             );

위 함수는 interface , 즉 사용자가 뭔가를 행하였을(signal) 때 반응 하는 함수에 대해서 연결 (connect ) 시켜주는 역할을 합니다.


위의 예제(Hello World)중에서..
gtk_signal_connect ( gtk_object (button), 
                                 "clicked", 
                                 gtk_signal_func ( button_clicked ), 
                                 null); 

예로 들자면, 사용자가 button이라는 위젯을 눌렀(click)을 경우 'clicked' 라는 이벤트가 발생하며, button_clicked라는 함수를 불러 실행하라는 의미가 됩니다. 실제 button_clicked는 소스의 윗부분에 정의하였습니다.

두 번째 인수인 "clicked"는 임의로 정해지는 것이 아닙니다. 이것은 각각의 위젯에 대해서 사용자가 행한 행동 (event라고도 할수 있다)을 말하며, 버튼이라면 누르는 것이 있을 것이며, 메뉴에서는 선택하는 부분등이 예가 될 수 있습니다. 이 event는 각각의 위젯에 따라 다르며, 그 이름또한 틀립니다. 그 이름은 미리 정의되어 있습니다. 물론 사용자가 임의의 위젯을 만들고 임의의 이벤트를 만들수는 있지만, 그것은 좀더 고차원적인 기술이기에 다음 기회에 해보아야겠습니다.
사용자가 버튼을 눌렀더니, button_clicked이라는 함수가 불러집니다. 실제 위 소스에서는 버튼이 눌러지면 label 의 내용을 토글시키는 작용을 하게 해놓았습니다. c 프로그래밍을 접한 우리들은 쉽게 접근할 수 있겠죠. 여기에서 마지막 인수는 함수에 넘겨질 데이터입니다. 이 데이터는 대부분 프로그래밍에서는 null이지만 사용자가 필요에 의해 임의의 값을 넘겨주어야 할 때 적어주면 됩니다.
위에 또다른 gtk_signal_connect가 있죠? 'delete_event' 이며 이는 시스템 버튼 (오른쪽 위의 x모양의 버튼) 이 눌러졌을 경우 gtk 내부에 미리 정의된 기본 함수, gtk_main_quit을 부르게 되어 있습니다. 단순히 윈도우를 종료시키는 함수죠. 사용자가 만들지 않아도 되는 (일반적인 이벤트 함수) 함수들은 미리 정의된 것들을 쓰기도 합니다.


그럼. 정리를 해볼까요? ^ ^; 

(1) 우선 window을 생성하고, 박스를 만듭니다.
(2) label을 생성하고 초기 이름은 'hello world closed'이고 이것을 박스에 쌓아봅니다(packing).
(3) button을 만들고 초기 label은 '클릭해 주세요'이며, 버튼이 눌러질 경우 행하여질 이벤트 함수를 'button_clicked'라고 정의하였고 이벤트와 연결하였습니다. 버튼 또한 box에 packing시킵니다.
(4) 각각의 위젯을 보이게 합니다.

4. 결과 화면
 


오늘 저의 설명은 어떠하였는지요? ^ ^; 궁금한 사항이 있으면 댓글을 달아주세요 ^ ^
무언가 하나씩 해나아가는 듯한 느낌이 들지 않아요? ㅋㅋ 오늘은 무언가 설명 좀 한것 같아서 나름 뿌듯한걸요? ^ ^;
함수를 좀더 쉽게 설명하기 위해 책과 블로그들을 참고하였는데, 아직 많이 미흡-_-+ 이쁘게 봐주세요 ^ ^