GTK 桌面應用程式開發與佈局容器詳解

GTK 提供了豐富的元件和工具，方便開發者快速構建跨平台的桌面應用程式。本文從一個簡單的 GTK 應用程式範例開始，逐步講解如何使用 C 語言建立視窗、按鈕等基本元件，並示範如何利用訊號處理機制回應使用者操作。接著，文章探討了 GTK 的佈局容器，例如 GtkBox 和 GtkGrid，它們可以有效地組織和排列應用程式中的各種元件，實作靈活的介面設計。文章提供了詳細的程式碼範例，方便讀者理解和實踐。此外，文章還針對 GTK4 編譯錯誤等常見問題提供瞭解決方案，幫助開發者快速排除故障。

#include <gtk/gtk.h>

static void print_hello(GtkWidget *widget, gpointer data) {
    g_print("Hello, GTK!\n");
}

static void activate(GtkApplication *app, gpointer user_data) {
    GtkWidget *window;
    GtkWidget *button;

    window = gtk_application_window_new(app);
    gtk_window_set_title(GTK_WINDOW(window), "Hello GTK");
    gtk_window_set_default_size(GTK_WINDOW(window), 200, 100);

    button = gtk_button_new_with_label("Click Me");
    g_signal_connect(button, "clicked", G_CALLBACK(print_hello), NULL);
    g_signal_connect_swapped(button, "clicked", G_CALLBACK(gtk_window_destroy), window);
    gtk_window_set_child(GTK_WINDOW(window), button);

    gtk_widget_show(window);
}

int main(int argc, char **argv) {
    GtkApplication *app;
    int status;

    app = gtk_application_new("org.gtk.example", G_APPLICATION_FLAGS_NONE);
    g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);
    status = g_application_run(G_APPLICATION(app), argc, argv);
    g_object_unref(app);

    return status;
}

使用 GTK 建立桌面應用程式

在現代桌面應用程式開發中，GTK（GIMP Toolkit）是一個強大且靈活的工具函式庫。它提供了豐富的元件和工具，能夠幫助開發者快速構建跨平台的桌面應用程式。這篇文章將探討如何使用 GTK 來建立基本的桌面應用程式，並介紹一些常見的容器和佈局管理器。

簡單的 GTK 應用程式範例

首先，我們來看一個簡單的 GTK 應用程式範例。這個範例將展示如何建立一個包含按鈕的視窗，並在按鈕被點選時執行某些操作。

#include <gtk/gtk.h>

static void print_rocks(GtkWidget *widget, gpointer data) {
    g_print("Raspberry Pi Rocks\n");
}

static void activate(GtkApplication *app, gpointer user_data) {
    GtkWidget *window;
    GtkWidget *box;
    GtkWidget *button;

    window = gtk_application_window_new(app);
    gtk_window_set_title(GTK_WINDOW(window), "Window Rocks");

    box = gtk_box_new(GTK_ORIENTATION_HORIZONTAL, 0);
    gtk_window_set_child(GTK_WINDOW(window), box);

    button = gtk_button_new_with_label("Raspberry Pi Rocks");
    g_signal_connect(button, "clicked", G_CALLBACK(print_rocks), NULL);
    g_signal_connect_swapped(button, "clicked", G_CALLBACK(gtk_window_destroy), window);

    gtk_box_append(GTK_BOX(box), button);
    gtk_widget_show(window);
}

int main(int argc, char **argv) {
    GtkApplication *app;
    int status;

    app = gtk_application_new("org.gtk.example", G_APPLICATION_DEFAULT_FLAGS);
    g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);

    status = g_application_run(G_APPLICATION(app), argc, argv);
    g_object_unref(app);

    return status;
}

內容解密：

主函式：
- main 函式是程式的入口點，首先建立了一個 GtkApplication 例項。
- 然後將 activate 函式連線到應用程式的 activate 命令訊號上。
- 接著執行 g_application_run 函式來執行應用程式。
activate 函式：
- activate 函式在應用程式啟動時被呼叫。
- 建立了一個新的 GtkApplicationWindow 例項，並設定其標題。
- 建立了一個水平排列的 GtkBox 容器，並將其新增到視窗中。
- 建立了一個按鈕，並將其新增到容器中。
- 將按鈕的 clicked 訊號連線到兩個回撥函式：print_rocks 和 gtk_window_destroy。前者在終端機上列印訊息，後者在按鈕被點選時關閉視窗。

GTK 常見佈局容器

在實際開發中，我們經常需要在視窗中新增多個小部件，並控制它們的佈局和尺寸。GTK 提供了多種佈局容器來滿足這些需求。以下是一些常見的佈局容器：

