# Julia Package for UI development

**URL:** <https://discourse.julialang.org/t/julia-package-for-ui-development/39469>\
**Category:** Visualization\
**Tags:** question, guis\
**Created:** [May 14, 2020, 1:58pm UTC](https://discourse.julialang.org/t/julia-package-for-ui-development/39469 "2020-05-14T13:58:32Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![saraflgarcia](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/saraflgarcia/32/14847_2.png) [@saraflgarcia](https://discourse.julialang.org/u/saraflgarcia)\
**Post date:** [May 14, 2020, 1:58pm UTC](https://discourse.julialang.org/t/julia-package-for-ui-development/39469/1 "2020-05-14T13:58:32Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![logankilpatrick](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/logankilpatrick/32/38123_2.png) [@logankilpatrick](https://discourse.julialang.org/u/logankilpatrick)\
**Post date:** [May 14, 2020, 3:05pm UTC](https://discourse.julialang.org/t/julia-package-for-ui-development/39469/2 "2020-05-14T15:05:36Z")

</div>

Hey Sara, welcome.

Check out this article I wrote: [6 Julia Frameworks to Create Desktop GUI’s and Web Apps | by Logan Kilpatrick | Towards Data Science](https://logankilpatrick.medium.com/6-julia-frameworks-to-create-desktop-guis-and-web-apps-9ae1a941f115)

I suggest also checking out:

- Makie.jl: [GitHub - JuliaPlots/Makie.jl: High level plotting on the GPU.](https://github.com/JuliaPlots/Makie.jl)
- GTK.jl: [GitHub - JuliaGraphics/Gtk.jl: Julia interface to Gtk windowing toolkit.](https://github.com/JuliaGraphics/Gtk.jl)
- Interact.jl: [GitHub - JuliaGizmos/Interact.jl: Interactive widgets to play with your Julia code](https://github.com/JuliaGizmos/Interact.jl)
- Dash.jl: [GitHub - plotly/Dash.jl: Dash for Julia - A Julia interface to the Dash ecosystem for creating analytic web applications in Julia. No JavaScript required.](https://github.com/plotly/Dash.jl)
- Blink.jl: [https://github.com/JuliaGizmos/Blink.jl](https://github.com/JuliaGizmos/Blink.jl)
- MakieLayout.jl: [GitHub - jkrumbiegel/MakieLayout.jl: Layouting for Makie.jl](https://github.com/jkrumbiegel/MakieLayout.jl)
- Genie.jl: [GitHub - GenieFramework/Genie.jl: 🧞The highly productive Julia web framework](https://github.com/GenieFramework/Genie.jl)

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.

---

<div class="post-metadata">

**Author:** ![Iulian.Cioarca](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/iulian.cioarca/32/30166_2.png) [@Iulian.Cioarca](https://discourse.julialang.org/u/Iulian.Cioarca)\
**Post date:** [May 14, 2020, 3:20pm UTC](https://discourse.julialang.org/t/julia-package-for-ui-development/39469/3 "2020-05-14T15:20:29Z")

</div>

Here is a quick example using [Gtk.jl](https://github.com/JuliaGraphics/Gtk.jl) and [GtkReactive.jl](https://github.com/JuliaGizmos/GtkReactive.jl) . This is desktop based. Please keep in mind that if you use Gtk on Windows, your REPL will become a bit sluggish:

```julia
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 [GitHub - Gnimuc/CImGui.jl: Julia wrapper for cimgui](https://github.com/Gnimuc/CImGui.jl), for hardcore stuff.

---

<div class="post-metadata">

**Author:** ![logankilpatrick](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/logankilpatrick/32/38123_2.png) [@logankilpatrick](https://discourse.julialang.org/u/logankilpatrick)\
**Post date:** [January 6, 2022, 2:14pm UTC](https://discourse.julialang.org/t/julia-package-for-ui-development/39469/4 "2022-01-06T14:14:29Z")

</div>

I ended up making a medium post on this: [6 Julia Frameworks to Create Desktop GUI’s and Web Apps | by Logan Kilpatrick | Towards Data Science](https://logankilpatrick.medium.com/6-julia-frameworks-to-create-desktop-guis-and-web-apps-9ae1a941f115)