GTK4 en Ubuntu 20.04 - Flatpak

Como seguro ya sabéis, GTK4, la última versión de la biblioteca multiplataforma para desarrollar entornos gráficos fue liberada por GNOME a finales del año pasado. Es interesante ir familiarizándose con esta nueva versión y los desarrollos que emprendamos a partir de ahora, que requieran el uso del entorno gráfico de GNOME, deberían tener el punto de mira puesto en GTK4.

Lo que ocurre es que actualmente ninguna de las distros estables de GNU/Linux incorpora por defecto esta biblioteca. Lo que vamos a ver son dos formas de poder trabajar con esta librería en nuestro sistema, en este caso voy a utilizar la última versión LTS de Ubuntu, la 20.04.

En esta primera entrada vamos a utilizar flatpak, el sistema de administración de paquetes, despliegue de software y encapsulación de aplicaciones para entornos de escritorio GNU/Linux desarrollado como parte del proyecto freedesktop.org.

En la segunda entrada veremos como instalar GTK4 directamente en nuestro equipo. Lo instalaremos en un directorio local con el fin de que no interfiera con el resto de aplicaciones, pero con las variables de entorno necesarias para que podamos hacer uso de sus librerías cuando las necesitemos.

Podemos instalar en un equipo cualquiera de ellas o las dos, pues no interfieren y nos van a ofrecer distintas posibilidades cada una de ellas.

Instalación de Flatpak

Lo primero necesitamos tener instalado flatpak:

❯ sudo apt install flatpak

Vamos a habilitar el repositorio flathub:

❯ flatpak remote-add --if-not-exists flathub https://flathub.org/repo/flathub.flatpakrepo

y el repositorio nightly de GNOME:

❯ flatpak remote-add --if-not-exists gnome-nightly https://nightly.gnome.org/gnome-nightly.flatpakrepo

Ahora en la documentación oficial de flatpak se recomienda reiniciar el sistema.

Tenemos dos repositorios, el estable flathub desde donde deberemos instalar la mayoría de las aplicaciones que queramos usar con flatpak, y el nightly que incluyen las últimas versiones de desarrollo de las aplicaciones de GNOME.

Como se indica en la documentación de GNOME, las aplicaciones en el repositorionightly se encuentran por naturaleza en un estado inestable. Son aplicaciones que se deberían poder ejecutar y realizar funciones básicas, trabajando por lo general con funcionalidad completa pero pueden presentar algunos problemas de estabilidad.

Instalación de las demos de GTK4

Vamos a instalar las demos de GTK4 que ademas de mostrar las características y opciones de la librería nos muestran el código fuente en C de cada ejemplo:

❯ flatpak install gnome-nightly org.gtk.Demo4
Looking for matches…
Required runtime for org.gtk.Demo4/x86_64/master (runtime/org.gnome.Platform/x86_64/master) found in remote gnome-nightly
Do you want to install it? [Y/n]:

org.gtk.Demo4 permissions:
    ipc           fallback-x11      wayland      x11      dri     dbus access [1]
    tags [2]

    [1] org.gtk.vfs, org.gtk.vfs.*
    [2] devel, development, nightly


        ID                                        Branch       Op       Remote              Descarga
 1. [✓] org.freedesktop.Platform.GL.default       20.08        i        gnome-nightly        95,3 MB / 95,9 MB
 2. [✓] org.freedesktop.Platform.openh264         2.0          i        gnome-nightly         1,5 MB / 1,5 MB
 3. [✓] org.gnome.Platform.Locale                 master       i        gnome-nightly         4,3 MB / 333,8 MB
 4. [✓] org.gnome.Platform                        master       i        gnome-nightly       312,2 MB / 362,4 MB
 5. [✓] org.gtk.Demo4                             master       i        gnome-nightly        26,4 MB / 31,3 MB

Installation complete.

Como vemos nos pregunta que confirmemos la instalación, contestamos Y y se inicia la descarga de la plataforma necesaria y finalmente la aplicación. 

Puede parecer algo pesado tener que descargar toda una plataforma para ejecutar una sola aplicación, pero lo cierto que esta es una forma muy útil de encapsular una aplicación junto con todas sus dependencias y posibilita a los desarrolladores poder ofrecer modificaciones que puedan ser utilizadas por los usuarios de forma inmediata sin tener que esperar a que se incluyan en los repositorios oficiales de las diferentes distros, lo que se puede demorar meses , años o no estar disponible nunca para determinadas plataformas.

Para ejecutar las aplicaciones instaladas, en este caso Demo4:

❯ flatpak run org.gtk.Demo4

GTK4Demo

Es recomendable dedicar un tiempo a revisar los ejemplos y ver las opciones disponibles. Será también un buen lugar para ver ejemplos a la hora implementar alguno de los widgets disponibles en nuestras aplicaciones.

Vamos a crear ahora una pequeña aplicación usando las librerías GTK4 desde platpak.

Instalación de Gnome-Builder