小段落標題

GtkBox

GtkBox 是一個簡單且靈活的容器，能夠將子小部件排列成一行或一列。根據 GtkOrientable:orientation 屬性的值，它可以水平或垂直排列子小部件。所有子小部件在垂直或水平方向上會被分配相同的尺寸。

#include <gtk/gtk.h>

static void activate(GtkApplication *app, gpointer user_data) {
    GtkWidget *window;
    GtkWidget *box;
    GtkWidget *button1;
    GtkWidget *button2;

    window = gtk_application_window_new(app);
    gtk_window_set_title(GTK_WINDOW(window), "GtkBox Example");

    box = gtk_box_new(GTK_ORIENTATION_VERTICAL, 5);
    gtk_window_set_child(GTK_WINDOW(window), box);

    button1 = gtk_button_new_with_label("Button 1");
    button2 = gtk_button_new_with_label("Button 2");

    gtk_box_append(GTK_BOX(box), button1);
    gtk_box_append(GTK_BOX(box), button2);

    gtk_widget_show(window);
}

int main(int argc, char **argv) {
    GtkApplication *app;
    int status;

    app = gtk_application_new("org.gtk.box.example", G_APPLICATION_DEFAULT_FLAGS);
    g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);

    status = g_application_run(G_APPLICATION(app), argc, argv);
    g_object_unref(app);

    return status;
}

內容解密：

主函式：
- 建立了一個 GtkApplication 例項，並將其啟動。
activate 函式：
- 建立了一個新的視窗，並設定其標題。
- 建立了一個垂直排列的 GtkBox 容器，並將其新增到視窗中。
- 建立了兩個按鈕，並將它們新增到容器中。
- 顯示視窗。

小段落標題

GtkGrid

GtkGrid 是一個更靈活的容器，能夠將子小部件排列成網格狀。它支援任意位置和跨度，子小部件可以跨越多行或多列。這使得它非常適合需要複雜佈局的應用程式。

#include <gtk/gtk.h>

static void print_rocks(GtkWidget *widget, gpointer data) {
    g_print("Raspberry Pi Rocks\n");
}

static void activate(GtkApplication *app, gpointer user_data) {
    GtkWidget *window;
    GtkWidget *grid;
    GtkWidget *buttonA;
    GtkWidget *buttonB;
    GtkWidget *buttonQuit;

    window = gtk_application_window_new(app);
    gtk_window_set_title(GTK_WINDOW(window), "GtkGrid Example");

    grid = gtk_grid_new();
    gtk_window_set_child(GTK_WINDOW(window), grid);

     buttonA = gtk_button_new_with_label("Button A");
     buttonB = gtk_button_new_with_label("Button B");
     buttonQuit = gtk_button_new_with_label("Quit");

     g_signal_connect(buttonA, "clicked", G_CALLBACK(print_rocks), NULL);
     g_signal_connect(buttonB, "clicked", G_CALLBACK(print_rocks), NULL);
     g_signal_connect_swapped(buttonQuit, "clicked", G_CALLBACK(gtk_window_destroy), window);

     gtk_grid_attach(GTK_GRID(grid), buttonA, 0, 0, 1, 1);
     gtk_grid_attach(GTK_GRID(grid), buttonB, 1, 0, 1, 1);
     gtk_grid_attach(GTK_GRID(grid), buttonQuit, 0, 1, 2, 1);

     gtk_widget_show(window);
}

int main(int argc, char **argv) {
     GtkApplication *app;
     int status;

     app = gtk_application_new("org.gtk.grid.example", G_APPLICATION_DEFAULT_FLAGS);
     g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);

     status = g_application_run(G_APPLICATION(app), argc, argv);
     g_object_unref(app);

     return status;
}

內容解密：

主函式：
- 建立了一個 GtkApplication 例項，並將其啟動。
activate 函式：
- 建立了一個新的視窗，並設定其標題。
- 建立了一個 GtkGrid 網格佈局容器，並將其新增到視窗中。
- 建立了三個按鈕：Button A、Button B 和 Quit 按鈕，並分別連線到不同的訊號處理函式。
- 把按鈕新增到網格中的不同位置：
  - Button A 被放置在 (0,0) 的位置，
  - Button B 被放置在 (1,0) 的位置，
  - Quit 按鈕則跨越兩列 (0-1) 放置在第二行 (1) 的位置。

其他常見佈局容器

除了 GtkBox 和 GtkGrid 外，GTK 均提供了多種其他佈局容器來滿足不同的需求。以下是一些常見的佈局容器及其簡要說明：

