Home  Contents

First programs in GTK+

في هذا الجزء من دورة GTK+  , سوف نقوم بانشاء اول برنامج لنا في ال GTK+  .

Simple example

سوف نبدأ بمثال بسيط جدا . سوف نعرض نافذه بدائيه بسيطه .

#include <gtk/gtk.h>

int main( int argc, char *argv[])
{
  GtkWidget *window;

  gtk_init(&argc, &argv);

  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  gtk_widget_show(window);

  gtk_main();

  return 0;
}

هذه المثال سوف يظهر شاشه بدائيه بسيطه علي الشاشه .

  gcc -o simple simple.c `pkg-config --libs --cflags gtk+-2.0`

هذه هي طريقة ترجمة الشفره المصدريه .

 gtk_init(&argc, &argv);

هنا نبدأ باعطاء ال GTk+  الحياه من داخل البرنامج . اي نقوم باعطائها التحكم . 

 window = gtk_window_new(GTK_WINDOW_TOPLEVEL);

نقوم بأنشاء نافذه GtkWindow Widget  . نوع هذه النافذه هو GTK_WINDOW_TOPLEVEL  . انواع النوافذ التي تكون Toplevel   لابد ان تحتوي علي شريط عنوان و حدود للنافذه. ويتم ادارة الحدود والشريط بواسطة ال window manger   او بالتحديد مدير النوافذ .

 gtk_widget_show(window);

بعد ان قمنا بإنشاء ال widget  , لابد ان نظهره .

 gtk_main();

هذا السطر البرمجي يقوم بادخال البرنامج في الدواره الاساسيه ل GTK +  (main loop)  , في هذه الحاله البرنامج يكون في حاله معلقه يجلس وينتظر الاحداث (events)  .

Figure: Simple

Centering the window

اذا لم نقم بتوجية مكان النافذه بانفسنا , فان مدير النوافذ سوف يقوم بتوجيهها من اجلنا. في المثال القديم , سوف نقوم بمحورة النافذه في منتصف الشاشه.

#include <gtk/gtk.h>

int main( int argc, char *argv[])
{
  GtkWidget *window;

  gtk_init(&argc, &argv);

  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  gtk_window_set_title(GTK_WINDOW(window), "Center");
  gtk_window_set_default_size(GTK_WINDOW(window), 230, 150);
  gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
  gtk_widget_show(window);

  g_signal_connect_swapped(G_OBJECT(window), "destroy",
      G_CALLBACK(gtk_main_quit), NULL);

  gtk_main();

  return 0;
}

في هذه المثال , نقوم بمحورة النافذه ونضع عنوان لها وايضا نقوم بتحديد مساحتها .

 gtk_window_set_title(GTK_WINDOW(window), "Center");

الداله gtk_window_set_title(GTK_WINDOW(window) , "Center");   تقوم بوضع عنوان للنافذه كما هو واضح من اسمها . اذا لم نضع لها عنوان بنفسنا فأن مكتبة ال GTK+  سوف تستخدم عنوان ملف الشفره لكي تقوم بتسمية النافذه.

 gtk_window_set_default_size(GTK_WINDOW(window), 230, 150);

هذه الشفره تقوم بوضع مساحة للنافذه 230X150 pixel  . لاحظ , نحن نتكلم عن المساحة الداخليه للنافذه اي مابين الحدود , باعدين عن الاوسمه المقدمه من مدير النوافذ.

 gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);

هذه الشفره تقوم بمحورة النافذه في منتصف الشاشه.

 g_signal_connect_swapped(G_OBJECT(window), "destroy",
     G_CALLBACK(gtk_main_quit), NULL);

في المثال السابق , النافذه لم تغلق "تدمر" بشكل كامل , عندما عندما تضغط علي علامة X . حيث اننا نستطيع ان نرا عندما نقوم بتشغيل التطبيق في المثال من سطر الاوامر (command line)  نستطيع ان نري البرنامج لايزال يعمل.

لابد ان نقوم بأنهاء البرنامج بشكل كامل صريح  بواسطة ربط اشارة التدمير "عندما تضغط علي علامة  X  " بالداله gtk_main_quit(); .

The application icon

في المثال التالي , سوف نعرض ايقومة التطبيق . معظم مدراء النوافذ يظهرون الايقونه في الركن الشمالي  لشريط العنوان وايضا علي شريط المهام (taskbar)  .

#include <gtk/gtk.h>

GdkPixbuf *create_pixbuf(const gchar * filename)
{
   GdkPixbuf *pixbuf;
   GError *error = NULL;
   pixbuf = gdk_pixbuf_new_from_file(filename, &error);
   if(!pixbuf) {
      fprintf(stderr, "%s\n", error->message);
      g_error_free(error);
   }

   return pixbuf;
}

