https://github.com/grkek/haki
Build native apps using GTK4 and a dialect of HTML, declarative format allows you to create advanced structures with ease.
https://github.com/grkek/haki
codegen css gtk gtk4 gui html js native native-gui transpiler ui
Last synced: 8 days ago
JSON representation
Build native apps using GTK4 and a dialect of HTML, declarative format allows you to create advanced structures with ease.
- Host: GitHub
- URL: https://github.com/grkek/haki
- Owner: grkek
- License: mit
- Created: 2020-11-02T19:30:47.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-06-15T15:11:44.000Z (almost 2 years ago)
- Last Synced: 2025-04-27T06:52:59.341Z (8 days ago)
- Topics: codegen, css, gtk, gtk4, gui, html, js, native, native-gui, transpiler, ui
- Language: Crystal
- Homepage:
- Size: 1.39 MB
- Stars: 81
- Watchers: 4
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Haki
[](https://github.com/grkek/haki)
### GUI framework with GTK4 component generation using HTML, CSS and JavaScript
- None of the components generated by Layout contain anything remotely related to a Web-Browser.
- Compiled binary reads the custom HTML and builds the GTK components. Since it is already a pre-built release version, it is pretty fast at generating the UI components.
- The compiler supports CSS and JavaScript compilation, which glues the components and makes the UI interactive.
- The JavaScript engine is Duktape, it supports Babel 6.26.0 and CoreJS 2.6.11.
- The CSS is limited to GTK4 specification.
## Installation
Before you clone the shard and build it, install the GTK libraries.
Add this to your application's `shard.yml`:
```yaml
dependencies:
haki:
github: grkek/haki
```And run this command in your terminal:
```bash
shards install
./bin/gi-crystal
```# Code example
Add this to your `application.cr`:```crystal
require "haki"# Disable GC for now.
GC.disablehtml = <<-HTML
Hello, World!
HTMLbuilder = Haki::Builder.new
# Make sure you point the path the correct way.
builder.build_from_string(html)
```Compile the `application.cr` file.
```bash
crystal run application.cr -Dpreview_mt --error-trace
```And you should have a GUI window with a "Hello, World!" text.