Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to develop a GUI on Linux Embedded with just HTML, CSS and JS?

I have been researching widely on this topic, but still haven't found a proper guide. What I am doing is to create a GUI for an embedded system based on Linux Embedded and I would like to know if:

  • it's going to be possible to code the GUI using HTML, CSS and JS?
  • is it worth looking into porting a framework such as React JS?
  • is there any other alternative that allows for quick development and satisfying UI?

I am very new to this and I would be very grateful if someone more experienced could point me in the right direction. Thanks so much.

like image 458
Giulia Avatar asked Jan 28 '20 09:01

Giulia


People also ask

Can we make GUI with HTML?

As you can see, you would be able to create your whole GUI using HTML, we just must add <script type="text/javascript" src="/eel.

Is CSS used for GUI?

Mozilla's XML-based language XUL uses CSS as a tool for gui layout.

Which Linux is used in embedded system?

Embedded Linux is built on the same Linux kernel, available from kernel.org, as all Linux systems.

What is embedded GUI?

The goal of embedded GUI design / development is to create an interface that is intuitive, clean, and helps your product stand out from the competition. Design elements are more effective if they are given thoughtful touches that align with the end users interests and needs.


1 Answers

I've just written an article listing the top 5 libraries for creating GUI on Embedded Linux. I've only mentioned one tool that renders HTML UI, the Sciter engine. It's much more compact than Webkit or Chromium. The owner of the project, Andrew Fedoniouk, recently released a new version called Sciter.Lite that will support embedded devices. Check out these two resources.

https://sciter.com/sciter-lite-is-published/

https://sciter.com/windowless-sciter-android-and-iot-devices/

Demos are already available on their GitHub

  • sdk/bin.lnx/x64lite
  • sdk/demos.lite

You don't have to limit yourself to HTML UI, check out the other tools I've recommended. All of them have a free version. For rich UI, I think HTML UI is easier. I mean, Sciter Notes doesn't look to shabby and it's just under 5Mb for Win, Linux and Mac. But the backend is C++. For more minimal hardware, you'll have to look into the C/C++ toolkits I've listed. TotalCross are planning to support Android XML but has not been released yet. So you can check on them also.

Oh. Almost forgot. Two whitepapers comparing QML and HTML5 were published in 2017. Qt requires you to register so I'll just give you the links so that you can download them without registering :)

Paper 1: Qt QML v HTML5 –a practical comparison

Published on May 2017 by Sequality Software Engineering an Austrian firm that is a Qt partner and does Qt consultancy.

Downlink Link 1, Download Link 2

Here is a review of the paper by a software engineer, Amir Shrestha, who provided the first download link. There is more discussion at Hacker News. There was also an interesting discussion thread in a YouTube video about the comparison. You can read the YT comment section but first search "Andrew MacAulay" and read that thread. He was the lead engineer for the autopilot system for the F-18 jets and has worked in other senior embedded roles.

Paper 2: Qt or HTML5? A Million Dollar Question

Published on Oct 2, 2017, by Burkhard Stubert a Qt consultant and developer.

Download Link

Here is the discussion on Hacker News.

An interesting piece of information I found in the second paper is that 90%+ of all home appliances are powered by micro-controllers with no OS or a very minimal RTOS.

Another interesting piece of information I discovered while writing my article, is that Micrium OS and components are now open-source under Apache 2.0. It has its own GUI toolkit written in C but it only targets Micrium OS and not embedded Linux. If developers start adopting Micrium OS (it was already quite popular in the industry and even launched in space) perhaps you can start looking into it too.

like image 137
Kevin Muhuri Avatar answered Nov 15 '22 09:11

Kevin Muhuri