Closed7

Owlkettleについて調べる

NeoNeo

https://github.com/can-lehmann/owlkettle

  • GTKベースのNim製GUIライブラリ
  • マクロによる宣言的UI
import owlkettle

viewable App:
  counter: int

method view(app: AppState): Widget =
  result = gui:
    Window:
      title = "Counter"
      default_size = (200, 60)
      
      Box(orient = OrientX, margin = 12, spacing = 6):
        Label(text = $app.counter)
        Button {.expand: false.}:
          text = "+"
          style = {ButtonSuggested}
          proc clicked() =
            app.counter += 1

brew(gui(App()))

実行結果↓(画像とコードはREADMEより)

NeoNeo

guiマクロの書き方

guiマクロ内では、Widgetを次のように書ける

Widget(arg1 = ..., arg2 = ...):
  arg3 = ...
  Widget:
    proc someProc1() =
      ...

引数は、Widgetに続くカッコ内とWidgetのブロック内どちらにも書ける。また、Widget側であらかじめ指定されているプロシージャ(Event)を実装できる

NeoNeo

Window

  • 一番最初に定義されるWidget
  • HeaderBarWindow直下にのみ定義できる
  • ウィンドウを閉じるときに実行されるEventclose()を持つ
Window:
  Label(text = "Hello, world")
NeoNeo

Box

  • 複数のWidgetを一列に並べて表示する
  • 引数orientOrientXで横、OrientYで縦に並べる
Box:
  orient = OrientX
  Label(text = "Label")
  Button(text = "Button") {.expand: false.}
NeoNeo

Overlay

  • 複数のWidgetを重ねて表示する
  • 1つ目の子Widget以外に{.addOverlay.}をつける
Overlay:
  Label(text = "1st label")
  Label(text = "2nd label") {.addOverlay.}
  Label(text = "3nd label") {.addOverlay.}
NeoNeo

Label

  • 文字列を表示する
  • 引数ellipsizeで、文字がWidgetのサイズを超える場合にどの部分を三点リーダに置き換えるか指定する(End, Middle, Start)
  • 引数wrapがtrueだとWidgetのサイズから文字がはみ出さない(サイズ上限で折り返す)
  • 引数useMarkupがtrueだと渡した文字列内のHTMLタグを反映してくれる
Label:
  text = "Test ".repeat(50)
  ellipsize = EllipsizeEnd
Label:
  text = "Test ".repeat(50)
  wrap = true
Label:
  text = "<b>Bold</b>, <i>Italic</i>, <span font=\"20\">Font Size</span>"
  useMarkup = true
NeoNeo

Entry

  • フォームを作れる
  • 引数placeholderでプレースホルダを設定
  • 引数visibilityでパスワードのような可視化の設定
  • 引数invisibleCharで不可視化時の文字を設定。デフォルトは*
  • イベントchanged(text: string)は文字の入力時に実行される
  • イベントactivate()はEnterを押されたとき実行される
Entry:
  text = app.text
  proc changed(text: string) =
    app.text = text
Entry:
  text = app.query
  placeholder = "Search..."
  proc changed(query: string) =
    app.query = query

  proc activate() =
    echo app.query
Entry:
  placeholder = "Password"
  visibility = false
  invisibleChar = '*'.Rune
このスクラップは2023/01/22にクローズされました