Swyftのユーザーインターフェイス その3
クラスメソッドさんの会議室をお借りして、第76回Cocoa勉強会関東 を開催しました。
そこで、「Swyftのユーザーインターフェイス」の発表を行いました。
内容は、
- SwyftUIとは何かの説明
- MacOSXでSwiftyUI(のサブセット)を実現するアプリケーションの解説
- SwyftUIで使用する、キーボードの自作
なお、かな英数キーをLeapキーの代わりに使用しているので、JISキーボードであれば自作しなくともソフトウエアは使用できます。
プロジェクトファイルは、 TestTextEdit.zip に、pdfファイルは、 SwyftUI.pdf に置いておきます。
Swyftのユーザーインターフェイス その2
コードを書く前に、LEAPキーの状態遷移を書き出してみる。
まずはイベントの種類
| イベント名 | 説明 |
|---|---|
| LF下 | LEAP Forward keyDown event |
| LF上 | LEAP Forward keyUp event |
| LB下 | LEAP Back keyDown event |
| LB上 | LEAP Back keyUp event |
| Tab下 | Tab keyDown event |
| Tab上 | Tab keyUp event |
| その他 | その他のキーイベント |
SwyftではLeapキーを押している間だけ検索する。そのため、keyDownとKeyUpを区別する必要があり、keyDownイベントとkeyUpの2つのイベントを分けている。 TabキーはLeapキーとの組み合わせで再検索を行うためにイベントを追加した。
次に状態の種類
| 状態名 | 説明 |
|---|---|
| normal | 通常状態。各種キー入力はそのままTextViewへ渡される |
| findF | 前方検索状態。各種キー入力された文字列が検索文字列として前方逐次検索される |
| findB | 後方検索状態。各種キー入力された文字列が検索文字列として後方逐次検索される |
| select | 選択状態。現在のカーソル位置とマークされた位置を選択状態にする。 |
状態遷移図を書くとこんな感じ。
![digraph foo { {rank = same; normal} {rank = same; findF; findB} {rank = same; select} "normal" -> "findF" [ label = "LF下" ]; "normal" -> "findB" [ label = "LB下" ]; "normal" -> "normal" [ label = "その他" ]; "findF" -> "select" [ label = "LB下" ]; "findF" -> "normal" [ label = "LF上" ]; "findF" -> "findF" [ label = "その他" ]; "findB" -> "select" [ label = "LF下" ]; "findB" -> "normal" [ label = "LB上" ]; "findB" -> "findB" [ label = "その他" ]; "select" -> "findF" [ label = "LB上" ]; "select" -> "findB" [ label = "LF上" ]; "select" -> "select" [ label = "その他" ]; }](_images/graphviz-062fea56832a7297e9f25e74f1a78c5ab964b0cc.png)
眠いから、状態遷移表はまた次に書く。
Swyftのユーザーインターフェイス その1
Swyftとはなんぞや？
Swiftではない。
Swyftは、ジェフ・ラスキンによって開発されたテキスト編集用のユーザーインターフェイスです。 Leapキーと呼ばれる2つのキーを使用した、逐次検索を主体とした操作体系が特徴です。
こんな画像のようなキーボードで操作します。(ウィキペディアのCanonCatより) もちろん私は使ったことはない。以下の文献を元に使用感を想像するだけ。
以下の文献をふんわりと心の目で見て妄想する。
ジェフ・ラスキン本人がSwyftについて解説している。第5章「統一化」で、Swyft特有のキーボード操作について解説している。
AppleII用のソフトウェアSwyftWareの使用レポート。日本語でSwyftの雰囲気がわかる貴重な文献です。 私にとっては、「ヒューメイン・インタフェース」より解りやすかった。
SwyftのUIを採用している、CanonCatの雰囲気がわかる。キー操作と画面の関係はこの動画を見ると腑に落ちる感じ。
そして、冬休みの工作の時間が始まる。
LEAPキーがないから作る
まずは、Leapキーがあるキーボードをデッチ上がる必要がある。
で、コレ。冬休みの工作としては良くできた。
HHKと 英数/かなキーボード を2個位置しただけ。 英数/かなキーボードは、基盤だけ自作の傾斜台に釘で打ち付けた。
スペースキーの前にキーを置くのは想像以上に打ちやすい。ただし、キーボードの配置そのものよりもキーの高さが打ちやすさに関係していると思われる。
スペースキーを押したときの高さよりも、Leapキーの高さが低い必要がある。 そうしないと、スペースキーを押したときにLeapキーを誤って押してしまうことがあった。
LEAPキーの検索を日本語対応させる
逐次検索を主体としたUIなのに、日本語ではかな漢字変換が間に入るために、操作性が低下してしまう。 この問題の解決はすでに先人が解決していて、
逐次検索を行うには、 migemo を使用する。で解決。
以前、OSX内蔵の辞書を使ったmigemoもどきを作ったが、非公開APIを使った実装になってしまったので、素直に C/migemo を使うことにした。
が、なんか上手く行かない。
LEAPキーを押したときだけ、検索をするようにする
Leapキーを使った操作系なのだが、これもまだ上手く行かない。
右上のパレットは、Leapキーと関連するキーの状態を表している。
[NSEvent addLocalMonitorForEventsMatchingMask: handler:]
を使って、キーの変更を捉えている。
今日は、ここまで。
BDRuleEngine
BDRuleEngineは以下のサイトで配布しているルールエンジン。 http://eschatologist.net/bDistributed.com/
10年以上前にObjective-Cで書かれた。WebObjectsのDirectToWebのルールエンジンを再実装したものらしい。 前々回のCocoa勉強会で手直ししたものを発表したので、zipでまとめておく。
手直しの内容は、
- BDQualifier was replaced by NSPredicate.
- BDSortOrdering was replaced by NSSortDescriptor.
- BDControl was replaced by cocoa binding.
- Adds BDExpressionAssignment class.
プロジェクトファイルは以下からダウンロードできる。