Para facilitar el trabajo de creación y construcción del proyecto vamos a utilizar Gnome-Builder. Este es un fantástico IDE de desarrollo creado por GNOME y pensado para el desarrollo de aplicaciones de propósito general en C, C++, JavaScript, Pythom, Rust, C# o Vala (entre otros), con control de versiones git, integración de debugger, profiler, inspector de d-bus, uso de glade, pruebas unitarias, autocompletado, integración con meson y otras muchas características que lo hacen un entorno completamente recomendable. Otra opción muy interesante que incorpora es el uso de diferentes asociaciones de teclas predeterminadas que permiten la emulación del editor Vim, Emacs, Sublime o de forma predeterminada Gedit.

Podemos instalar la versión estable desde flathub, la nighty o ambas. En este caso vamos a instalar la versión estable (en este momento la 3.38):

❯ flatpak install flathub org.gnome.Builder

Para ver las aplicaciones que tenemos instalas con flatpak:

❯ flatpak list --app
Nombre         Application ID          Version       Branch       Origen             Installation
Builder        org.gnome.Builder       3.38.2        stable       flathub            system
GTK Demo       org.gtk.Demo4           3.99.0        master       gnome-nightly      system

y ejecutar gnome-builder:

❯ flatpak run org.gnome.Builder

Seleccionamos Iniciar un nuevo proyecto:

Proyecto en C

gnome-builder nuevo proyecto

En este momento es posible que nos pida instalar algún SDK que falta para ese proyecto, le decimos que lo instale aunque no va ha ser el SDK para el que queremos crear nuestra aplicación GTK4.

gnome-builder instalar sdk

Si instalamos el SDK y le indicamos que construya la aplicación tendremos una ventana con la aplicación de la plantilla por defecto de aplicación GNOME.

Pero esta aplicación se ha creado para GTK3. Para usar GTK4 tenemos que hacer algunas modificaciones en el proyecto.

Lo primero tenemos que instalar el SDK necesario que nos permita compilar con GTK4, concretamente es el org.gnome.Sdk master x86_64. En preferencias (Ctrl+,):

gnome-builder instalar sdk master

Una vez instalado, vamos a las preferencias de construcción (en el botón de la izquierda o pulsando Alt+,) y seleccionamos la Rutina de la aplicación a org.gnome.Platform.master:

gnome-builder seleccionar sdk master

Volvemos al editor (Atl+1) y cambiamos las dependencias del proyecto. En el archivo src/meson.build, cambiamos dependency('gtk+-3.0', version: '>= 3.22') por dependency('gtk4'):

gnome-builder dependencias

Esto ya nos va a permitir usar las librerías GTK4. En este caso en el código de la aplicación no es necesario cambiar nada, pero si el fichero gtk4hola-window.ui con la información de los recursos para crear la ventana, ya que estos tienen variaciones desde la versión GTK3. El fichero quedaría así:

gtk4hola-window.ui
<?xml version="1.0" encoding="UTF-8"?> 
<interface> 
    <requires lib="gtk+" version="3.24"/> 
    <template class="Gtk4holaWindow" parent="GtkApplicationWindow"> 
    <property name="default-width">600</property> 
    <property name="default-height">300</property> 
    <child type="titlebar"> 
        <object class="GtkHeaderBar" id="header_bar"> 
        </object> 
    </child> 
    <child> 
        <object id="grid" class="GtkGrid"> 
        <property name="hexpand">1</property> 
        <property name="vexpand">1</property> 
        <child>  
            <object class="GtkLabel" id="label"> 
            <property name="hexpand">1</property>  
            <property name="vexpand">1</property>  
            <property name="label">Hello, GTK4!</property> 
            <property name="visible">True</property> 
            <attributes> 
                <attribute name="weight" value="bold"/> 
                <attribute name="scale" value="2"/> 
            </attributes> 
            </object>  
        </child> 
        </object> 
    </child> 
    </template> 
</interface> 

Si ejecutamos ahora nuestra aplicación tendremos corriendo una aplicación con GTK4:

Proyecto en Vala

gnome-builder vala

Se usan los mismos sdk que en la versión C, luego no tendremos que instalarlos de nuevo. Seleccionamos, al igual que hicimos antes, preferencias de construcción (en el botón de la izquierda o pulsando Alt+,) y seleccionamos la Rutina de la aplicación a org.gnome.Platform.master.

Cambiamos también en las dependencias del proyecto, en el archivo src/meson.build, cambiamos dependency('gtk+-3.0', version: '>= 3.22') por dependency('gtk4').

Vamos a cambiar también el fichero window.ui con la información de los recursos para crear la ventana, ya que estos tienen variaciones desde la versión GTK3. Para variar un poco en este ejemplo vamos a cambiar también el fichero window.vala.

Los ficheros quedarían así:

