Simple UI

Business application builder for Android and Web

SimpleUI is a completely free framework for creating business applications for Android with instant deployment on devices. These can be online or completely independent (offline) mobile workstations for accounting systems (1C: Enterprise, SAP and others) for Android devices - mobile phones, TSD, tablets, electronic kiosks. The platform executes user configurations with code interpretation both locally (python or javascript) and online (in the language of back-systems) and is focused on maximum performance for high-load solutions. With the help of the same designer, semantics and set of commands, you can create workstations for PCs based on web clients, make your own cloud solutions on the open SimpleWEB framework (on which, in turn, the cloud designer for the platform is written).

The main mission of Simple is to simplify the development and support processes as much as possible through a special solution architecture, by structuring visual forms, events and their handlers. This is not No-code, since I consider No-Code to be insufficiently flexible and universal - this is Low-code, which allows you to create solutions with the performance of native applications and even higher (see examples). This is intentionally not a cross-platform framework. Instead, it is maximally focused on deep use of the capabilities of the base platform, style and Google recommendations, which cannot be achieved in cross-platform frameworks, which are forced to offer equal capabilities on all platforms.

At the same time, SimpleUI is a research project that has been going on continuously for over 5 years, the goal of which is to find methods and architecture for continuous simplification of the development process. This search for the philosopher's stone is an endless process, some technologies take off, some do not, but in general the efficiency of the tool is constantly growing with each release. This process has another goal - to obtain an application architecture that is most suitable for LLM models among all frameworks. In the near future, ui files will be generated, and the designer will be needed only for viewing and minor edits.

SimpleUI tries to make AI capabilities really work, and not be a fashionable toy for presentations. Thus, OCR (text recognition) with the help of a special technique gives 100% accuracy and speed comparable to a barcode, and after many years of use, we can confidently say that the lack of barcoding or RFID is not a death sentence - article numbers, VINs, inventory numbers and other alphanumeric labels are read perfectly. The unique ActiveCV methodology, invented specifically for SimpleUI, allows you to visualize the video stream and complement the screens with a completely new way of interaction based on CV (computer vision), which allows you to speed up warehouse and other accounting operations many times over. A voice assistant combined with fuzzy search by user datasets speeds up the search for goods (in case there are no barcodes or text markings).


Working with images
Different visual elements
Different visual elements
Various detectors (OCR and others)

Vector graphics

Working with canvas

ActiveCV(working with video stream)

HTML, printable forms, JS

Where to start?

To write a solution, you only need a browser and a mobile phone on Android anywhere in the world without registration and cloud storage (configurations are downloaded as ui files or via GitHub)

You can develop your solutions on https://seditor.pw:1555/ or download this constructor locally and run it (for debugging and communication with the back-system, if required, you can also download the bus). You don't have to install anything special on your computer, but you can write the handler code in your IDE, linking it to the configuration via GitHub

Just go to the designer Configuration-New configuration, install SimpleUI (from Google Play or apk) and scan the QR code. That's it, the configuration is ready to work! You can make simple examples from https://simpleuitxt.readthedocs.io/en/latest/getting_started.html

Which handlers are best to start with?

