Very simple, terse and easy GUI programming “frameworks”

User InterfaceScriptingOpen SourceDeclarative

User Interface Problem Overview


Please list GUI programming libraries, toolkits, frameworks which allow to write GUI apps quickly. I mean in such a way, that

  • GUI is described entirely in a human-readable (and human-writable) plain text file (code)
  • code is terse (1 or 2 lines of code per widget/event pair), suitable for scripting
  • structure and operation of the GUI is evident from the code (nesting of widgets and flow of events)
  • details about how to build the GUI are hidden (things like mainloop, attaching event listeners, etc.)
  • auto-layouts are supported (vboxes, hboxes, etc.)

As answers suggest, this may be defined as declarative GUI programming, but it is not necessarily such. Any approach is OK if it works, is easy to use and terse.

There are some GUI libraries/toolkits like this. They are listed below. Please extend the list if you see a qualifying toolkit missing. Indicate if the project is crossplatform, mature, active, and give an example if possible.

Please use this wiki to discuss only Open Source projects.

This is the list so far (in alphabetical order):

Fudgets

Fudgets is a Haskell library. Platform: Unix. Status: Experimental, but still maintained. An example:

  import Fudgets
  main = fudlogue (shellF "Hello" (labelF "Hello, world!" >+< quitButtonF))

Fudgets example screenshot
(source: picamatic.com)

GNUstep Renaissance

Renaissance allows to describe GUI in simple XML. Platforms: OSX/GNUstep. Status: part of GNUstep. An example below:

<window title="Example">
  <vbox>
    <label font="big">
      Click the button below to quit the application
    </label>
    <button title="Quit" action="terminate:"/>
  </vbox>
</window> 

Renaissance example screenshot
(source: picamatic.com)

HTML

HTML-based GUI (HTML + JS). Crossplatform, mature. Can be used entirely on the client side.

Looking for a nice “helloworld” example.

HTML GUI example
(source: picamatic.com)

JavaFX

JavaFX is usable for standalone (desktop) apps as well as for web applications. Not completely crossplatform, not yet completely open source. Status: 1.0 release. An example:

  Frame {
    content: Button {
      text: "Press Me"
      action: operation() {
         System.out.println("You pressed me");
      }
    }
    visible: true
  }

Screenshot is needed.

Phooey

Phooey is another Haskell library. Crossplatform (wxWidgets), HTML+JS backend planned. Mature and active. An example (a little more than a helloworld):

  ui1 :: UI ()
  ui1 = title "Shopping List" $
        do a <- title "apples"  $ islider (0,10) 3
           b <- title "bananas" $ islider (0,10) 7
           title "total" $ showDisplay (liftA2 (+) a b)

Phooey example screenshot
(source: picamatic.com)

PythonCard

PythonCard describes GUI in a Python dictionary. Crossplatform (wxWidgets). Some apps use it, but the project seems stalled. There is an active fork.

I skip PythonCard example because it is too verbose for the contest.

PythonCard example screenshot
(source: picamatic.com)

Shoes

Shoes for Ruby. Platforms: Win/OSX/GTK+. Status: Young but active. A minimal app looks like this:

  Shoes.app {
     @push = button "Push me"
     @note = para "Nothing pushed so far"
     @push.click {
        @note.replace "Aha! Click!"
     }
  }

Shoes example screenshot
(source: picamatic.com)

Tcl/Tk

Tcl/Tk. Crossplatform (its own widget set). Mature (probably even dated) and active. An example:

  #!/usr/bin/env wish
  button .hello -text "Hello, World!" -command { exit }
  pack .hello
  tkwait window .

Tcl/Tk example screenshot
(source: picamatic.com)

tekUI

tekUI for Lua (and C). Platforms: X11, DirectFB. Status: Alpha (usable, but API still evolves). An example:

  #/usr/bin/env lua
  ui = require "tek.ui"
  ui.Application:new {
    Children = {
      ui.Window:new  {
        Title = "Hello",
        Children = {
          ui.Text:new {
            Text = "_Hello, World!", Style = "button", Mode = "button",
          },
        },
      },
    },
  }:run()

tekUI helloworld screenshot
(source: picamatic.com)

Treethon

Treethon for Python. It describes GUI in a YAML file (Python in a YAML tree). Platform: GTK+. Status: work in proress. A simple app looks like this:

  _import: gtk
  view: gtk.Window()
  add:
      - view: gtk.Button('Hello World')
        on clicked: print view.get_label()

Treethon helloworld screenshot

Yet unnamed Python library by Richard Jones:

This one is not released yet. The idea is to use Python context managers (with keyword) to structure GUI code. See Richard Jones' blog for details.

with gui.vertical:
    text = gui.label('hello!')
    items = gui.selection(['one', 'two', 'three'])
    with gui.button('click me!'):
        def on_click():
            text.value = items.value
            text.foreground = red
XUL

