Julia Package for UI development

Hi everyone,

I want to develop a GUI written in Julia, with the following requirements:
Widgets: top menu, tabs, checkboxes, radio button, range sliders, text-fields
Widgets state: enabled/disabled, hidden/unhidden

I need your advice about the best Julia package to develop my GUI (preferable web-based but can also be desktop-based).

Thank you so much,
Sara

2 Likes

Hey Sara, welcome.

I suggest checking out:

I am probably missing a few but this is at least the start of where you should look. There are tons of tradeoffs for each so the right one depends on your use case.

3 Likes

Here is a quick example using Gtk.jl and GtkReactive.jl . This is desktop based. Please keep in mind that if you use Gtk on Windows, your REPL will become a bit sluggish:

using Gtk
using Gtk.ShortNames, GtkReactive

# Init GUI objects
win     = GtkWindow("GUI", 600, 600);
g       = GtkGrid();
c       = canvas(UserUnit,400,400);
# Text label
label   = GtkLabel("Welcome")
# Buttons
b1  = GtkButton("B1");
b2  = GtkButton("B2");
b3  = GtkButton("Fill");
b4  = GtkButton("B4");
b5  = GtkButton("B5");

# Dropdown menu with labels
c_b     = GtkComboBoxText();
push!(c_b,"none");
for x in ["apples","oranges","blah"]
    push!(c_b,x)
end
set_gtk_property!(c_b,:active,1);#set the active element

# Set layout
g[1:2,1] = label;   # Cartesian coordinates, g[x,y]
g[1,2] = b1;
g[2,2] = b2;
g[1,3] = b4;
g[2,3] = b5;
g[1,4] = b3;
g[2,4] = c_b;
g[1:2,5] = c;
set_gtk_property!(g, :column_homogeneous, true);
set_gtk_property!(g, :column_spacing, 15);  # introduce a 15-pixel gap between columns
# Build and show
push!(win, g);
showall(win);

# Callbacks
function btn_1(w1)
	println("button 1 pressed")
end
signal_connect(btn_1, b1, "clicked")

function btn_2(w2)
	println("button 2 pressed")
end
signal_connect(btn_2, b2, "clicked")

function btn_3(w3)
	@guarded draw(c) do widget
    ctx = getgc(c)
    h = height(c)
    w = width(c)
    # Paint red rectangle
    rectangle(ctx, 0, 0, w, h/2)
    set_source_rgb(ctx, 1, 0, 0)
    fill(ctx)
    # Paint blue rectangle
    rectangle(ctx, 0, 3h/4, w, h/4)
    set_source_rgb(ctx, 0, 0, 1)
    fill(ctx)
	end
	show(c);
end
signal_connect(btn_3, b3, "clicked")

function btn_4(w4)
    GAccessor.text(label,"this button does something")
end
signal_connect(btn_4, b4, "clicked")

function btn_5(w5)
    # get text
    txt_from_dropdown = Gtk.bytestring(GAccessor.active_text(c_b))
    GAccessor.text(label,"you selected:"*txt_from_dropdown)
end
signal_connect(btn_5, b5, "clicked")

There is also https://github.com/Gnimuc/CImGui.jl, for hardcore stuff.

5 Likes