windows+GTK4_3+Clion+msys2

@

---

🔜底部锚点 ▼⬇️

前言

• 在犹豫用什么框架写GUI时，考虑纵多,我决定用GTK4来在windows上开发GUI程序,
  原因是小巧,界面还可以. (受不了win32图形界面原生api的臃肿繁琐?)
• 相关教程很少 于是我在这里整理一些要点细节记录一下

---

提示：以下是本篇文章正文内容，下面案例可供参考

Requirements

• Clion : 我下载的版本是CLion 2023.2.2 破解工具(仅供学习) 原本是用vs2022配置的但....
• msys2 :包含mingw和pacman管理工具

一、安装相关工具

• # gcc
    pacman -S mingw-w64-ucrt-x86_64-gcc
    # gtk  4
    pacman -S mingw-w64-x86_64-gtk4
    # gtk  3
    pacman -S mingw-w64-x86_64-gtk3
    # 工具链
    pacman -S mingw-w64-x86_64-toolchain base-devel

• gtk4或许依赖一些gtk3的库文件所以我都安装后再 pacman -R mingw-w64-x86_64-gtk3只安装gtk4时 CMakeLists.txt build 时报一些错误

二、配置环境变量

• 主要是把msys下面的mingw64目录暴露出来,然后

• 

• 注意顺序: 上面bin lib include 一定放在下面两个上面 不然后面用pkg-config --modversion gtk4 验证的时候:Package gtk4 was not found in the pkg-config search path.

• 下面两个环境变量的配置是必要的吗? 待定...

三、验证工具/模块

• # PowerShell下输入
    
    gcc --version 
    #gtk4 模块版本
    pkg-config --modversion gtk4
    #gtk3 
    pkg-config --modversion gtk+-3.0
    #gtk3/4 库文件 4改3
    pkg-config --cflags --libs gtk4 
    
    #demo
    gtk4-demo
    gtk3-demo

---

四、Clion Build工具集的配置

• Ctrl+Alt+S show up the settings Window

五、CMakeLists.txt文件的配置

• gtk4 (ProjectName字段改成你的项目名)

  cmake_minimum_required(VERSION 3.2)
  project(SimpleCalculatorPro)
  
  set(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -std=c++11")
  
  find_package(PkgConfig REQUIRED)
  
  pkg_check_modules(GTK4 REQUIRED gtk4)
  
  include_directories(${GTK4_INCLUDE_DIRS})
  link_directories(${GTK4_LIBRARY_DIRS})
  
  add_definitions(${GTK4_CFLAGS_OTHER})
  
  add_executable(ProjectName main.cpp)
  target_link_libraries(ProjectName ${GTK4_LIBRARIES})

• gtk3 (ProjectName字段改成你的项目名)

  cmake_minimum_required(VERSION 3.2)
    project(SimpleCalculatorPro)
  
    set(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -std=c++11")
  
    find_package(PkgConfig REQUIRED)
  
    pkg_check_modules(GTK3 REQUIRED gtk+-3.0)
  
    include_directories(${GTK3_INCLUDE_DIRS})
    link_directories(${GTK3_LIBRARY_DIRS})
  
    add_definitions(${GTK3_CFLAGS_OTHER})
  
    add_executable(ProjectName main.cpp)
    target_link_libraries(ProjectName ${GTK3_LIBRARIES})

六、简单窗口例子

• #include <gtk/gtk.h>
  static
  void log_print()
  {
  
   g_print("this is a message\n");
  
  }
  static
  void activate (
   GtkApplication* app,
   gpointer  data
  )
  {
   GtkWidget* window;
   GtkWidget* button;
   window = gtk_application_window_new(app);
   button = gtk_button_new_with_label("hello world!");
   g_signal_connect(button, "clicked", G_CALLBACK(log_print), nullptr);
  
   gtk_window_set_default_size(GTK_WINDOW(window), 100, 300);
   gtk_window_set_title(GTK_WINDOW(window), "test");
   gtk_window_set_child(GTK_WINDOW(window), button);
   gtk_window_present(GTK_WINDOW(window));
  }
  int main(int argc,
        char** argv)
  {
   GtkApplication* app;
   int status;
   app = gtk_application_new("myapp.test.com", G_APPLICATION_DEFAULT_FLAGS);
   g_signal_connect(app, "activate", G_CALLBACK(activate), nullptr);
  
   status = g_application_run(G_APPLICATION(app), argc, argv);
   g_object_unref(app);
  
  }

  • 这是一个GTK4窗口

七、Glade:GTK的GUI设计器

• pacman -S mingw-w64-x86_64-glade
• Glade手册
  • https://help.gnome.org/users/glade/stable/
  • https://developer.gnome.org/documentation/tutorials.html
• Glade相关工具包
  • https://packages.msys2.org/search?q=glade

To be continue...

---

------------------------------------- ½§¦ ‹ ‹‹‹…‹ 这是分割线中的分隔区 ›…››› ›¦§½ ----------------------------------------

---

后记

• Setting up GTK for Windows
• https://www.gtk.org/docs/installations/windows/
• GTK Getting Started
• https://www.gtk.org/docs/getting-started/hello-world/
• GTK+ 4 Reference Manual
• https://developer-old.gnome.org/gtk4/
• Glade Manual
• https://help.gnome.org/users/glade/stable/
• https://developer.gnome.org/documentation/tutorials.html
• Glade Relative Packages
• https://packages.msys2.org/search?q=glade

我保留了GTK3模块，以防GTK4错误