Essa nova linguagem de marcação é desenvolvida e mantida por James Westman e o seu principal objeto é ser uma linguagem fácil de aprender e que permita a construção de interfaces gráficas de forma rápida e declarativa.

É importante notar que a linguagem de marcação Blueprint não vem para substituir o padrão atual de construção de interfaces gráficas no GTK.

Assim como em outros ambientes gráficos e linguagens de programação, o GTK utiliza o padrão XML para construção da parte visual dos aplicativos.

Este é um formato amplamente utilizado e bem aceito no geral, contudo ele tende a ser difícil de ser ler e modificar manualmente.

Com isso temos uma curva de aprendizado grande e em muitos casos existe a necessidade de se utilizar softwares que permitam o desenvolvimento das interfaces gráficas de forma visual.

Alguns exemplos desses softwares para GTK são:

• Cambalache.

• Drafting.

• Glade. Não é recomendada a sua utilização para o desenvolvimento com GTK 4.

Para amenizar essas dificuldades é que nasce a ideia da linguagem de marcação Blueprint.

Para ficar mais claro vamos analisar o código da seguinte interface gráfica em ambas as linguagens de marcação:

Na imagem acima temos basicamente uma janela e um menu na barra de título.

Para descrever essa interface em XML (*.ui) temos o seguinte código:

<?xml version="1.0" encoding="UTF-8"?>
<interface>
    <requires lib="gtk" version="4.0"/>
    <template class="ExampleWindow" parent="GtkApplicationWindow">
        <property name="title">Python e GTK 4: PyGObject Gtk.ApplicationWindow() ui file.</property>
        <property name="default-width">683</property>
        <property name="default-height">384</property>
        <child type="titlebar">
            <object class="GtkHeaderBar" id="header_bar">
                <child type="end">
                    <object class="GtkMenuButton">
                        <property name="icon-name">open-menu-symbolic</property>
                        <property name="menu-model">primary_menu</property>
                    </object>
                </child>
            </object>
        </child>
    </template>

    <menu id="primary_menu">
        <section>
            <item>
                <attribute name="label" translatable="yes">_Preferences</attribute>
                <attribute name="action">app.preferences</attribute>
            </item>
        </section>
    </menu>
</interface>

A mesma interface gráfica na linguagem de marcação Blueprint (*.blp) tem o seguinte código:

using Gtk 4.0;

template ExampleWindow : ApplicationWindow {
  title: "Python e GTK 4: PyGObject Gtk.ApplicationWindow() ui file.";
  default-width: 683;
  default-height: 384;

  [titlebar]
  HeaderBar header_bar {
    [end]
    MenuButton {
      icon-name: "open-menu-symbolic";
      menu-model: primary_menu;
    }
  }
}

menu primary_menu {
  section {
    item {
      label: _("_Preferences");
      action: "app.preferences";
    }
  }
}

Como podemos ver o código da interface gráfica se torna bem mais legível e simples com a linguagem de marcação Blueprint.

Assim como toda tecnologia existem pontos positivos e negativos em sua utilização.

O ponto negativo da linguagem de marcação Blueprint é que o arquivo *.blp não será lindo diretamente pelo GtkBuilder.

Para o GtkBuilder temos que passar um arquivo de interface do tipo *.ui.

Isso significa que o arquivo *.blp sempre será convertido para *.ui, obviamente que isso não é um problema se a rotina de conversão dos arquivos for automatizada.

Com relação a essa automação, é importante citar que a linguagem de marcação Blueprint possui uma excelente integração com o Gnome Builder.

Através da ferramenta de linha de comando (CLI) é possível realizar as configurações necessárias para automatizar todo o processo de conversão no Gnome Builder 😍.

O CLI também possui suporte para projetos que não utilizam o Gnome Builder, entretanto pode ser necessário desenvolver os processos que permitirão para a conversão dos arquivos *.blp para *.ui.

Bom agora vamos ver como instalar o compilador da linguagem de marcação Blueprint e como configurar a mesma no Gnome Builder 🚀.

---

blueprint-compiler

Instalação

Arch Linux

• Site oficial do Arch Linux.

sudo pacman -S \
blueprint-compiler

🚨 Se o sudo não estiver configurado utilize a conta de root para a instalação dos pacotes.

Debian

• Site oficial do Debian.

sudo apt install \
blueprint-compiler

Fedora

• Site oficial do Fedora.

sudo dnf install \
blueprint-compiler

openSUSE Tumbleweed

• Site oficial do openSUSE Tumbleweed.

sudo zypper install \
blueprint-compiler

Ubuntu

• Site oficial do Ubuntu.

sudo apt install \
blueprint-compiler

Microsoft Windows

Para realizar a instalação do compilador Blueprint no Microsoft Windows é necessário que o MSYS2 esteja instalado e configurado.

• Desenvolvendo com Python e o toolkit GTK no MS Windows.

Abra o terminal do MSYS2 e instale as seguinte dependências:

pacman -S \
mingw-w64-x86_64-blueprint-compiler

---

Instalação via código fonte

Dependências

Arch Linux

• Site oficial do Arch Linux.

sudo pacman -S \
meson

Debian

• Site oficial do Debian.

sudo apt install \
meson \
ninja-build

Fedora, Centos, RHEL e derivados:

Site oficial do Fedora.

sudo dnf install \
meson \
ninja-build

openSUSE Tumbleweed

• Site oficial do openSUSE Tumbleweed.

sudo zypper install \
meson \
ninja

Ubuntu:

• Site oficial do Ubuntu.

sudo apt install \
meson \
ninja-build

Microsoft Windows

Para realizar a instalação do compilador Blueprint no Microsoft Windows é necessário que o MSYS2 esteja instalado e configurado.