window.ui
<?xml version="1.0" encoding="UTF-8"?> 
<interface> 
    <requires lib="gtk+" version="3.99"/> 
    <template class="HolaGtk4Window" parent="GtkApplicationWindow"> 
     <property name="default-width">300</property> 
     <property name="default-height">200</property> 
     <property name="title">Hola Mundo!</property> 
         
    <child type="titlebar"> 
        <object class="GtkHeaderBar" id="headerbar"> 
        <child> 
            <object id="bTaction" class="GtkToggleButton"> 
            <property name="icon-name">media-playback-start</property> 
            <property name="valign">center</property> 
            </object> 
        </child> 
            </object> 
        </child>  
         
    <child> 
        <object id="grid" class="GtkGrid"> 
        <property name="hexpand">1</property> 
        <property name="vexpand">1</property> 
 
        <child> 
            <object id="bquit" class="GtkButton"> 
            <property name="label">Salir</property> 
            <layout> 
                <property name="column">1</property> 
                <property name="row">2</property> 
                <property name="column-span">2</property> 
            </layout> 
            </object> 
        </child> 
        <child> 
            <object id="spinner" class="GtkSpinner"> 
             <property name="hexpand">1</property>  
             <property name="vexpand">1</property>  
             <layout> 
                <property name="column">0</property> 
                <property name="row">1</property> 
                <property name="column-span">2</property> 
            </layout> 
            </object> 
        </child> 
        </object> 
    </child>  
         
    </template> 
    </interface> 

main.vala
/* main.vala 
 * 
 * Copyright 2021 david 
 * 
 * This program is free software: you can redistribute it and/or modify 
 * it under the terms of the GNU General Public License as published by 
 * the Free Software Foundation, either version 3 of the License, or 
 * (at your option) any later version. 
 * 
 * This program is distributed in the hope that it will be useful, 
 * but WITHOUT ANY WARRANTY; without even the implied warranty of 
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 
 * GNU General Public License for more details. 
 * 
 * You should have received a copy of the GNU General Public License 
 * along with this program. If not, see <http://www.gnu.org/licenses/>. 
 */ 
 
int main (string[] args) { 
    var app = new Gtk.Application ("org.example.App", ApplicationFlags.FLAGS_NONE); 
    app.activate.connect (() => { 
        var win = app.active_window; 
        if (win == null) { 
            win = new HolaGtk4.Window (app); 
        } 
        win.present (); 
    }); 
 
    return app.run (args); 
} 

window.vala
/* window.vala 
 * 
 * Copyright 2021 david 
 * 
 * This program is free software: you can redistribute it and/or modify 
 * it under the terms of the GNU General Public License as published by 
 * the Free Software Foundation, either version 3 of the License, or 
 * (at your option) any later version. 
 * 
 * This program is distributed in the hope that it will be useful, 
 * but WITHOUT ANY WARRANTY; without even the implied warranty of 
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 
 * GNU General Public License for more details. 
 * 
 * You should have received a copy of the GNU General Public License 
 * along with this program. If not, see <http://www.gnu.org/licenses/>. 
 */ 
 
namespace HolaGtk4 { 
    [GtkTemplate (ui = "/org/example/App/window.ui")] 
    public class Window : Gtk.ApplicationWindow { 
        [GtkChild] 
        unowned Gtk.Button bquit; 
        [GtkChild] 
        unowned Gtk.ToggleButton bTaction; 
        [GtkChild] 
        unowned Gtk.Spinner spinner; 
         
        public Window (Gtk.Application app) { 
            Object (application: app); 
             
            bquit.clicked.connect (() => { 
                print ("Saliendo...\n");  
                this.destroy (); 
            }); 
            bTaction.clicked.connect (() => { 
                if (bTaction.get_active () == true) { 
                    spinner.start(); 
                    bTaction.set_icon_name ("media-playback-stop");  
                } else { 
                    spinner.stop(); 
                    //bTaction.set_label ("Empezar");  
                    bTaction.set_icon_name ("media-playback-start");  
                }  
            });  
        } 
    } 
} 

Ejecutamos y tendremos nuestro proyecto usando GTK4 en Vala:

Conclusión

Hemos visto como crear aplicaciones en C y Vala que utilicen la librería GTK4 usando flatpak. Para crear aplicaciones usando este sistema no hemos tenido que instalar nada más que los paquetes del propio flatpak y todo lo demás lo hemos instalado dentro del propio entorno de flatpak. Es una forma útil y ordenada de tener diferentes entornos de desarrollo y sobre todo una forma estupenda de distribuir aplicaciones con todas sus dependencias. Como siempre, es interesante y recomendable consultar la documentación oficial del proyecto.

En la siguiente entrada veremos como instalar las librerías directamente en una carpeta del sistema y como modificar determinadas variables de entorno para poder hacer uso de ellas en nuestra aplicaciones GTK4.

Modificado por última vez enMartes, 23 Marzo 2021 10:17
(2 votos)
Etiquetado como :

Deja un comentario

Asegúrese de introducir toda la información requerida, indicada por un asterisco (*). No se permite código HTML.