Gtk4 Tutorial for beginners

Related tags

GUI Gtk4-tutorial
Overview

Gtk4 Tutorial for beginners

Contents of this repository

This tutorial illustrates how to write C programs with Gtk4 library. It focuses on beginners so the contents are limited to basic things. The table of contents are shown at the end of this abstract.

  • Section 3 to 21 describes basics and the example is a simple editor tfe (Text File Editor).
  • Section 22 to 24 describes GtkDrawingArea.
  • Section 25 to 28 describes list model and list view (GtkListView, GtkGridView and GtkColumnView). It also describes GtkExpression.

The latest version of the tutorial is located at Gtk4-tutorial github repository. You can read it without download.

Gtk4 Documentation

Please refer to Gtk API Reference and Gnome Developer Documentation Website for further topics.

These websites are newly opend lately (Aug/2021). The old documentation is located at Gtk Reference Manual and Gnome Developer Center. The new website is in progress at present, so you might need to refer to the old version.

If you want to know about GObject and type system, refer to GObject tutorial. They are basic and also necessary to write Gtk4 programs.

Contribution

This tutorial is under development and unstable. Even though the codes of the examples have been tested on Gtk4 version 4.0, there might exist bugs. If you find any bugs, errors or mistakes in the tutorial and C examples, please let me know. You can post it to github issues. You can also post corrected files as a commit to pull request. When you make corrections, correct the source files, which are under the 'src' directory. And run rake, then GFM files under the 'gfm' directory are automatically updated.

If you have a question, feel free to post it to the issue. Any question is helpful to make this tutorial get better.

How to get a HTML or PDF version

If you want to get a HTML or PDF version, you can make them with rake, which is a ruby version of make. Type rake html for HTML. Type rake pdf for PDF. There is a documentation ("How to build Gtk4 Tutorial") that describes how to make them.

Table of contents

  1. Prerequisite and License
  2. Installation of Gtk4 to Linux distributions
  3. GtkApplication and GtkApplicationWindow
  4. Widgets (1)
  5. Widgets (2)
  6. String and memory management
  7. Widgets (3)
  8. Define Child object
  9. Ui file and GtkBuilder
  10. Build system
  11. Initialization and destruction of instances
  12. Signals
  13. Functions in TfeTextView
  14. Functions in GtkNotebook
  15. tfeapplication.c
  16. tfe5 source files
  17. Menu and action
  18. Stateful action
  19. Ui file for menu and action entries
  20. GtkMenuButton, accelerators, font, pango and gsettings
  21. Template XML and composite widget
  22. GtkDrawingArea and Cairo
  23. Combine GtkDrawingArea and TfeTextView
  24. Tiny turtle graphics interpreter
  25. GtkListView
  26. GtkGridView and activate signal
  27. GtkExpression
  28. GtkColumnView