Abra o terminal do MSYS2 e instale as seguinte dependências:

pacman -S \
git \
mingw-w64-x86_64-meson \
mingw-w64-x86_64-ninja

Instalação

Assim que as dependências estiverem instaladas abra o terminal MinGW64 e clone o repositório do blueprint-compiler:

git clone https://gitlab.gnome.org/jwestman/blueprint-compiler.git

Independente do sistema operacional, acesse a pasta que foi clonada:

cd blueprint-compiler

Ao acessar a pasta execute o comando:

meson _build

Assim que o comando acima terminar execute:

ninja -C _build install

Ao final do processo o compilador da linguagem de marcação Blueprint estará instalado e poderá ser utilizado através do terminal MinGW64:

Comando blueprint-compiler sendo executado no terminal MSYS2 MINGW64.

---

Gnome builder

No Gnome Builder temos o melhor ambiente para utilização da linguagem de marcação Blueprint.

Isso porque o sistema de build meson e ninja permitem a automação do processo de conversão de *.blp para *.ui.

Para iniciar a configuração da linguagem de marcação Blueprint, abra um terminal na raiz do projeto e execute o comando:

blueprint-compiler port

Ao executar o comando acima será iniciado um passo a passo.

Passo 01:

STEP 1: Create subprojects/blueprint-compiler.wrap
Create subprojects/blueprint-compiler.wrap? [y/n] y

Responda y para confirmar a criação de uma pasta chamada subprojects na raiz do projeto e com isso também será criado um arquivo chamado blueprint-compiler.wrap dentro da pasta.

Passo 02:

STEP 2: Set up .gitignore
Create .gitignore with '/subprojects/blueprint-compiler'? [y/n] n

Se o projeto já possui um arquivo .gitignore responda n e posteriormente adicione /subprojects/blueprint-compiler ao seu arquivo .gitignore.

Passo 03:

STEP 3: Convert UI files
will port ./src/gtk/help-overlay.ui -> ./src/gtk/help-overlay.blp
will port ./src/window.ui -> ./src/window.blp

All files were converted.
Save these changes? [y/n] y

Serão listados os arquivos de interface que serão convertidos para *.blp, se estiver tudo correto responda y.

Passo 04:

STEP 4: Set up meson.build
NOTE: Depending on your build system setup, you may need to make some adjustments to this step.
Paste the following into ./src/meson.build:

blueprints = custom_target('blueprints',
  input: files(
    'gtk/help-overlay.blp',
    'window.blp',
  ),
  output: '.',
  command: [find_program('blueprint-compiler'), 'batch-compile', '@OUTPUT@', '@CURRENT_SOURCE_DIR@', '@INPUT@'],
)

Press Enter when you have done that: 
Paste the following into the 'gnome.compile_resources()'
arguments in ./src/meson.build:

dependencies: blueprints,

Press Enter when you have done that:

Agora temos uma etapa extremamente importante, vamos configurar a linguagem de marcação Blueprint no sistema de build meson.

Isso irá permitir que os arquivos *.blp sejam localizados e convertidos para *.ui.

Se a configuração estiver incorreta o projeto não funcionará de forma adequada.

Como solicitado no terminal abra o arquivo meson.build que está na pasta src e adicione:

blueprints = custom_target('blueprints',
  input: files(
    'gtk/help-overlay.blp',
    'window.blp',
  ),
  output: '.',
  command: [find_program('blueprint-compiler'), 'batch-compile', '@OUTPUT@', '@CURRENT_SOURCE_DIR@', '@INPUT@'],
)

📝 Sempre que novos arquivos *.blp forem criados, os mesmos DEVEM ser declarados em input: files().

Neste mesmo arquivo (meson.build) localize o argumento gnome.compile_resources() e adicione o seguinte código:

dependencies: blueprints,

Ao finalizar a edição, salve o arquivo e retorne para o terminal.

Passo 05:

STEP 5: Update POTFILES.in
po/POTFILES.in does not exist, skipping

Como não existam arquivos de tradução o próprio passo a passo ignora essa etapa.

Passo 06:

STEP 6: Clean up
Delete old XML files? [y/n] y
STEP 6: Done! Make sure your app still builds and runs correctly.

Nesta última etapa o passo a passo pergunta se desejamos excluir os arquivos *.ui.

Eu recomendo que você remova os mesmos, contudo se estive inseguro responda n e posteriormente remova esses arquivos manualmente.

Com isso a etapa de configuração está completa 🎉.

Instalar o blueprint-compiler

Para finalizar precisamos instalar o compilador (blueprint-compiler).

Esse processo também é bem simples no Gnome Builder

Abra o arquivo de manifesto que fica na raiz do projeto (*.json), neste arquivo procure pela chave "modules".

Ao localizar a chave adicione no começo dela o seguinte trecho código:

{
  "name": "blueprint-compiler",
  "buildsystem": "meson",
  "sources": [
    {
      "type": "git",
      "url": "https://gitlab.gnome.org/jwestman/blueprint-compiler",
      "branch": "main"
    }
  ]
},

Com isso o Gnome Builder estará configurado para utilizar a linguagem de marcação Blueprint.

Todo o processo de conversão dos arquivos de interface de *.blp para *.ui estará devidamente automatizado 🤩:

---

Extra

Extensões

• GNU Emacs (DrBluefall).

• Visual Studio Code (Bodil Stokke)

• VIM (thetek42).

• VIM (gabmus).

---

Principais comandos

Iniciar um passo a passo para configuração do projeto:

blueprint-compiler port

Para converter um arquivo *.blp para *.ui:

blueprint-compiler compile MainWindow.blp --output MainWindow.ui

📝 Utilize a flag --help para ver mais opções.

---