ltk

ltk

LTK ist ein kleines Toolkit zum Schreiben von Web-UIs in PyScript. Eine Erklärung von PyScript und LTK finden Sie auf YouTube.

Beispiele finden Sie unter:

• Die LTK-Küchenspüle für eine Live-Demo aller Widgets.
• Warum LTK verwenden? Sehen Sie sich den Pitch an, der natürlich mit LTK geschrieben wurde.
• Eine persönliche Website, chrislaffra.com, die eine Reihe von Animationen, SVG, Stilen und Timern verwendet, um einen visuellen Lebenslauf darzustellen.
• Eine animierte Feiertagskarte, bei der Baumornamente mit PyScript-Logo mithilfe von Python-Code im Browser mithilfe von LTK animiert werden.

LTK ist als deklarative Python-Bibliothek implementiert und nutzt jQuery für DOM-Operationen.

LTK installieren

Installieren Sie LTK von Pypi:

 python3 -m pip install pyscript-ltk

Hallo Welt

 import ltk

ltk . Text ( "Hello World" ). appendTo ( ltk . body )

Erste Schritte

Um mit LTK zu beginnen, empfehlen wir Ihnen, es auf pyscript.com auszuprobieren:

• Minimaler LTK mit MicroPython
• Minimale LTK mit PyOdide

Widget-Spezifikation

Neue Widget-Typen werden durch Unterklassen von ltk.Widget erstellt:

 class HBox ( Widget ):
    classes = [ "ltk-hbox" ]

Standardmäßig werden Widgets als div DOM-Elemente erstellt. Sie können ein anderes Tag auswählen:

 class Preformatted ( Widget ):
    classes = [ "ltk-pre" ]
    tag = "pre" 

Erstellen einer Benutzeroberfläche

Um eine Benutzeroberfläche zu erstellen, werden Elemente deklarativ konstruiert:

 ltk . Table (
    ltk . TableRow (
        ltk . TableHeader ( "header1" )
        ltk . TableHeader ( "header2" )
    ),
    [
        ltk . TableRow (
            ltk . TableData ( value1 ),
            ltk . TableData ( value2 ),
        )
        for value1 , value2 in data
    ],
)

Widgets werden mithilfe der append und appendTo -Aufrufe von jQuery zu anderen hinzugefügt:

 ltk . body . append (
    ltk . Table (...). element
)

container = ltk . VBox (...)
ltk . H1 ( "This is a header" ). appendTo ( container )

Wenn ein LTK-Widget erstellt wird, wird ihm im ltk.Widget.__init__ Konstruktor ein entsprechendes jQuery-Element angehängt. Es verwendet den von der deklarierenden Klasse definierten tag Wert und das konstruierte Element wird als element bezeichnet. Da es sich beim append -Aufruf um eine von jQuery implementierte JavaScript-Funktion handelt, übergeben wir das LTK-Widget nicht direkt, sondern dessen element zum Anhängen an das DOM.

Styling

Widgets können mit drei verschiedenen Ansätzen gestaltet werden:

1. Styling mit Elementstilen mithilfe der css Funktion von jQuery :

 ltk . Text ( "Error: Flux capacitor low!" )
    . css ( "background-color" , "red" )
    . css ( "color" , "white" )
    . css ( "padding" , 8 )

2. Styling mit einem dict um das Teilen von Stilen zu erleichtern:

 error = {
    "background-color" : "red" ,
    "color" : "white" ,
    "padding" : 8 ,
}
ltk . Text ( "Error: Flux capacitor low!" , error )

3. Styling mit CSS-Klassen und einem externen Stylesheet unter Verwendung der addClass -Funktion von jQuery :

 ltk . Text ( "Some text" ). addClass (" my - special - text )

Das externe Stylesheet sollte diese Regeln haben:

. ltk-text {
    font-family : Arial;
}

. my-special-text {
    font-family : Courier;
    background-color : red;
    color : white;
    padding : 8 px ;
}

Externe Stylesheets können in die ursprüngliche index.html eingefügt oder zur Laufzeit aus Python eingefügt werden, indem Sie Folgendes verwenden:

 ltk . inject_style ( "https://example.org/awesome_styles.css" )

Veranstaltungen

Event-Handler werden mithilfe von jQuery Mechanismen angehängt.

 def buy ( event ):
    purchase (...)

ltk . Card ( "Buy Now" ). on ( "click" , ltk . proxy ( buy ))

Sie können auch den deklarativeren Dekorator verwenden:

 @ ltk . callback
def buy ( event ):
    purchase (...)

ltk . Card ( "Buy Now" ). on ( "click" , buy )

Beispiele

Sehen Sie sich die LTK-Küchenspüle an oder erkunden Sie den examples

Mit LTK erstellte Anwendungen

• PySheets

Lizenz

LTK unterliegt der Apache-Lizenz:

• Die Apache-Lizenz ist eine freizügige Open-Source-Softwarelizenz.

• Es ermöglicht Benutzern die freie Nutzung, Änderung und Verbreitung der Software (auch für kommerzielle Zwecke).

• Geänderte Versionen können verteilt werden, ohne dass der Quellcode veröffentlicht werden muss. Allerdings sollten Änderungen am Quellcode dokumentiert werden.

• Die Lizenz erfordert geänderte Versionen, um die Apache-Lizenz und den Urheberrechtshinweis beizubehalten.

• Die Software wird von den Autoren „wie besehen“ und ohne Gewährleistung bereitgestellt.

• Benutzern werden von Mitwirkenden keine Patentrechte gewährt, aber Mitwirkende können Patenterteilungen für frühere Beiträge nicht widerrufen.

• Die Lizenz erfordert keine abgeleiteten Werke, um die Apache-Lizenz zu übernehmen. Aus Gründen der Konsistenz wird dies jedoch empfohlen.

Laden Sie eine neue Version auf PyPi hoch

Wenn Sie noch nie Setuptools, Garn usw. auf Ihrem Computer ausgeführt haben, gehen Sie wie folgt vor:

 python3 -m pip install --user --upgrade setuptools wheel twine build

Um einen Build zu erstellen, erhöhen Sie zunächst die Version in pyproject.toml :

[ project ]
name = "pyscript-ltk"
version = "0.1.22"

Dann bauen Sie das Paket in eine Quelldistribution und ein Python-Rad ein:

 python3 -m build

Überprüfen Sie dann, ob der Build für Pypi funktioniert:

 twine check dist/*

Dann laden Sie es in die Pypi-Testumgebung hoch:

 twine upload --repository pypitest dist/*

Wenn der Pypi-Test-Upload schließlich einwandfrei zu funktionieren scheint, führen Sie Folgendes aus:

 twine upload dist/*

Wenn Sie eine Fehlermeldung erhalten, dass eine bestimmte Version bereits existiert, überprüfen Sie den Inhalt des dist -Ordners.