GtkRevealer：這是一種動畫效果容器，能夠逐步顯示或隱藏其子小部件。
GtkStack：這是一種堆積疊容器，一次只顯示一個子小部件。可以與其他元件配合使用來切換顯示內容。
GtkOverlay：這是一種重疊容器，允許在主要小部件上疊加其他小部件。
GtpPaned：這是一種分割面板容器，能夠水平或垂直分割視窗區域。
GtpExpander：這是一種可擴充套件容器，允許透過點選展開或收縮其子小部件。

認識 GTK 常見問題與解決方案

小段落標題

請問：GTK4 應用程式編譯錯誤

gcc $(pkg-config --cflags gtk4) -o example example.c $(pkg-config --libs gtk4)

處理方法：

編譯錯誤通常由缺少依賴函式庫或包含錯誤引起。請確保系統已安裝 GTK4 的開發包：

sudo apt-get install libgtk-4-dev

如果仍然出現問題請檢查 GTK4 安裝路徑及命令引數設定：

pkg-config --libs --cflags gtk4

確認執行結果可正確取得所需函式庫與引數。

問答與互動

@startuml
skinparam backgroundColor #FEFEFE
skinparam defaultTextAlignment center
skinparam rectangleBackgroundColor #F5F5F5
skinparam rectangleBorderColor #333333
skinparam arrowColor #333333

title 問答與互動

rectangle "提問" as node1
rectangle "回答" as node2
rectangle "互動" as node3

node1 --> node2
node2 --> node3

@enduml

內容解密：

此圖示說明瞭使用者與玄貓互動流程圖示。

結果與反思

透過以上範例及說明我們瞭解如何使用 GTK 架構搭建桌面應用程式、設定各類別基本元件、回掉訊號等技術操作。同時從這些基本實作可看到 GTK 本身擁有非常靈活設計模型與豐富元件庫存產品功能支援，這對於專案研發及日後技術維護具有非常大優勢。

使用 Geany 開發 GTK4 應用程式及 Gnuplot 的安裝與使用

在現代軟體開發中，圖形使用者介面（GUI）是非常重要的一環。GTK（GIMP Toolkit）是一個流行的開源工具包，用於建立跨平台的 GUI 應用程式。此外，Gnuplot 是一個功能強大的命令列資料和科學圖形包，廣泛應用於資料視覺化。本文將介紹如何使用 Geany IDE 來開發 GTK4 應用程式，以及如何在 Raspberry Pi 上安裝和使用 Gnuplot。

使用 Geany 開發 GTK4 應用程式

Geany 是一個輕量級且功能豐富的整合開發環境（IDE），適合開發 GTK 應用程式。以下是使用 Geany 來開發 GTK4 應用程式的詳細步驟：

1. 安裝必要的軟體

首先，確保你已經安裝了 Geany 和 GTK4 的開發函式庫。你可以使用以下命令來安裝這些工具：

sudo apt install geany libgtk-4-dev

此外，在編譯之前，需要在命令列中執行以下命令來禁止輔助技術：

export GTK_A11Y=none

2. 建立 GTK4 專案

開啟 Geany，建立一個新的專案來存放你的 GTK4 應用程式。設定好你的原始碼檔案和專案相關檔案。

// example-2.c
#include <gtk/gtk.h>

static void activate(GtkApplication *app, gpointer user_data) {
    GtkWidget *window;
    GtkWidget *grid;
    GtkWidget *button;

    window = gtk_application_window_new(app);
    gtk_window_set_title(GTK_WINDOW(window), "Window");
    gtk_window_set_default_size(GTK_WINDOW(window), 200, 100);

    grid = gtk_grid_new();
    gtk_container_add(GTK_CONTAINER(window), grid);

    button = gtk_button_new_with_label("Quit");
    g_signal_connect(button, "clicked", G_CALLBACK(gtk_window_close), window);

    // Place the Quit button in the grid cell (0, 1), and make it span 2 columns.
    gtk_grid_attach(GTK_GRID(grid), button, 0, 1, 2, 1);

    gtk_widget_show(window);
}

int main(int argc, char **argv) {
    GtkApplication *app;
    int status;

    app = gtk_application_new("org.gtk.example", G_APPLICATION_DEFAULT_FLAGS);
    g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);
    status = g_application_run(G_APPLICATION(app), argc, argv);
    g_object_unref(app);

    return status;
}

3. 組態編譯設定

在 Geany 中，進入「編譯」選單並選擇「設定編譯命令」。組態編譯命令以編譯和連結你的 GTK4 應用程式。可以使用 pkg-config 取得 GTK4 的必要編譯標誌：

