Category: Gtk 4

Cambalache 0.12.0 Released!

I am pleased to announce a new release of Cambalache a new RAD tool for Gtk 3 and 4!

Version 0.12.0 packs a year’s worth of new features and lots of improvements and bugfixes.

Workspace CSS support

Does your application use custom CSS? Now you can see CSS changes live in the workspace. All you need to do is add a new CSS file in the project and specify if you want it to be global or for one UI file in particular.

Keep in mind that GtkBuilder does not support CSS inline so your application still needs to load the CSS at runtime.

GtkBuildable Custom Tags

In an ideal world object properties would be enough to define your application UI but in reality it is not, so Gtk Widgets can define customs tags in their GtkBuildable implementation such as GtkWidget <style> or GtkComboBoxText <items>

This feature was missing in Cambalache, mostly because I do not want to add custom code to handle each case one by one, as you can imagine this would become really hard to keep up and maintain.

So I decided on a generic component that relies on minimum metadata to create the UI automatically. So let me know if your favorite Class is missing a custom tag!

Property Bindings

Another important feature missing is setting up properties binding directly in the property. While technically it was always possible to create a GBinding object, clicking on a property label and selecting the source object and property is much easier.

User Templates

Back in the day one of the main features of Glade 3 was being able to extend the widgets available to use without having to modify the source code. This was done by creating a XML widget catalog unfortunately this is a high bar for every application as it required not only writing an XML file describing all the metadata but also having a library to load the new types.

Having all of your application’s UI files in the same project allows exposing all the templates for use without any extra steps, all you need to do is have all your templates types in the same project and you will be able to use them immediately.

The only current limitation is that you wont be able to use any custom properties since they are defined in code and Cambalache does not have access to the GType. For that we still going to need to create a catalog file similar to Glade.

XML Fragments

Have you ever been in the position where you are forced to write the whole UI XML file by hand just because the shiny new (or old) feature you need is not supported?

Fear no more!! Custom XML fragments comes to the rescue!

This new feature sounds fancy but it just a way to manually define any XML fragment that you want to append to an object or UI even if it is not valid GtkBuilder.

This should be handy in lots of different situation from defining <menu> objects to setting custom properties in your customs widgets!

External object references

GtkBuilder lets you expose external objects to be reference inside the XML description, but Cambalache does not export broken references, instead it will let you declare which external object you will expose in your application using a special type “(external)” that only let you define its id.

Where to get it?

You can download the flatpak bundle from flathub

flatpak install --user flathub ar.xjuan.Cambalache

Run this first if you do not have flathub repo in your host

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

You can also get the source code from gitlab (see README.md for instructions)

git clone https://gitlab.gnome.org/jpu/cambalache.git

BTW I will be making point releases as soon as translations are updated!

enjoy!

 

Juan Pablo

Cambalache 0.10.0 is out!

3rd party libs release!

After almost 6 months of work I am pleased to announce a new Cambalache release!

Adwaita and Handy support

This cycle main focus was to add support for 3rd parties libraries and what better than Adwaita and Handy to start with.

Keep in mind that workspace support for new widgets is minimal which means you should be able to create all widgets and set its properties but some widgets might not show correctly in the workspace or lack placeholder support, please file an issue if you find something!

Inline object properties support

One of the new features in Gtk 4 is the ability to define a new object directly in a property instead of using a reference.

 <object class="GtkWindow">
   <property name="child">
     <object class="GtkLabel">
       <property name="label">Hola Mundo</property>
     </object>
   </property>
 </object>

You will be able to create such object by clicking in the + icon of the object property and the child will appear in the hierarchy with the property name as prefix.

Special child type support

An important missing feature was being able to define special child type which is needed for things like setting a titlebar widget in a window.

<object class="GtkWindow">
   <child type="titlebar">
     <object class="GtkHeaderBar"/>
   </child>
 </object>

Now all you have to do is add the widget as usual and set the special type in the layout tab!

New Property Editors

From now on you will not have to remember all the icon names just select the icon you want with the new chooser popover.

GdkColor and GdkRgba properties are also supported using a color button chooser.