XUL + Javascript may be used to create stand-alone desktop apps with XULRunner as well as Mozilla extensions. Mature, open source, crossplatform.

  <?xml version="1.0"?>
  <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
  <window id="main" title="My App" width="300" height="300"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
    <caption label="Hello World"/>
  </window>

XUL helloworld example
(source: picamatic.com)


Thank your for contributions!

User Interface Solutions


Solution 1 - User Interface

Not to kid, but HTML.

It's cross-platform, and sums up the gui-layout in a simple textfile. It's definitely mature, as well as well-understood and well documented.

There's a bunch of ways to template HTML files for dynamic content, and other ways to convert custom syntaxes to HTML if you dislike angle-brackets.

Client-side scripting w/ Javascript, server-side scripting with PHP/Ruby/Python/Perl.

It's not well suited for all purposes, but for many, it's good enough. There's no reason that it has to be served either - you can distribute a HTML file to your clients if you want - see TiddlyWiki for a good example of where that can go.

Solution 2 - User Interface

What you're describing is, with the exception of shoes, the new-fangled notion of declarative programming. I'd describe shoes more as a GUI Domain-Specifc Language. Well, I say new-fangled: Visual Basic forms, if you looked behind the IDE designer, were declarative. So, going further back still, were Oracle's SQL*Forms, although assembling them with a text editor was a process only to be be undertaken by the very bravest.

To add another to the list, Microsoft have XAML which, among other things, describes GUIs built for the WPF.

Although some of the schemes mentioned are fairly simple, declaratively-defined GUIs can be as complex as anything defined in code, they're just easier and terser: they say "what" you want to happen and leave it to the underlying framework to handle the "how".

Solution 3 - User Interface

TCL/TK is a script language used for building GUI interactively. It is available on various platforms including Unix, Windows and Mac OS X.

Solution 4 - User Interface

Pyjamas - http://pyjs.org">http://pyjs.org</a> - it's a desktop widget set, disguised as an AJAX-based web 2.0 widget set. it's so very much NOT like a web widget set that i actually ported it to the desktop - http://pyjd.org">http://pyjd.org - using webkit (the same engine in adobe AIR, google chrome, safari etc.)

this is "hello world":

from pyjamas.ui.RootPanel import RootPanel
from pyjamas.ui.Button import Button
from pyjamas import Window

def greet(fred): Window.alert("Hello, AJAX!")

if name == 'main': b = Button("Click me", greet) RootPanel().add(b)

that immediately answers the first four out of five requirements. requirement 5 is fulfilled by this:

from pyjamas.ui.RootPanel import RootPanel
from pyjamas.ui.HorizontalPanel import HorizontalPanel
from pyjamas.ui.HTML import HTML

p = HorizontalPanel() p.add(HTML("<b>Hello</b>")) p.add(HTML("World")) RootPanel().add(p)

it couldn't get any simpler.

Solution 5 - User Interface

XUL (it's pretty easy to use, and powerful -- much of Firefox is implemented using XUL for GUI structure, + javascript for logic handling)

The XUL tutorial has some good examples. Here's one for tabboxes. The one at the bottom of the page has switchable tabs, buttons, edit boxes, and group boxes, and it's fairly simple (no Javascript/CSS/XBL/key bindings/etc). They then add progressively more stuff later which is a lot of functionality for the length of the file that specifies it. (at least until you start adding javascript to handle the logic in question) If I had to do something like this in Win32 it would be a real pain.

Solution 6 - User Interface

http://wxlua.sourceforge.net/">wxLua</a> is a wrapper of the wxWidgets library for Lua. It uses a Connect method to attach gui widget events to functions (functions are first class like in JS).

Solution 7 - User Interface

GTK-server is extremely simple to use and can be used from more than 30 languages, including Bash and Visual Basic.

Solution 8 - User Interface

SDL/Swing is extremely terse, readable, unobtrusive (283k lib with no dependencies) and easy to use. Example:

menus {
    "File" {
        "Open" do="open" // calls "open()" in the controller
        "---"
        "Exit" do="exit"
    }
}

Its open source but enjoys commercial support from Ikayzo.com. Ports for .NET and iOS are underway.

Solution 9 - User Interface

I juat came across SDL/Swing today.

Solution 10 - User Interface

You should have a look at XAML if you're on the .NET platform

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionsastaninView Question on Stackoverflow
Solution 1 - User InterfacerampionView Answer on Stackoverflow
Solution 2 - User InterfaceMike WoodhouseView Answer on Stackoverflow
Solution 3 - User InterfacemouvicielView Answer on Stackoverflow
Solution 4 - User InterfacelkclView Answer on Stackoverflow
Solution 5 - User InterfaceJason SView Answer on Stackoverflow
Solution 6 - User InterfaceNick Van BruntView Answer on Stackoverflow
Solution 7 - User InterfaceJakob ErikssonView Answer on Stackoverflow
Solution 8 - User InterfaceDaniel LeuckView Answer on Stackoverflow
Solution 9 - User InterfaceDigikataView Answer on Stackoverflow
Solution 10 - User InterfaceRadView Answer on Stackoverflow