Alterna · учебный материал

PyUI: browser interfaces

Chapter 43 Alterna: PyUI, components, status and events. Python team browser interfaces without Tkinter or PyQt.

Что в этом материале

Содержание и основные понятия

The PyUI in this chapter does not disguise itself as Tkinter or PyQt. Python code is executed separately and returns a safe data tree, and the browser creates real XML elements from it. The page events remain browser events, not a fake window library.
design
Grade 8-11
browser-native
01
Headway
There is no workshop or exam: four pages form a short creative laboratory.
43.1 · Interface model
Components and wood DOM
Let's divide the screen into small parts: title, card, field, and action.
43.2 Conduct
Status and developments
Let's run the exact cycle: the user event changes the data, and the drawing reflects the new state.
43.3 Creative environment
PyUI Studio
Write Python teams, run them in an isolated Worker and collect a functioning browser screen.
02
Boundary between Python and browser
01 · Python
Describes intention
ui.column(...)
,
ui.card(...)
and
ui.text(...)
The code does not access the page directly.
02 · Bridge
Transmits data
The isolated Worker returns the structured tree. There is no window library in this area and no widget simulation.
03 · DOM
Lives in a browser.
Host creates real XML nodes for text, headlines, cards, and notices. The events of the interactive page remain normal events of a browser.
Important distinction
PyUI is not a desktop interface port: it is a learning declarative API for HTML DOM. The data tree is built by Python code and the browser is responsible for semantics and behavior of the page.
03
Gather a tree of components.
Add knots, the last button will get a real processor.
click
in this browser.
DOM compiler
components ∙ tree
04
State Alt Journal
The event does not disappear after drawing: the magazine keeps a picture of the condition, so it can be rewinded backwards and forwards.
ALT · STATE LOG
Interface images
Status

Structural map of textbooks