Child reordering support

Some times the order of serialization matter a lot specially when there is no layout/packing property to define the order of children, this is why now you can reorder children serialization position directly in the hierarchy!

Full Release Notes

  • Add Adwaita and Handy library support
  • Add inline object properties support (only Gtk 4)
  • Add special child type support (GtkWindow title widget)
  • Improve clipboard functionality
  • Add support for reordering children position
  • Add/Improve workspace support for GtkMenu, GtkNotebook, GtkPopover, GtkStack, GtkAssistant, GtkListBox, GtkMenuItem and GtkCenterBox
  • New property editors for icon name and color properties
  • Add support for GdkPixbuf, Pango, Gio, Gdk and Gsk flags/enums types
  • Add Ukrainian translation (Volodymyr M. Lisivka)
  • Add Italian translation (capaz)
  • Add Dutch translation (Gert)

 

Cambalache is still in heavy development so if you find something that does not work please file a bug here

Matrix channel

Have any question? come chat with us at #cambalache:gnome.org

Where to get it?

Download source from gitlab

git clone https://gitlab.gnome.org/jpu/cambalache.git

or the bundle from flathub

flatpak remote-add --user --if-not-exists flathub https://flathub.org/repo/flathub.flatpakrepo
flatpak install --user flathub ar.xjuan.Cambalache

Happy coding!

Cambalache 0.8.0 released!

Cambalache is a new RAD tool for Gtk 4 and 3 with a clear MVC design and data model first philosophy.

Exactly one year ago I made the first commit…

commit 51d4185cd8556f0358cc463578df5a4138ac90b5
Author: Juan Pablo Ugarte
Date: Wed Dec 9 19:14:53 2020 -0300

Initial commit

Supports type system and interface data model.
Basic history (undo/redo stack) implementation with triggers.

It consisted of just 3 files, the data model, a python script to generate history triggers automatically and a small sql script to test it.

Fast forward one year and I am starting to believe it can be on feature parity with Glade sooner than expected.

Having a pretty solid backend this release focus on adding all the big missing UX parts, like a good type selector, workspace placeholders and basic clipboard actions like copy/paste.

Type chooser bar

Borrowing the design from Glade I implemented a type chooser that categorizes object classes to make it easier to find what you need.

Workspace placeholders

Containers now have placeholders to make it easier to add children in a specific positions

It supports the following actions:

  • Double click on a placeholder to create a new widget in place
  • <Control> + Insert to add more placeholders
  • <Control> + Delete to remove placeholders
  • <Shift><Control> + Insert to add a new row
  • <Shift><Control> + Delete to remove a row

Translatable properties

Thanks to the work of Philipp Unger it is possible to mark properties as translatable and add comments for translators.

Clipboard actions

To make life easier, common clipboard actions like, Copy, Paste, Cut and Delete where added.

Better unsupported features report

Cambalache will make its best effort to notify the user about unsupported features when importing UI files and export to a different filename as a precaution to avoid loosing data.

Matrix channel

Have any question? come chat with us at #cambalache:gnome.org

Where to get it?

As always you can get the code in gitlab

git clone https://gitlab.gnome.org/jpu/cambalache.git

or download the bundle from flathub

flatpak remote-add --user --if-not-exists flathub https://flathub.org/repo/flathub.flatpakrepo
flatpak install --user flathub ar.xjuan.Cambalache

UPDATE: Version 0.8.1 released!

 

Happy coding!

Milonga in Flathub!

Cambalache 0.7.4 is now available in Flathub here

For the impatient, simply run this to install it:

flatpak install --user flathub ar.xjuan.Cambalache

Cambalache is a new RAD tool that enables the creation of user interfaces for Gtk and the GNOME desktop environment. It’s main target is Gtk 4 but it has been designed from the ground up to support other versions. It is released under LGPL v2.1 license and you can get the source code and file issues here

These are the relevant new features:

  • Interactive introduction
  • Workspace Gtk theme selection
  • Template support
  • New translations, German and Czech
  • Sponsors credit section

Interactive Introduction

