Skip to content
IRC-Coding IRC-Coding
Linux Desktop Applications Electron Python JavaFX GNOME GUI Development

Building GUI Desktop Apps on Linux

Learn to develop graphical desktop applications on Linux using Python, JavaScript, Electron, Java, and C++.

S

schutzgeist

2 min read
Building GUI Desktop Apps on Linux

Developing Graphical Desktop Applications on Linux

Source: Python3 Tutorial

Sometimes you feel like you’re only programming for the big World Wide Web and then you have some ideas for your own desktop. Whether it’s a to-do list or similar programs.

But how do you want to implement it?

  • Maybe a Chrome or Firefox plugin?
  • A Gnome application?
  • A complete desktop application?

I work a lot with the browser and already implement many tools here, but which implementation is suitable for which project and which programming language.

If you also want to write some programs yourself, here are some thoughts for making the right choice:

Under Linux there are several suitable programming languages for developing graphical programs. The choice of the right language often depends on the specific requirements of the project, the available libraries and frameworks, as well as your personal preferences and knowledge.

Programming Languages for Graphical Desktop Programming on Linux

C++ with Qt

  • Qt is a widely used framework for developing cross-platform graphical user interfaces (GUIs).
  • C++ in combination with Qt is a strong choice for powerful and complex graphical applications on Linux.

However, younger people program less and less with C++, or often start with Python and others.

Python with Tkinter or PyQt

  • Python is popular because of its simplicity and readability.
  • Tkinter is included in the Python standard library and provides a simple way to create GUIs.
  • PyQt is a Python binding for the Qt framework and offers more functionality.

Java with Swing or JavaFX

  • Java is another good choice for developing GUI applications.
  • Swing and JavaFX are two popular Java libraries for creating graphical user interfaces.

While Swing seems rather outdated, JavaFX is a nice alternative, but also more challenging to implement.

C# with Mono and GTK#

If you have experience with C#, you can use Mono, a cross-platform implementation of Microsoft’s .NET Framework, together with GTK# for developing GUI applications on Linux.

You wonder why C# on Linux? Computer science specialists in application development often start with C#, which also applies to many degree programs. Microsoft is back in the top ranks, C# skills should be on every to-learn list.

JavaScript with Electron

For web developers, Electron can be a good choice. It allows you to create desktop applications with web technologies such as JavaScript, HTML, and CSS.

Vala with GTK+

Vala is a programming language specifically developed for the GNOME platform. It uses GTK+ for GUI development and is a good choice if you want to focus on the GNOME environment.

Each of these languages and frameworks has its own strengths and weaknesses. The choice ultimately depends on the specific requirements of your project and your familiarity with the language and associated tools.

I personally waver between JavaScript combined with Electron and Python with the Qt framework.

Desktop Applications with Javascript/Electron vs Python with Qt Framework! Advantages and Disadvantages

JavaScript with Electron

Advantages:

Cross-platform Development

Electron allows you to develop desktop applications for Windows, Linux, and macOS with the same web technologies (HTML, CSS, JavaScript).

Modern Web Technologies

Developers can use modern web frameworks and libraries, which often speeds up and simplifies development.

Strong Community and Resources

Electron is supported by a large community and offers many resources and plugins.

Integration with Node.js

Electron apps can leverage Node.js, enabling access to a vast ecosystem of NPM packages.

Disadvantages

Memory Consumption

Electron apps have often been criticized for their high memory consumption and size.

Performance

Although they are powerful, Electron apps can be slower than native applications.

Security

Electron apps can pose security risks if not developed carefully.

Python with Tkinter/PyQt

Advantages:

Simplicity and Speed with Tkinter

Tkinter is easy to learn and use, making it ideal for smaller projects and prototyping.

Rich UI Components with PyQt

PyQt provides an extensive collection of UI components and is well-suited for complex applications.

Python Ecosystem

Access to Python’s extensive ecosystem of libraries for various use cases.

Lower Memory Consumption

Compared to Electron, Python-based GUI applications often have lower memory consumption.

Disadvantages:

Cross-platform Challenges

Although both Tkinter and PyQt are cross-platform, challenges can arise with look-and-feel and behavior on different operating systems.

Older Technologies

In particular, Tkinter can seem outdated and does not offer the modern features available in web technologies.

Learning Curve for PyQt

PyQt can have a steeper learning curve, especially for developers unfamiliar with Qt.

Tutorial for a To-Do List with JavaScript and Electron on Linux:

To illustrate the effort involved, I would like to show you the steps to write such a script. I assume you already know what program you want to write and what this tool should be able to do. In this case, I’ll stick with a simple to-do list for Linux. The programming part is left blank since this is about the steps.

To create a to-do list on Linux with JavaScript and Electron, follow these steps:

Install Node.js and npm

  • Electron applications are developed with Node.js. Make sure Node.js and npm are installed on your Linux system. You can download them from nodejs.org.

Initialize a New Node.js Project

  • Open a terminal. Create a new folder for your project and navigate into it (mkdir meine-todo-app && cd meine-todo-app). Run npm init -y to create a new package.json file.

Install Electron

Run npm install electron —save-dev in your project directory to install Electron locally in your project.

Create Your Main File

  • Create a file named main.js. This will be the entry point for your Electron application. In main.js, you initialize the Electron window and define the behavior of your application.

Develop the User Interface:

  • Create an HTML file (e.g., index.html) that serves as the user interface for your to-do list.
  • Add interactive elements to add and remove tasks.

Implement the Functionality with JavaScript:

  • Write JavaScript code (within or as a separate file linked in your HTML file) to enable adding and removing list entries.

Add Your Application to package.json:

  • Edit the package.json file to define the script for starting your Electron application. For example, “start”: “electron .”.

Test Your Application:

  • Run npm start in the terminal to start and test your Electron to-do list.

Expand and Refine:

  • Extend your application with additional features and improve the design and user experience.

Here is a simple example of the structure of your main.js file:

const { app, BrowserWindow } = require('electron');

function createWindow() {
    let win = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            nodeIntegration: true
        }
    });

    win.loadFile('index.html');
}

app.whenReady().then(createWindow);

And a simple example of your index.html

<!DOCTYPE html>
<html>
<head>
    <title>My To-Do List</title>
</head>
<body>
    <h1>My To-Do List</h1>
    <input type="text" id="todoInput">
    <button id="addTodo">Add</button>
    <ul id="todoList"></ul>

    <script>
        // JavaScript code for adding and removing tasks
    </script>
</body>
</html>

This gives you a good starting point for developing a basic to-do list. You can then add further features and customize the design to meet your requirements.

Back to Blog
Share:

Related Posts