I used to recommend online, but now pythonscript has caught up in simplicity, so if you know Python (but don't want to bother with included files at the initial stage) - then pythonscript. If you can only develop in the language of your back-system, then of course it's better to start with online, and then gradually translate handlers to python.

Also, even if you have a completely online solution, in order to reduce the load on the backend, you can move simple operations to local handlers, for example, set. For example, if you just need to switch the screen, you should not send the request back and forth, do set ShowScreen

Also, for fully online solutions, it is sometimes useful to move work with your reference information to datasets - an advantage in speed and other features.

SIMPLE UI TECHNOLOGY STACK

The principle of interaction between interface, events and handlers

Form elements, external equipment (such as barcode scanners) and other mechanisms (such as timers) generate events. Events are processed in handlers either online (on the back-end system side) or locally in the application and as a result of processing, variables that are displayed on screens, commands that control the application (switching screens, displaying lists, sounds and voice-over, etc.) are pushed onto the variable stack.

That is, the variable stack connects the interface, events and handlers through data and commands.

And also the variable stack connects local handlers (sometimes in different languages) with online handlers - the stack is the same in both.

Online handlers

SimpleUI executes code online on the side of your accounting system either via HTTP request or via the bus. Commands and variables are exchanged between the device and the back-end system in requests in the form of a stack of variables (HashMap). The syntax and principles in both cases for the developer are identical.

Option via HTTP service

This option will require the accounting system to publish an http service. The handler type in SimpleUI is online.

Option via bus, via WebSocket

Also, if there is no desire or possibility to publish a web service outside on the Internet and your system can work with web sockets, then you can work through the bus (onlinews handler type) It is described in detail here https://infostart.ru/1c/articles/2305445/

Local handlers (offline)

  • pythonscript– is a full-fledged Python 3.11, executed as a script, the code is stored directly in the ui configuration file (in base64). Standard and popular libraries are pre-installed, but it is also possible to connect your own python libraries
  • python and pythonargs are python handlers stored in separate files during development (but they are also written to the config when building)
  • javascript – local JavaScript interpreter
  • pythonbytes – for experimenting with OpenCV
  • set– can put/read a variable into the variable stack. Despite its primitiveness, it is often used.

Event Handler Architecture

  • All events that occur in the system, both internal and external, are linked to handlers via an array of handlers (essentially a JSON array of objects)
  • There is such an architecture for the screen and there are common handlers outside the screens – for common and background system events (for example, receiving an external intent)
  • Handlers can be synchronous (run), asynchronous (runasync) and stored within the system-blocking progress bar (runprogress)
  • You can attach as many handlers as you want to one event - synchronous ones will be executed sequentially in the order of the queue, and asynchronous ones will be launched sequentially, and will be executed when they are executed
  • Each handler call can be executed locally or online by one of the handler types (see above)
  • For each call to a handler, you can define a callback upon completion – postExecute. In this case, upon completion of the handler, an array of one or more handlers will be executed, which in turn can also have their own postExecute – i.e. the chains can be infinite. This is usually used for asynchronous handlers (for example, to redraw the screen upon completion)
  • By the way, in SimpleUI after processing the input (onInput event) the screen is always redrawn (with onStart/onPostStart events), which can be disabled with the noRefresh flag
  • Usually the array of handlers is defined in the constructor visually, but it can also be run from code (i.e. create an event and run an array of handlers on it) using the RunEvent command

Long running processes and background execution

  • Workersfor guaranteed execution of long processes https://infostart.ru/1c/articles/1825700/
  • A background service that is constantly running, even when the application is turned off (pinned to the curtain), in which you can receive and process external events with your background context (without screens). A publication that is no longer very relevant is here https://infostart.ru/1c/articles/1458666/
  • runasync and runprogress for long running tasks
  • Special methods for downloading large files https://t.me/devsimpleui/156 and file transfer mode in SimpleBus

Configurations and repository

The configuration is essentially a JSON file (but with the extension .ui) that stores screens, handlers, and other structures. The configuration can be hosted somewhere on the Internet (as in the case of seditor.ru), it can be placed on your network resource, or it can be transferred locally. Once downloaded, it is stored and opened locally, but if the source address is specified in the settings, it is updated from it upon startup or a special update

Configurations can be placed locally in a repository. This is a local storage from where you can switch between configurations, they are also updated locally and they can also work in the background, for example, receive messages from the SimpleBus bus, process them in the background and somehow interact with the user

And there is also the possibility to separate any process into an independent SUIP-file, combining configuration and data, something like an Excel-file with macros, only executed not on Excel, but on SimpleUI

Storage

For local storage, you can use both SQL (SQLite) and specially developed NoSQL DBMS and a special mechanism for memory-resident datasets with the ability to save/load

The current and recommended storage configuration involves using the following tools for local storage, depending on the nature of the data and the intended use case (you can combine these tools):

  • datasetsresident in memory with the ability to save/load for storing data from external systems - reference books, links, documents. More details - here https://habr.com/ru/articles/892140/
  • A key/value database for storing simple data – such as application settings, constants, input values, screen contents
  • Pelicanfor your own data and all other tasks. This is a DBMS developed specifically for Simple, which in principle in terms of functionality can of course replace the two previous points, but datasets have a trump card in the form of powerful integration into mechanisms, and the key/value is simpler for situations when you just need to put/read a value of the constant type. More details here https://infostart.ru/1c/tools/2127994/

As an additional alternative, you can use SQLite , including in conjunction with ORM Pony


Connection

Exchange with external systems:

  • Online processors described above
  • requests module in python handlers and XMLHttpRequest in javascript handlers
  • Recommended method: SimpleBus bus for exchanging messages, data (with caching and guaranteed delivery, support for a permanent connection) and large files. Details here: https://infostart.ru/1c/tools/2169197/

For large files:

  • download command in python handlers
  • transferring large files via SimpleBus
  • workers StartDownloadWorkRequest/ StartUploadWorkRequest

WebSocket-client (in addition to the SimpleBus bus, which also works via WebSocket but with its own features)

  • built-in web socket client for any purpose with control via variable stack commands and common events. It is recommended to use a bus connection, as it has more capabilities on the application side (settings, connection support, background work for inactive configurations - from the repo, etc.)

Bluetooth

  • working in client and server mode via variable stack commands and more extensively via the SimpleBluetooth module for python handlers

NFC

  • read any labels from a process
  • subscribe to tags of a specific format at the application level (for launching from Android)

p2p data transfer in the absence of connection

GPS

  • Continuous acquisition of device coordinates is possible

Visual Elements

Almost the entire set of standard Android SDK widgets is supported

In the designer, visual elements are defined using nested containers (LinearLayout in AndroidSDK). The position in the container can be "Full container", "By size" and proportional to weights (for example, if you need to horizontally arrange 3 inscriptions with width proportions of 1, 3 and 2, then you need to set the Width = 0 (Manually), and set the weights to 1, 3 and 2).

Container markup defines the appearance of screens, dialog boxes, and list items

Elements can have custom borders and rounding radii, including a full circle.

If the capabilities of the constructor and containers are not enough, then there is an option of arbitrary XML markup: https://infostart.ru/1c/articles/1983895/

There are also some special visual elements that I would like to highlight separately:

  • HTML(with JS) – you can embed your HTML with JavaScript. This works especially well with Jinja, you can embed your printed forms (easy to transfer them from 1C). Details here: https://infostart.ru/1c/articles/1716745/
  • Vector graphics – for drawing topology, diagrams, heat maps. Also “canvas mode” for drawing on the screen. Details here https://infostart.ru/1c/articles/1736200/
  • ActiveCV – visualization of a video stream (CV) with ML detectors (barcodes, OCR, faces, etc.). More details here https://habr.com/ru/articles/874560/
  • Start screen - the process menu is generated automatically, but you can use the screen to redefine the start menu: https://infostart.ru/1c/tools/2251192/
  • Working with pictures – special elements to make it easier for the developer to work with pictures and the camera – galleries. And to place just a picture in a container, you can use simple constructions ~ or ^ (for static media files) (*base64 is also supported, but not recommended due to performance)
  • Html markup in all inscriptions, allows you to liven up the interface. In any text of any elements, you can use tags, for example, “This is highlighted text”

Messages, sounds, voice

  • With the speak command (“Hello world”) (via the stack, also the speak command) you can voice the text
  • toast – displays a pop-up message
  • beep – short sound signal (you can customize 99 sound options
  • there are all kinds of notifications (notification) - for displaying messages in the Android notification curtain
  • The listen command (or a similar screen element) starts voice recognition, including off-screen - in the background. The combination of speak and listen allows you to create something like a voice assistant (but it cannot constantly listen to the microphone)

Equipment

Work with any scanners/TSD from the screen (screen element Barcode) with connection via:

  • subscribe to the scanner intent (this configuration option is recommended)
  • connection in different keyboard emulation modes: wedge as keys, line with CR/LF and similar
  • connecting an external Bluetooth scanner via the application settings (for devices without a built-in scanner)
  • scanning with camera (Barcode element) or camera via ActiveCV
  • extended support mode for Urovo TSD

Working with scanner events from the event service (off-screen):

  • working via intent
  • working with Bluetooth scanner via settings

Working with external printers via Bluetooth/USB/TCP-IP

It is possible to send labels to the printer both in HTML and markup languages (ZPL, TSP, PCL, ESC/POS)

Sending data to USB port (in accessory mode)

Send to TCP/IP ports

Separate advanced functions for some TSD (Urovo, Meferi)

Useful links

Telegram channel https://t.me/devsimpleui

Developers forum in telegram: https://t.me/simpledevchat

Online documentation:

Online editor

Configuration editor written in SImpleWEB: https://github.com/dvdocumentation/web_simple_editor

Pelican

Simple ecosystem's own NoSQL DBMS: https://github.com/dvdocumentation/pelican_dbms

SimpleBUS lite

A simplified script that is sufficient for onlinews and debugging: https://github.com/dvdocumentation/simplebuslite

Simple for weak devices

A very simplified (and already outdated script) for weak clients (written for RaspberryPI): https://github.com/dvdocumentation/simpleui_desktop

My name is Dmitry Vorontsov. I am engaged in the implementation of ERP, MES, WMS systems. And at some point I needed a tool that could cover the needs of the front on my projects. Being an Android developer, I understood that transferring various business logic cases directly to the Java/Android SDK stack is a labor-intensive task. I wanted to abstract from the low-level interface, but maintain the performance and responsiveness of native solutions. This is how SimpleUI appeared. Initially, it was exclusively online execution of handlers. Later, thanks to the Chaquopy project, Python appeared, then JS. Storage evolved from Sqlite to our own developments. The project has acquired its own ecosystem. Well, at the forefront is the principle of simplicity of development, which is what the name Simple





Telegram and YouTube