int main( int argc, char *argv[])
{
  GtkWidget *window;

  gtk_init(&argc, &argv);

  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  gtk_window_set_title(GTK_WINDOW(window), "icon");
  gtk_window_set_default_size(GTK_WINDOW(window), 230, 150);
  gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
  gtk_window_set_icon(GTK_WINDOW(window), create_pixbuf("web.png"));
  gtk_widget_show(window);

  g_signal_connect_swapped(G_OBJECT(window), "destroy",
      G_CALLBACK(gtk_main_quit), NULL);

  gtk_main();

  return 0;
}

شفرة هذا المثال تظهر ايقونة التطبيق.

 gtk_window_set_icon(GTK_WINDOW(window), create_pixbuf("web.png"));

الدالة gtk_window_set_icon()  تعرض الايقونة للنافذه الخاصه بنا . الداله create_pixbuf()   تقوم بانشاء GdkPixBuf  من صورة امتداها png  .

 pixbuf = gdk_pixbuf_new_from_file(filename, &error);

طبقا للوثائق الخاصه ب GTK+  , الداله gtk_pixbuf_new_from_file()  تقوم بانشاء pixbuf   جديد بتحميل الصوره من الملف الخاص بها. امتداد الصوره يكتشف تلقائيا. اذا تم ارجاع القيمه NULL  , فسوف تضبط الخطأ.

وهذه واضح من استخدام ال Gerror  واستخدامه في الداله gtk_pixbuf_new_from_file() .

Figure: Icon

Increase - Decrease

سوف ننهي الفصل الاول من دورة البرمجه ب GTK+  بمثال, حيث يكون لدينا ثلاث child widgets  . زرارين و علامه نصيه. العلامه النصيه سوف تحمل قيمه عدديه . الازرار سوف تقوم بازادة او إنقاص هذه القيمه العديده.

#include <gtk/gtk.h>

gint count = 0;
char buf[5];

void increase(GtkWidget *widget, gpointer label)
{
  count++;

  sprintf(buf, "%d", count);
  gtk_label_set_text(label, buf);
}

void decrease(GtkWidget *widget, gpointer label)
{
  count--;

  sprintf(buf, "%d", count);
  gtk_label_set_text(label, buf);
}

int main(int argc, char** argv) {

  GtkWidget *label;
  GtkWidget *window;
  GtkWidget *frame;
  GtkWidget *plus;
  GtkWidget *minus;

  gtk_init(&argc, &argv);

  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
  gtk_window_set_default_size(GTK_WINDOW(window), 250, 180);
  gtk_window_set_title(GTK_WINDOW(window), "+-");

  frame = gtk_fixed_new();
  gtk_container_add(GTK_CONTAINER(window), frame);

  plus = gtk_button_new_with_label("+");
  gtk_widget_set_size_request(plus, 80, 35);
  gtk_fixed_put(GTK_FIXED(frame), plus, 50, 20);

  minus = gtk_button_new_with_label("-");
  gtk_widget_set_size_request(minus, 80, 35);
  gtk_fixed_put(GTK_FIXED(frame), minus, 50, 80);

  label = gtk_label_new("0");
  gtk_fixed_put(GTK_FIXED(frame), label, 190, 58); 

  gtk_widget_show_all(window);

  g_signal_connect(window, "destroy",
      G_CALLBACK (gtk_main_quit), NULL);

  g_signal_connect(plus, "clicked", 
      G_CALLBACK(increase), label);

  g_signal_connect(minus, "clicked", 
      G_CALLBACK(decrease), label);

  gtk_main();

  return 0;
}

هذه المثال ينقص او يزيد القيمه الموجوده بداخل ال GtkLabel .

 g_signal_connect(plus, "clicked", 
     G_CALLBACK(increase), label);

نقوم بربط بدالة الاتصال المعاكس للزرار increase()   بالزرار plus . لاحظ اننا قمنا بارسال label  كparameter  للدالة الاتصال المعاكس. لاننا سوف نعمل علي هذا ال label  بداخل دالة الاتصال المعاكس .

 count++;

 sprintf(buf, "%d", count);
 gtk_label_set_text(label, buf);

في داخل هذه الداله , نقوم بازادة قيمة المتغير counter  والذي يرمز للعدد المتسخدم . ونقوم بعمل متغير نصي يحتوي علي تلك القيمه العدديه ثم نقوم بتحديث القيمه بداخل العنوان النصي (label)  . وكذلك الحال بالنسبه للزرار minus  ولكن بانقاص هذه القيمه .

Figure: Increase - Decrease

Home ‡ Contents ‡ Top of Page