Is there a cross-OS GUI framework that supports embedding HTML pages?

Question

I want to develop a desktop app to be used cross-system (win, mac, linux), is there a GUI framework that would allow me to write code once for all 3 platforms and have a fully-s

Answer 1

What about using the Chromium Embedded Framework.

It's open-source (BSD License) and comes with bindings for C, C++, .NET(1 or 2), Java, Delphi and Python.

This .NET binding is also fully compatible with Mono which will be helpful to have a cross-platform app.

Note: AppJS, which is mentionned in another answer, is build on top of CEF (using node.js).

Answer 2

Qt has such a thing with QWebView.

Answer 3

What's wrong with Mono and WinForms

Answer 4

as cited, TideSDK (http://www.tidesdk.org/) is an option (the better at the moment for me) you could also go with the same idea XUL Runner (https://developer.mozilla.org/en-US/docs/XULRunner), Adobe AIR (http://www.adobe.com/devnet/air/air-sdk-download.html) ( here: http://www.adobe.com/devnet/air.html is the tutorials with "how to" in other ways than besides flash and dreamweaver, AppJS (http://appjs.org/) or Node Qt (https://github.com/arturadib/node-qt) with more work there is cef (http://code.google.com/p/chromiumembedded/), berkelium (http://berkelium.org/), awesomium (http://awesomium.com) or How can I embed firefox in a GUI application? which says how to embed gecko (firefox's engine) in applications.

ok, now my opinions on all: the first options will offer you a better way to go, as they are basically a "browser" that works cross platform, you will deploy a html + js + css app (with air you can deploy flash/action script apps too); the other options you have to build a app and then put the "browser" in it, it offers more flexibility, but may be counterproductive.

my experience with all is: tidesdk - is good and stable but is still growing, so some advanced features may be missing out, but you can compile it and the dev team is very active

xulrunner - stable, impossible to do complex things, you will need a good C knowledge to make your own components as it offers you basic stuff only. it's very flexible in what you can do, but have a rigid structure of content, your app will not run unless it's organized in such a way, and has a ugly syntax in my opinion (lol), it's a mix between java and javascript styles of programming

adobe air - easy to use and deploy, but is flash which gives me that weird itching sensations of unoptimized stuff

appjs - is nodejs, the example works, i couldn't get my custom app running, i think it's not refined yet, it works, for me, in a quirky way

nodeqt - is qt + nodejs, you need to compile your own version of qt, i haven't tested but looks simple to deploy

the others embedding ways - haven't tested, looks good and all, but i don't know, may be too work for nothing

Answer 5

There is also TideSDK formally known as Titanium. This provides a WebKit HTML/JavaScript widget that does pretty much everything you could want, including running the Chrome developer tools.

---

EDIT below. Consolidating my update with feedback from the TideSDK developers:

TideSDK, formerly Titanium Desktop, is an open source software development kit for creating multi-platform desktop apps using HTML5, CSS3, JavaScript and other common scripting languages. The project is hosted on Github. The main web site has comprehensive documentation and hosts an active developer community. Thousands of developers have used the former Titanium Desktop to develop deskop applications. Perhaps the most recognized applications is Wunderlist

TideSDK allows you to use your web development skills to create desktop apps and provides wide range of privileged APIs. You can easily extend the functionality of your app using mature libraries in python, php or ruby.

The heart of TideSDK is an object bridge compiled into the WebKit component. The bridge allows other scripting languages - python, php or ruby - to run on the HTML page using script tags in the DOM, just like JavaScript. You can also directly call .py, .rb or .php files from within your application.

TideSDK can be used with no more than a basic text editor - it does not need any special tools or an IDE although many developers prefer richer tools. TideSDK includes command-line tools for running your application locally (for development and debugging) and also to package it into an installer for the OS that you are developing on (Windows, Mac OSX and Linux are supported). To get all the needed installers, a typical TideSDK development environment will include a physical or virtual machine for each OS. The TideSDK team is looking to implement a different and better way soon.

The TideSDK team is currently developing a TideSDK Builder app. It will provide a GUI for creating, running and packaging TideSDK apps. To get developers started faster, TideSDK Builder introduces a new feature - Scaffolds. Scaffolds generate all the boiler plate to instantiate a projects with specific patterns of development such as Backbone MVC. Developers can use TideSDK Builder to create, import and share scaffolds.

The roadmap for TideSDK includes the implementation of CommonJS for 1.4 which aims to provide developers with a more modular development experience using JavaScript.

Hello World

A TideSDK project consists of some boilerplate code with a Resources folder that contains the core project files. The following illustrates the stucture of a simple hello world app that will run on all supported plaforms:

├── CHANGELOG.txt
├── LICENSE.txt
├── README.md
├── Resources
│   ├── app.js
│   ├── default_app_logo.png
│   └── index.html
├── manifest
└── tiapp.xml

The manifest contains information about the runtime modules used by the project. tiapp.xml provides configuration and default_app_logo.png is the image that will appear by default in the dock, system tray or in the windows of your app.

The following is the contents of the app.js file for the hello world example (as it will appear in TideSDK 1.3.0). Previous versions will have used the Titanium namespace which has been discontinued.

// create and set menu
var menu = Ti.UI.createMenu(),
fileItem = Ti.UI.createMenuItem('File'),
exitItem = fileItem.addItem('Exit', function() {
  if (confirm('Are you sure you want to quit?')) {
    Ti.App.exit();
  }
});

menu.appendItem(fileItem);
Ti.UI.setMenu(menu);

Here is the HTML for the same app. It calls the script above.

<!DOCTYPE html>
<html>
<head>
  <title>Hello World</title>
  <style type="text/css">
    body {background: #fff;}
  </style>
</head>
<body>
  <h1>Hello World</h1>
  <script type="text/javascript" src="app.js"></script> 
</body>
</html>

In less than 10 lines of JavaScript code, we create a menu, adding 'File' and 'Exit' menu items, and set it to the main window. A simple callback method is used to pop open a exit confirmation dialog. If the user confirms, the app will exit.

Background

Titanium was developed by Appcelerator and made available under the Apache 2 Licence. Originally Appcelerator provided the open source Titanium Developer to create projects. Later Appcelerator introduced the closed source Titanium Studio, an IDE on top of Aptana. While it currently remains possible to develop TideSDK in Titanium Studio, a plugin may be required in the future. [Andrew: sorry, this is not clear to me. A plugin to Titanium Studio? Or Aptana? Or the TideSDK?]

Appcelerator has supplied an TiStudio SDK to use to use that might assist us in creating a plugin to TiStudio to allow TideSDK to be used through TiStudio

Answer 6

I'm going to throw this one out:

AppJS: http://appjs.org/