Even tough the workflow is similar to Glade, there are some key differences like multiple UI files support in the same project, which means new concepts like import and export where introduced. Since I do not like writing documentation, who does? I made an interactive tutorial to show up the work flow.

Workspace Gtk theme

Would not be nice to have a way to easily change the theme of your app to see how it looks?

Thanks to rendering widgets out of process, setting a different theme for the workspace is trivial to implement. All I had to do is set the theme name in the renderer’s GtkSetting. Keep in mind that flatpak application can not access your host themes, you have to install flatpak Gtk theme extensions!

Template support

All modern applications should use templates extensively! So 0.7.4 has basic support for templates, all you have to do it toggle the Object Id check button of the toplevel widget you want as your template. In the near future I will add the option to use all the templates in a project as just another widget class.

New translations

Thanks to two new contributors Phil and Vojtěch Cambalache now has 3 translations.

  • de by PhilProg
  • cs by Vojtěch Perník
  • es

If you want to see it translated in your language, open an issue with a new MR and I will merge it asap.

Sponsors Credits Section

You can financially support development on Patreon, other options like Liberapay are under consideration.

My goal is to have a steady stream of donations so that I can dedicate at least one day a week to development and hire a part time QA engineer. This would help ensure continuous improvements and keep up with bugs reports.

So many many thanks to all the people that supports Cambalache!

  • Patrick Griffis
  • Platon workaccount
  • Sonny Piers
  • Felipe Borges
  • Javier Jardón

 

Merengue: Cambalache’s workspace

Lemon pie with Italian meringueCambalache is a new RAD tool that enables the creation of user interfaces for Gtk and the GNOME desktop environment, it’s main focus is on the newly released Gtk 4 library but it has been designed from the ground up to support other versions.

It started as a proof of concept data model for Glade meant to try out all the crazy ideas I had during the years about how a clean model should be.

A few months later I had a pretty good data model that matched GObject type system quite well and did not depend on GtkBuilder nor GObject.

The model could:

  • Import and export multiple UI at once
  • Support plain (no custom tags) GtkBuilder features
    • Objects
    • Properties
    • Signals
    • Children
    • Packing/layout properties
  • Undo / Redo stack
  • History command compression and grouping

With that in mind one late night while holding my newborn daughter in one hand, I decided it was time to put it to test so I fired up Glade with the other hand and started a GUI prototype which quickly evolved into Cambalache, as my few dozen Twitter followers can assess. @XjuanAr

At this point the GUI supported most of the data model features.

One big difference with Glade is that Cambalache supports multiple UI in the same project so you need to ‘export all’ in order to create them as you can see at the end of the screencast bellow.

At this point I had a very specialized XML editor but… there is always a but, what about the workspace? the place where the UI is shown, rearranged, edited…

For the workspace my requirements are:

  • It should look and feel as close to the real UI as possible
  • Support multiple toolkits (Gtk 3, 4, 2 if really needed, libreoffice?)
  • Out of process to avoid loosing data on an eventual crash
  • It should look and feel as close to the real UI as possible, really!

Obviously adding the widgets directly like we did in Glade would not work if we want to support more than one version of Gtk since you can not mix them in the same process.

So we need a way to render widgets in a different process and show them somehow in the workspace… GtkPlug/GtkSocket would only work on X11.

Merengue enters the picture!

Fortunately this was not the first time I had to deal with such problem (See Maxwell) this reminded me of Alexander Larsson’s excellent project called Broadway a Gdk backend for the web. Ideally I would use an embedded Wayland compositor widget instead of a webview and broadway, but unfortunately there is only an old non working prototype called Wakefield and finishing it is a project on its own. In any case replacing the webview with a wayland compositor widget would be trivial.

Merengue is the name of the process Cambalache uses to render the UI while the user creates it, it is a regular Gtk 3 or Gtk 4 application depending on the version your project is targeting that just connects to Broadway and talks to the main application in JSON trough stdout/stdin pipes.

I will be talking more about Cambalache and the rationale behind starting a new project instead of porting Glade at GUADEC

See you there!

UPDATE: Cambalache source code released under the LGPL 2.1, get it here!