SwiftUI: テトリスとぷよぷよの盤面を再現するエディターを作ったよ
BoardEditor.app
テトリスとぷよぷよの戦略を練って訓練するために、盤面を再現できるエディターを作りました。
リポジトリのReleaseページから.dmgをダウンロードしてアプリをインストールできます。
技術的な話
普段私はメニューバー常駐型アプリばかり開発しているので、まともなWindowを持つようなアプリ開発経験が豊富なわけではないのですが、今回は普通のシングル・ウインドウ・アプリをSwiftUIで開発することになり新鮮でした。
セルをなぞって色を塗る
テトリミノの色やぷよを選択した後に、盤面のセルをなぞって配置するインタラクションを実装したくなり、SwiftUIでそういった実装はどうするのが一番いいのか知見がなかったのですが、私なりにやってみました。詳しくは別に記事にしてあります。
少し複雑なPathをSwiftUIで描画する
テトリミノは簡単な図形ですが、ぷよは少々難しい形状なため、描画するのにPathを使うのか画像を使うのか迷ったのですが、せっかくなのでPathを使うことにしました。そこで、ずっと昔にSVGの仕様を読み込んでNSBezierPathに変換するツールを作ったことがあったため、SwiftUIのPath版に翻訳するだけだと思っていたところ、昔作った仕組みはSVGの仕様に忠実でなく壊れていたことに気づきました。ということで、再びSVGの仕様を読みながら仕組みを実装し直しました。こちらも別途記事にしています。
SwiftUI: SVGをSwiftUIのPathに変換してコードを出力できるライブラリ作ったよ
テトリスエディタとぷよぷよエディタの切り替え
最初はNavigationViewとNavigationListを使った方法で実装していました。ただし、最初にウインドウが開いた時にテトリス/ぷよぷよのどちらかが選択されている状態にうまくできなかったので、TabViewで実装し直しました。しかし、今度はアイコン付きのラベルをツールバーに表示することができなかったため、最終的に.toolbar()とToolbarItem(placement: .status)を使う実装に落ち着きました。
おわりに
アプリを作るスキルがあれば趣味のためにツールを作れて楽しいですね。
このアプリを使ってテトリスのTスピン・トリプルを身につけることができましたし、ぷよぷよも少しは連鎖できるように頑張りたいです💪
Discussion