|
|
||
|---|---|---|
| .. | ||
| 7gui | ||
| gallery | ||
| iot-dashboard | ||
| memory | ||
| printerdemo | ||
| printerdemo_old | ||
| qt_viewer | ||
| slide_puzzle | ||
| todo | ||
| README.md | ||
Examples
These examples demonstrate the main features of SixtyFPS and how to use them in different language environments.
printerdemo
A fictional user interface for the touch screen of a printer
.60 Design |
Rust Source | C++ Source | Node Source | Online wasm Preview | Open in code editor |
|---|---|---|---|---|---|
ui.60 |
main.rs |
main.cpp |
main.js |
Online simulation | Preview in Online Code Editor |
gallery
A simple application showing the different widgets
.60 Design |
Rust Source | C++ Source | Online wasm Preview | Open in code editor |
|---|---|---|---|---|
gallery.60 |
main.rs |
main.cpp |
Online simulation | Preview in Online Code Editor |
todo
A simple todo mvc application
.60 Design |
Rust Source | C++ Source | Online wasm Preview | Open in code editor |
|---|---|---|---|---|
todo.60 |
main.rs |
main.cpp |
main.js |
Online simulation |
slide_puzzle
Puzzle game based on a Flutter example. See Readme
.60 Design |
Rust Source | Online wasm Preview | Open in code editor |
|---|---|---|---|
slide_puzzle.60 |
main.rs |
Online simulation | Preview in Online Code Editor |
memory
A basic memory game used as an example the tutorial:
.60 Design |
Rust Source | C++ Source | Online wasm Preview | Open in code editor |
|---|---|---|---|---|
memory.60 |
main.rs |
memory.cpp |
Online simulation | Preview in Online Code Editor |
iot-dashboard
A clone of one demo from the QSkinny framework.
Also show how a way to dynamically load widgets with the interpreter from C++.
.60 Design |
C++ Source | Online wasm Preview | Open in code editor |
|---|---|---|---|
main.60 |
main.cpp |
Online preview | Preview in Online Code Editor |
External examples
- cargo-ui: A rust application that makes use of threads in the background.
Loading the example with the viewer
Simply load the .60 file with the viewer application
cargo run --release --bin sixtyfps-viewer -- examples/printerdemo/ui/printerdemo.60
Running the Rust Examples
You can run the examples either by going into the rust sub-folder and use cargo run, for example:
cd examples/printerdemo/rust
cargo run --release
or you can run them from anywhere in the Cargo workspace by name:
cargo run --release --bin printerdemo
Wasm builds
In order to make the wasm build of the example, you first need to edit the Cargo.toml
files to uncomment the line starting with #wasm# (or use the sed line bellow)
You can then use wasm-pack (which you may need to obtain with cargo install wasm-pack).
This will generate the wasm in the ./pkg directory, which the index.html file will open.
Since wasm files cannot be served from file:// URL, you need to open a wab server to serve
the content
cd examples/printerdemo/rust
sed -i "s/^#wasm# //" Cargo.toml
wasm-pack build --release --target web
python3 -m http.server
Running the C++ Examples
- When compiling SixtyFPS from sources: If you follow the C++ build instructions, this will build the C++ examples as well by default
- From installed binary packages: Simply run cmake in one of the example directory containing a CMakeLists.txt
mkdir build && cd build
cmake -GNinja -DCMAKE_PREFIX_PATH="<path to installed>" ..
cmake --build .
Running the Node Examples
You can run the examples by going into the node sub-folder and use npm, for example:
cd examples/printerdemo/node
npm install
npm start