Comments
  • Issue in the Glib Installation Section

    Issue in the Glib Installation Section

    I am working through your tutorial, and it's been a big help with getting started. I did encounter an issue at the very beginning, and including a note about how to resolve this may help other beginners who encounter this issue. In the Glib Installation section, when I ran meson --prefix $HOME/local _build I got the error meson.build:1:0: ERROR: Compiler cc can not compile programs. I was able to resolve it with sudo apt install gcc-multilib The solution was not obvious from the meson-log.txt

    In case its relevant, I'm on Linux Mint 20, which is based on Ubuntu 20.04.

    Edit: For anyone looking for a solution to this problem in the future, I would guess apt-get install libc-dev is what is most likely to fix your issues

    opened by lilithi 5
  • gresource problem chapter 9

    gresource problem chapter 9

    In the end of section 9 you are creating a resources.c file with gresource but in tfe3_r.c, you are not using it.

    Then a C source file resources.c is generated. Modify tfe3.c and save it as tfe3_r.c.

    > #include "resources.c"
    > ... ... ...
    > ... ... ...
    > build = gtk_builder_new_from_resource ("/com/github/ToshioCP/tfe3/tfe3.ui");
    > ... ... ...
    > ... ... ...
    

    Then, compile and run it. The window appears and it is the same as the screenshot at the beginning of this page.

    U still pointing previously created ui file. What is the point here? And after getting resource.c and compiling it with tfe3_r.c, im getting

    /home/dnf/codeblockprojs/tfe3/resources.c|147|multiple definition of `tfe3_get_resource'; obj/Debug/resources.o:/home/dnf/codeblockprojs/tfe3/resources.c:147: first defined here|

    The code is in resources.c:

    .
    .
    static GStaticResource static_resource = { tfe3_resource_data.data, sizeof (tfe3_resource_data.data) - 1 /* nul terminator */, NULL, NULL, NULL };
    
    G_MODULE_EXPORT
    GResource *tfe3_get_resource (void);
    GResource *tfe3_get_resource (void)
    {
      return g_static_resource_get_resource (&static_resource);
    }
    /* GLIB - Library of useful routines for C programming
     * Copyright (C) 1995-1997  Peter Mattis, Spencer Kimball and Josh MacDonald
     *
    .
    .
    

    if i comment out second definition, programs builds and run but i didnt understand what is the problem here.

    opened by feinap 4
  • Found a small typo in section 3.

    Found a small typo in section 3.

    Found a small typo in section 3 :GtkApplicationWindow.

    Extra space in the third line: Now rewrite the program and use GtkAppliction Window.

    ""GtkAppliction Window"" --> ""GtkApplictionWindow""

    By the way, your tutorial is really great! It helped me a lot. Thank yoooooooou!

    opened by imxtx 4
  • A deep GObject tutorial

    A deep GObject tutorial

    Hello! This is not a issue, but a request (very politely).

    First of all thank you very much for your tutorial and code examples, it is helping me a lot in process.

    I would like to ask you for a more complete tutorial section regarding GObject, can you do it?

    Thank you, and keep your amazing work.

    opened by igormorgado 4
  • Created a new tutorial for creating an animated GtkDrawingArea

    Created a new tutorial for creating an animated GtkDrawingArea

    Comments welcome - added as Section 29, ('sec29.src.md') but could probably be slotted in somewhere else.

    This was the result of some other experimentation that I was doing, and could probably do with some code review. I was looking for a simple example of an animated image.

    I don't know what additional optimizations are available for GTK4 code.. like only erasing and redrawing the clock hands.. (would that be a thing?)

    Depending on where it fits in the other sections, it could be changed to use a Makefile.

    Regards, Paul

    opened by PaulSchulz 3
  • `! LaTeX Error: Something's wrong--perhaps a missing \item.` on `rake pdf`

    `! LaTeX Error: Something's wrong--perhaps a missing \item.` on `rake pdf`

    Hi, thanks for the tutorial! I ran rake pdf on HEAD (fbbaa8c) but got this error:

    > rake cleanlatex pdf
    [...]
    (/usr/share/texmf-dist/tex/latex/microtype/mt-msb.cfg) (./abstract.tex
    
    ! LaTeX Error: Something's wrong--perhaps a missing \item.
    
    See the LaTeX manual or LaTeX Companion for explanation.
    Type  H <return>  for immediate help.
     ...
    
    l.12   S
          ection 3 to 21 describes basics and the example is a simple editor
    ?
    

    Generated latex/abstract.tex:

    \hypertarget{about-this-tutorial}{%
    \paragraph{About this tutorial}\label{about-this-tutorial}}
    
    This tutorial is aimed at beginners who are learning Gobject system. One
    [...]
    

    Environments:

    • LuaHBTeX, Version 1.13.2 (TeX Live 2021/Arch Linux)
    • LaTeX2e <2021-11-15> patch level 1
    • L3 programming layer <2021-11-22>
    • pandoc 2.14.1 Compiled with pandoc-types 1.22, texmath 0.12.3.1, skylighting 0.11, citeproc 0.4.1, ipynb 0.1.0.1

    It seems that abstract environments can't contain \paragraphs:

    > cat foo.tex
    \documentclass{article}
    \begin{document}
    \begin{abstract}
    \paragraph{About this tutorial}This tutorial aimed...
    \end{abstract}
    \end{document}
    
    > lualatex foo.tex
    [...]
    (./foo.tex
    [...]
    ! LaTeX Error: Something's wrong--perhaps a missing \item.
    

    and here are related discussions and workarounds:

    • https://tex.stackexchange.com/questions/74371/subdividing-structured-abstracts/74374#74374
    • https://github.com/latex3/latex2e/issues/248
    • https://www.nlm.nih.gov/bsd/policy/structured_abstracts.html
    opened by nmtake 3
  • GtkDirectoryList Error building template

    GtkDirectoryList Error building template

    There are Gtk-CRITICAL when run list3.c example.

    sh-5.1$ ./a.out 
    
    (a.out:33843): Gtk-CRITICAL **: 03:22:40.840: Error building template for list item: .:0:0: No function named `get_file_name`.
    
    (a.out:33843): Gtk-CRITICAL **: 03:22:40.840: Error building template for list item: .:0:0: No function named `get_file_name`.
    
    (a.out:33843): Gtk-CRITICAL **: 03:22:40.840: Error building template for list item: .:0:0: No function named `get_file_name`.
    

    Compiled with gcc `pkg-config --cflags gtk4` c.c `pkg-config --libs gtk4`

    GTK version: 4.2.1-1 Linux: Arch

    opened by gavr123456789 3
  • https://github.com/ToshioCP/Gtk4-tutorial/blob/main/gfm/sec15.md - can you add the command to compile it from the commandline?

    https://github.com/ToshioCP/Gtk4-tutorial/blob/main/gfm/sec15.md - can you add the command to compile it from the commandline?

    https://github.com/ToshioCP/Gtk4-tutorial/blob/main/gfm/sec15.md - can you add the command to compile it from the commandline?

    I think it would be useful to be able to quickly copy/paste the command. One can assemble it from the www but I think having it in the .md file on the end of that file would be very convenient. Thank you for reading!

    opened by rubyFeedback 2
  • In Sec. 27 having FactoryList and FactoryGrid in separate .ui files instead of having it as GBytes in main ui file causes error

    In Sec. 27 having FactoryList and FactoryGrid in separate .ui files instead of having it as GBytes in main ui file causes error

    Probably something needs to be added for it to work as a seperate .ui file. It would be nice if this where to be fixed, as it is suggested at the end of the section as well as during the beginning.

    error message: Template declaration (class 'GtkListItem', parent 'GtkWidget') where templates aren't supported

    opened by MightyPrince1 2
  • Question about the struct pointer.

    Question about the struct pointer.

    What's the meaning of this line?

    https://github.com/ToshioCP/Gtk4-tutorial/blob/ee6a19fe3ae212beeb458c2a17f9cc0f3b9ef39e/gfm/sec6.md?plain=1#L162

    In my C learning, struct is define with {}. Maybe I'm too poor to understand it.

    祝好/Best Wishes

    opened by qaqland 2
  • The error was 'GLXBadFBConfig'.

    The error was 'GLXBadFBConfig'.

    I need to fix this,help is needed. Error:----- (a.out:8740): Gtk-WARNING **: 11:21:38.293: Unknown key gtk-button-images in /home/user/.config/gtk-4.0/settings.ini

    (a.out:8740): Gtk-WARNING **: 11:21:38.297: Unknown key gtk-menu-images in /home/user/.config/gtk-4.0/settings.ini

    (a.out:8740): Gtk-WARNING **: 11:21:38.297: Unknown key gtk-toolbar-style in /home/user/.config/gtk-4.0/settings.ini

    (a.out:8740): Gdk-WARNING **: 11:21:38.446: The program 'a.out' received an X Window System error. This probably reflects a bug in the program. The error was 'GLXBadFBConfig'. (Details: serial 229 error_code 167 request_code 152 (GLX) minor_code 0) (Note to programmers: normally, X errors are reported asynchronously; that is, you will receive the error a while after causing it. To debug your program, run it with the GDK_SYNCHRONIZE environment variable to change this behavior. You can then get a meaningful backtrace from your debugger if you break on the gdk_x_error() function.)

    opened by serdio-nerd 2
  • Line numbers copied along with code.

    Line numbers copied along with code.

    When trying to copy a codeblock from a tutorial section, the line numbers also being copied along with the code even with the copy button on top right

    please fix them

    opened by RageshAntony 1
  • GtkListView with editable text examples for our books

    GtkListView with editable text examples for our books

    Dear Mr. Toshio,

    some weeks ago I created my first GtkColumnView example. I will use that for my SDT tool, and additional use it for a section of my GTK4 book. But I think before introducing ColumnView in my book, I should introduce GtkListView. The whole GtkListView and GtkColumnView stuff is unfortunately not that easy, and the official introductions are not that great and incomplete. I think your GtkListView introduction is currently the best what we have -- as it provides complete examples with and without the use of XML UI files.

    One related question: For my own GtkColumnView Nim code, I needed editable text. One way to get editable text is to use the GtkText widget, connect the activate signal to the GtkText widgets, and use ID numbers assigned in the "bind" callback to store the edited text where we need it. I think for a GtkListView editable entries are rarely needed, but still I wonder how we could change your examples (preferable the fist one, without use of UI files) to use editable text and to save the edits in the model. Is there some property binding available, or would you have to use the activate signal of the GtkEntry widget to store the edited strings somehow?

    I can currently not remember if your GtkListView example allows adding new rows dynamically, and to delete rows. I think your example does not support that currently, but it would be really useful. Reordering rows by drag and drop would be nice as well, but not that important. I have never used drag and drop myself in Nim before, but maybe it is time to learn it. I found a Python example recently (https://discourse.gnome.org/t/reorder-rows-in-a-list-gtk4/8422/4), so it seems to work.

    Unfortunately I will have not much free time in the next months to work on my GTK4 or Nim book, or on the SDT tool. But I will try to continue next year. This summer I unfortunately spent my full holiday on my old tiny chess engine. Maybe wasted time, but the old code which I created seven years ago was just too ugly, and I feel better with the new version :-) And from time to time it is just fun to play some chess against the computer, even when the current GTK GUI is very restricted.

    Best regards,

    Stefan Salewski

    opened by StefanSalewski 1
  • I can help translate this great tutorial into Chinese

    I can help translate this great tutorial into Chinese

    Hi, Toshio. This tutorial is great, thus I want to help you translate it into Chinese. But I'm not familiar with ruby and front-end things. If you want to do this, too, you may need to

    1. Reorganize the src directory to better support multi-languages.
    2. Add a language select button to the navigation bar.

    I will be happy to translate this tutorial if you modify related files to support translation.

    opened by imxtx 5
  • Chaining up of objects in GTK need explaining with examples

    Chaining up of objects in GTK need explaining with examples

    !) how a widget is created and chained up to the parent requires explanation as GTK4 does not handle command line arguments and is required to know the steps to write correct code in GTK.

    opened by gitsop01 3
Owner
ToshioCP
ToshioCP
Gtk4 Tutorial for beginners

Gtk4 Tutorial for beginners

ToshioCP 307 Jan 4, 2023
Zephyr Tutorial for Beginners

Zephyr: Tutorial for Beginners This repository contains a step-by-step guide that teaches you how to use Zephyr RTOS. It assumes: no previous experien

null 124 Dec 27, 2022
Juce tutorial for beginners, with DSP introduction.

JUCE Tutorial Juce tutorial for beginners, with DSP basics. My teaching materials :D Warning: working in progress lesson 0: Setup lesson 1: Basic Basi

Wen-Yi Hsiao 5 Aug 25, 2022
Clean tab-less browser based on webkit2 and GTK4.

Rose Browser Simple browser based on webkit2-5.0/GTK4. Showcase Requirements In order to build rose you need gtk4 and webkit2gtk-5.0. In order to use

Rosé 287 Jan 2, 2023
📚 Modern C++ Tutorial: C++11/14/17/20 On the Fly

The book claims to be "On the Fly". Its intent is to provide a comprehensive introduction to the relevant features regarding modern C++ (before 2020s). Readers can choose interesting content according to the following table of content to learn and quickly familiarize the new features you would like to learn. Readers should be aware that not all of these features are required. Instead, it should be learned when you really need it.

Changkun Ou 19.6k Jan 1, 2023
This is a code repository for pytorch c++ (or libtorch) tutorial.

LibtorchTutorials English version 环境 win10 visual sutdio 2017 或者Qt4.11.0 Libtorch 1.7 Opencv4.5 配置 libtorch+Visual Studio和libtorch+QT分别记录libtorch在VS和Q

null 464 Jan 9, 2023
This repository is a summary of the basic knowledge of recruiting job seekers and beginners in the direction of C/C++ technology, including language, program library, data structure, algorithm, system, network, link loading library, interview experience, recruitment, recommendation, etc.

?? C/C++ 技术面试基础知识总结,包括语言、程序库、数据结构、算法、系统、网络、链接装载库等知识及面试经验、招聘、内推等信息。This repository is a summary of the basic knowledge of recruiting job seekers and beginners in the direction of C/C++ technology, including language, program library, data structure, algorithm, system, network, link loading library, interview experience, recruitment, recommendation, etc.

huihut 27k Dec 31, 2022
📚 Modern C++ Tutorial: C++11/14/17/20 On the Fly

The book claims to be "On the Fly". Its intent is to provide a comprehensive introduction to the relevant features regarding modern C++ (before 2020s). Readers can choose interesting content according to the following table of content to learn and quickly familiarize the new features you would like to learn. Readers should be aware that not all of these features are required. Instead, it should be learned when you really need it.

Changkun Ou 19.6k Jan 8, 2023
Nvidia contributed CUDA tutorial for Numba

This is an adapted version of one delivered internally at NVIDIA - its primary audience is those who are familiar with CUDA C/C++ programming, but perhaps less so with Python and its ecosystem.

Numba 177 Dec 31, 2022
In this tutorial, we will use machine learning to build a gesture recognition system that runs on a tiny microcontroller, the RP2040.

Pico-Motion-Recognition This Repository has the code used on the 2 parts tutorial TinyML - Motion Recognition Using Raspberry Pi Pico The first part i

Marcelo Rovai 19 Nov 3, 2022
Qt 6 Core for Beginners with C++ on Udemy

qt6-core-beginners Qt 6 Core for Beginners with C++ on Udemy Section

Bryan Cairns 126 Jan 7, 2023
Unicorn CPU emulator framework tutorial

使用unicorn-engine开发模拟器 什么是unicorn引擎 Unicorn是基于qemu开发的一个CPU模拟器,支持常见的各种指令集,能在各种系统上运行。 GITHUB项目地址:https://github.com/unicorn-engine/unicorn 官网地址:https://w

null 9 Mar 9, 2022
A Simple 32-bit OS lab tutorial.

一个支点撬动操作系统大山 项目名称:逸仙OS简明教程 ( YatSenOS Volume First ) 所属机构:中山大学操作系统实验课程组 写在前面 本项目已经成功用于2021年中山大学春季操作系统实验课程,课程的地址是https://gitee.com/nelsoncheung/sysu-20

Yat-Sen OS 447 Dec 12, 2022
A ROS based Open Source Simulation Environment for Robotics Beginners

A ROS based Open Source Simulation Environment for Robotics Beginners

Sulegeyixiu 131 Jan 5, 2023
IoT for Beginners - 12 Weeks, 24 Lessons, IoT for All!

Azure Cloud Advocates at Microsoft are pleased to offer a 12-week, 24-lesson curriculum all about IoT basics. Each lesson includes pre- and post-lesson quizzes, written instructions to complete the lesson, a solution, an assignment and more. Our project-based pedagogy allows you to learn while building, a proven way for new skills to 'stick'.

Microsoft 11.5k Jan 2, 2023
cpp fundamentals and questions for beginners and intermediates

DSA 60 days Hi people! So we have started grasping dsa concepts and solving problems from 12 July. And we shall continue till September 10 Starting fr

Sushree Satarupa 211 Jan 5, 2023
Small beginners C program examples.

Small beginner C programs.

null 23 Oct 8, 2022
C++ OpenGL 3D Game Tutorial Series - Learn to code an OpenGL 3D Game in C++ from scratch

C++ OpenGL 3D Game Tutorial Series is a YouTube Tutorial Series, whose purpose is to help all those who want to take their first steps in the game dev

 PardCode 118 Dec 22, 2022
Tutorial: Writing a "bare metal" operating system for Raspberry Pi 4

Tutorial: Writing a "bare metal" operating system for Raspberry Pi 4

Adam Greenwood-Byrne 2.5k Dec 31, 2022
FFmpeg coding tutorial - learn how to code custom transmuxing, transcoding, metadata extraction, frame-by-frame reading and more

FFmpeg code examples FFmpeg coding tutorial - learn how to code custom transmuxing, transcoding, metadata extraction, frame-by-frame reading and more

Rim Zaidullin 7 Nov 29, 2022