A little toolkit for writing UIs in PyScript
Project description
ltk
LTK is a little toolkit for writing UIs in PyScript. See the LTK kitchensink or explore the docs rendered using LTK.
LTK is implemented as a declarative Python library and leverages jQuery
for DOM operations.
Installing LTK
Install LTK from pypi:
python3 -m pip install pyscript-ltk
Hello World
import ltk
ltk.Text("Hello World").appendTo(ltk.body)
Getting Started
To get started with LTK, we recommend you try it out on pyscript.com:
Widget Specification
New widget types are created by subclassing ltk.Widget
:
class HBox(Widget):
classes = [ "ltk-hbox" ]
By default, widgets are created as div
DOM elements. You can choose a different tag:
class Preformatted(Widget):
classes = [ "ltk-pre" ]
tag = "pre"
Creating a UI
To create a UI, elements are constructed declaratively:
ltk.Table(
ltk.TableRow(
ltk.TableHeader("header1")
ltk.TableHeader("header2")
),
[
ltk.TableRow(
ltk.TableData(value1),
ltk.TableData(value2),
)
for value1, value2 in data
],
)
Widgets are added to others by using jQuery
's append
and appendTo
calls:
ltk.body.append(
ltk.Table(...)
)
container = ltk.VBox(...)
ltk.H1("This is a header").appendTo(container)
Styling
Widgets can be styled using using three different approaches:
- Styling with element styles using
jQuery
'scss
function:
ltk.Text("Error: Flux capacitor low!")
.css("background-color", "red")
.css("color", "white")
.css("padding", 8)
- Styling using a
dict
to make it easier to share styles:
error = {
"background-color": "red",
"color": "white",
"padding": 8,
}
ltk.Text("Error: Flux capacitor low!", error)
- Styling using CSS classes and an external stylesheet, using
jQuery
'saddClass
function:
ltk.Text("Some text").addClass("my-special-text)
The external style sheet should have these rules:
.ltk-text {
font-family: Arial;
}
.my-special-text {
font-family: Courier;
background-color: red;
color: white;
padding: 8px;
}
External stylesheets can be included in the original index.html
or injected at runtime from Python using:
ltk.inject_style("https://example.org/awesome_styles.css")
Events
Event handlers are attached using jQuery
mechanisms.
def buy(event):
purchase(...)
Card("Buy Now").on("click", buy)
You can also use the more declarative decorator:
@ltk.callback
def buy(event):
purchase(...)
Card("Buy Now").on("click", buy)
Examples
See the LTK kitchensink or explore the examples
folder
Applications built using LTK
- PySheets (more details soon)
License
LTK is covered under the Apache License:
-
The Apache license is a permissive open source software license.
-
It allows users to freely use, modify, and distribute the software (including for commercial purposes).
-
Modified versions can be distributed without having to release the source code. Though source code changes should be documented.
-
The license requires modified versions to retain the Apache license and copyright notice.
-
The software is provided by the authors "as is" with no warranties.
-
Users are not granted patent rights by contributors, but contributors cannot revoke patent grants for previous contributions.
-
The license does not require derived works to adopt the Apache license. Though this is encouraged for consistency.
Upload new version to PyPi
First build the package into a source distribution and a Python wheel:
python3 -m pip install --user --upgrade setuptools wheel twine build
python3 -m build
Then verify whether the build works for pypi:
twine check dist/*
Then upload to the pypi test environment:
twine upload --repository pypitest dist/*
Finally, if the pypi test upload appears to work fine, run:
twine upload dist/*
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Hashes for pyscript_ltk-0.1.11-py3-none-any.whl
Algorithm | Hash digest | |
---|---|---|
SHA256 | 0dedcdb3b64b39d31896811eed2616d90ecd731ae5d61d277d3962f2b021aeb8 |
|
MD5 | 9b29a1dc7bdda3a1c93a73b36fb3035a |
|
BLAKE2b-256 | e8ad6bba9dbb40707077cfbd9c3a287b9b4976a371d5193eb949ade21cd2ae4c |