Compile: gcc -Wall -c "%f" `pkg-config --cflags gtk4`
Build: gcc -o "%e" "%f" `pkg-config --libs gtk4`

4. 編寫 GTK4 原始碼

在原始碼檔案中編寫你的 GTK4 應用程式原始碼。確保包含必要的 GTK4 標標頭檔案並遵循 GTK4 的程式設計約定。

5. 儲存並編譯

儲存你的檔案並使用 Geany 的編譯命令來編譯你的專案。檢查編譯輸出以查詢任何錯誤。

6. 執行程式

當編譯成功後，你可以直接從 Geany 執行你的 GTK4 應用程式。點選「執行」按鈕或按 F5。

7. 除錯

如果遇到問題，可以使用 Geany 的除錯功能。設定斷點、檢查變數並逐步執行程式碼以識別和修復問題。

安裝與使用 Gnuplot

Gnuplot 是一個強大的資料和科學圖形包，可以在 Linux 和 UNIX 上執行。它支援多種圖形型別和輸出格式。以下是如何在 Raspberry Pi 上安裝和使用 Gnuplot 的步驟：

安裝 Gnuplot

有兩種方法可以在 Raspberry Pi 上安裝 Gnuplot：

從 Raspberry Pi 選單安裝：
- 點選「偏好設定」>「新增/移除軟體」。
- 輸入 gnuplot 並按 <Enter>。
- 勾選「Command-line driven interactive plotting program」並點選「應用」。
- 這樣會安裝適當的套件以及 gnuplot-X11 包，以便獲得 X Window System 型態輸出。
從官方網站下載：
- 前往 gnuplot 首頁下載並按照指示進行安裝。

執行 Gnuplot

安裝完成後，可以使用以下命令啟動並離開 Gnuplot：

$ gnuplot
G N U P L O T
Version 5.4 patchlevel 1 last modified 2020-12-01
Copyright (C) 1986-1993, 1998, 2004, 2007-2020 Thomas Williams, Colin Kelley and many others
gnuplot home: www.gnuplot.info
faq, bugs, etc: type "help FAQ"
immediate help: type "help" (plot window: hit 'h')
Terminal type is now 'qt'
gnuplot> exit
$

基本語法與互動模式

Gnuplot 支援多種圖表型別，包括二維和三維圖表。它還支援多種輸出格式，如 eps、pdf、png 和 postscript。

以下是一些基本語法範例：

# 命名圖表並繪製資料
set title "My First Plot"
plot 'data'
print "all done!"

# 分行陳述式
set title "Multi-line Example"
set xlabel "X-Axis"
set ylabel "Y-Axis"
p 'data' w l lw 2 t "Data Plot"

Gnuplot 的互動模式語法區分大小寫，所有命令都有標準化的縮寫。多個互動命令可以在一行中使用分號分隔。

技術選型考量與未來趨勢

在選擇 GUI 工具包時，GTK 和 Qt 是兩個主要選項。GTK 主要用於 GNOME 桌面環境，而 Qt 則更為跨平台。GNUPlot 則是一個強大的資料視覺化工具，特別適合需要快速生成高品質圖表的情況下。

隨著技術的進步，未來可能會看到更多根據 Web 技術（如 Electron）構建的跨平台 GUI 應用程式。此外，機器學習和人工智慧技術也可能會融入到資料視覺化工具中，提供更智慧化的圖表生成功能。

內容解密：

Geany IDE：Geany 是一個輕量級且功能豐富的整合開發環境（IDE），適合開發 GTK 應用程式。它提供了方便的程式碼編輯、編譯和除錯功能。
GTK4 安裝與組態：需要先安裝必要的軟體包 libgtk-4-dev 和 geany ，並在命令列中設定 GTK_A11Y=none。
GTK4 原始碼範例：範例原始碼展示瞭如何建立一個簡單的視窗並新增一個按鈕。
Gnuplot 安裝與基本語法：介紹瞭如何從 Raspberry Pi 選單或官方網站安裝 Gnuplot，以及一些基本語法範例。
技術選型考量與未來趨勢：討論了 GUI 工具包（GTK 和 Qt）及資料視覺化工具（GNUPlot）選擇時需要考慮的因素以及未來技術趨勢。

希望這篇文章能夠幫助讀者更好地理解如何使用這些工具來進行軟體開發及資料視覺化工作。

玄貓 BlackCat

技術愛好者，專注於分享程式開發、雲端技術與 AI 應用的心得體會。