穴黒工房

作品情報

作品名:
穴黒工房(あなくろこうぼう)
作者名:
はりまお
制作機材:
Core i7-4770 3.40GHz + 8GB RAM
Windows 10 Pro  (64bit, 22H2)
動作環境:
.NET Framework 4.8

画面写真

穴黒用デザインツール
穴黒用デザインツール

ファイル構成

名前概容
アプリケーション
AnaClo_Workshop.exe 実行ファイル
AnaClo_Workshop.exe.config アプリケーション構成ファイル
AnaClo_Kit.dll 時計部品クラスライブラリ
ColorSupplement.dll 色機能クラスライブラリ
FontSupplement.dll フォント機能クラスライブラリ
ドキュメント
Readme_Workshop.txt 説明文(本文)

※ 穴黒工房は、『穴黒』に収録されています。

概要

『穴黒』用の意匠設計(デザイン)ツールです。設定や外観の作成・切り替えを担います。

使い方

『穴黒』のメニューから意匠設計をクリックすると起動します。
終了は、右上の×(閉じるボタン)で行います。終了と同時に、仕様書(動作設定)が保存・適用され、一覧で選択されている構成書(時計の外観データ)が『穴黒』に採用されます。
ただし、"AnaClo_Workshop.exe"を直接起動した場合は、『穴黒』を再起動しないと反映されません。

『穴黒工房』は、左側の構成書一覧と、3つのタブで構成されています。
仕様書タグでは、時計の動作を設定できます。
構成書タグでは、時計の外観を作成できます。
工房タグでは、『穴黒工房』の設定やバージョン情報の確認ができます。

構成書の編集は、一覧から対象を選択するか新規作成して始めます。作業が終わったら、適宜構成書名(ファイル名)を入力して保存ボタンをクリックしてください。
時計は、内部的に1000px四方で構成されており、各部品の編集に用いる寸法や座標もこれに準じます。
別ウィンドウとして試作台(プレビュー)を表示できるので、全体試作ならびに部品試作ボタンで状態を確認しながら制作を進められます。
白紙や完全に透明な構成書を採用してしまうと、穴黒を見つけるのに苦労するのでご注意ください。

穴黒のメニュー
穴黒のメニュー
穴黒工房 と 構成書タグ
穴黒工房 と 構成書タグ
試作台
試作台

図形の頂点を生成してみる

多角形の加工タグに、頂点群生成機能があります。この機能を使うと、簡単に正多角形を(頂点数を多くすれば円形も)作れます。

応用編 … 星形を作る。
  1. 半径250、頂点数10を指定して、新規をクリックする。
  2. 半径100に変更。抽出にチェックを入れ、2頂点目から10頂点目まで2頂点毎に設定し、差し替えをクリックする。
Step 1
Step 1
Step 2
Step 2
応用編 … 歯車を作る。
  1. 半径500、頂点数48を指定して、新規をクリックする。
  2. 半径350に変更。抽出にチェックを入れ、3頂点目から48頂点目まで6頂点毎に設定し、差し替えをクリックする。
  3. 4頂点目からに変更し、差し替えをクリックする。
  4. 5頂点目からに変更し、差し替えをクリックする。

加工タグには他に 鏡面合成, 拡大縮小(反転), 平行移動, 回転があり、また外形タグの逆順, 外形(全頂点)をコピー, コピーした外形を選択位置に挿入,削除ボタンと組み合わせれば、少し凝った図形を作れるかもしれません。

プロジェクトについて

「もっとモダンなデザインツールを作れるぜ」と仰る方、ぜひ制作してください。"AnaClo.exe.config"にデザインツールのパスが記述されているので、それを書き換えると『穴黒』のメニューから呼び出せるようになります。
『穴黒』は、デザインツールの終了を監視しており、終了コードとして1(ClockInformation.ComposerExitOrder.BrundNew)を受け取ると、動作や外観を更新する仕掛けになっています(これは正攻法なのか不安)。

各種フォルダやファイルとの関係

クラスライブラリ"AnaClo_Kit.dll", "ColorSupplement.dll", "FontSupplement.dll"は、時計に必要な機能を提供します。

アプリケーション構成ファイル"AnaClo_Workshop.exe.config"には、仕様書や構成書格納フォルダのパス・ウィンドウ配置・設定内容が記録されます。

起動時に構成書格納フォルダが存在しなければ、試供品を含めて作成されます。

仕様書や構成書は共にXMLファイルとして出力されるので、テキストエディタで書き換えられます。
ただし、ソリューションを通して厳密な整合性確認や例外処理ができていないため、想定を超えて改変されたXMLを読み込むと、動作が破たんする可能性があります。逆に、本作の調整範囲を(.NETの仕様の範囲内で)拡大することで、更なるカスタマイズを追求できる余地が残っていると言えます(未検証な無責任発言です)。

制作後記

比較的思惑通りに実装できた『穴黒』。
アナログ時計は、基本的な図形と文字の組み合わせで表現できると確認できた。これら部品をクラスとして定義できた。よしよし、順風満帆。
残るは、デザインツールの制作のみ。もう部品はクラスになっているのだから、それをXML(標準のシリアライザがXMLだから)として吐き出すだけ。お茶の子さいさい。
…のはずだったのに、勢い込んで手を付けた一瞬間、ピタリと指は止まった。なぜだ、何を間違えたというのだ。

個々の部品は一見単純なれど、形状・輪郭・塗り・配置などなどパラメータ数は存外多く、意匠を高める程に輪をかける。
幾多のパラメータを集成し、それを幾重にも集積し、さらに積層し、最終的には時計へと組み上げる。こんな、『変数の束の配列の配列を手軽に操れるUI』って一体全体どんな姿なのか、どこから手を付けりゃいいのか。

五里霧中な脳内。進路を見失いさ迷っていると、一つの自問に突き当たった。
「マークアップで図形を記述する + 図形を組み合わせて絵にする = 『SVG』じゃないか!?」…「もしや、『デザインツールの制作』 ≒ 『ドローソフトの開発』じゃないのか?」
いやまぁ、さすがに大げさだけど、そっち方向なのは明らか。巨人WYSIWYGと渡りをつける器量など、木っ端プログラマ(プロなどおこがましい、アマだ、アマグラマだ)の作者が持ち合わせているはずもない。
一時はスッパリ諦めて、「XMLの手打ちでデザインできますよ♡」ってことでお茶を濁そうとしていた。それほどまで、思案の渦に飲み込まれていた。
待て待て、そもそもグラフィカルな編集なんて目指していない(夢は見たけど)。とにかく数値を弄れればいいのだ。物量の問題など時間が解決してくれるさ、きっと、たぶん(…でも早く仕上げたいよなぁ)。

Inkscapeで描いた時計
Inkscapeで描いた時計

おもむろに吹き出した風。霧を吹き払っていくと、また一つの真実が浮かび上がってきた。
あんなに絵を描くのを嫌ったくせに、アイコンを描いているという現実。それも、あっさりと、何の疑念も抱かず、いや、むしろ楽しみながら、時計の絵を、Inkscapeで、しかも、意外と簡単で…。
なんてことだ、SVGで描くなら部品の作成・加工なんて無用じゃないか! SVGで作ったシェープを、読み込んで表示して回転すりゃ済むじゃないか!!
だけど、WPFでは直接SVGを扱えない…(NuGetで拡張機能("SharpVectors")を拝借すれば可能だけど、英語で詳細がわからないし、標準でない他人のコードを内包して配布するのは柄じゃない気がして)。
そんな折、マイクロソフトが“Project Reunion(Windows App SDK)”を発表。WinUI 3.0で、Win32(WinForms, WPF)とUWP(WinRT)をガッチャンコすると言う。WPFからWinRTを触れるということは、WPFでSVGを扱えるということ(だよね?)。期待せずにはいられない。WinUI 3.0が降臨した暁には、穴黒を創り直そうと密かに心に刻むのであった。

………

駄目だ駄目だ、場末のアマグラマに救いの手が届くなんて何年先だ。そんな悠長なことなど言ってはいられない。
二進も三進もいかないと苦悶しながらも、できる所から試行錯誤を繰り返していたら、なんとなく形に成ってきた。できた所から周りを埋めている内に、一通り動くようになった。
編集加工行程が野暮天なのも、補助機能が貧弱なのも否めない。手に負える規模に納めようと、デザインの自由度を下げたのも確かだ。
でも、必要な機能はほぼ揃えられた。プレビューも実装できた。試供品作りを楽しめる程度の完成度には辿り着けた。いやぁ~、想像を絶する歳月を費やすことになったけど、想像を超える満足感を得られた。それに、WinUI 3.0という道も見えた。あぁ、夢は膨らむばかり。

実は、今回のプロジェクトには裏テーマがありまして。
当初は、リッチテキストを使ってドキュメントを装飾するようなアプリを構想していた。装飾には、色やフォントの選択が不可欠。されど、そんなダイアログを提供する気などサラサラないWPFさん。WinFormsさんに出張ってもらえと言いたいのかもしれないけど、外観の雰囲気が違うし、扱うデータにも差があったりして、どうにも反りが合わない。なら、自家製だ。そんなこんなで生まれたのが、今回使っている"ColorSupplement.dll"と"FontSupplement.dll"。
ところが、肝心のアプリの仕様が煮詰まらず立ち消えに。行き場を失ったDLL兄弟。このまま飼い殺しでは浮かばれまい。何か実地試験の場を与えねば。
「気軽にサクッと作れて色やフォント選択が必要なアプリケーションはないかいな?」と見まわしたところ、アナログ時計に白羽の矢が立っていたわけ。ホント『気軽にサクッと』のはずだったのに…。これが、数年に及ぶ新作不毛期間の内幕だったりする。

Ver.1.1.2.0 ~ Ver.1.2.0.0 の回顧録

大きな変更点である新部品『連結線』や破線に頂点群加工機能などが目立つけれど、これらは全くもって本命ではない。単に図形の基本要素である『線』が欠けていると思っただけ。
むしろ、作者を最も突き動かしたのは『数値入力コントロールの最小⇔最大値間の循環』の方。これが当初から実に欲しい機能だった。
この機能には、『下限または上限に達した段階で一旦停止し、改めて増減操作し直すと循環する』動作が必須だと考えていた。けれど、頭では大した仕組みではないと感じていながらも、上手くロジックを組めず泣く泣く諦めていたのだ。
それが、ある日突然ふと閃いてしまった。何の事は無い仕掛け。なぜ、あの時これが書けなかったのか…摩訶不思議ではあるが、実に気分は晴れやかである。
ほんの小さな改善のつもりで手を付けたのに、もう楽しくて楽しくて、とめどなく湧き出す改造欲には抗えず、気付けば保存ファイルに影響しないあらゆる方面に手を突っ込んでいた。存外に傾注してしまったとは言え、本作の象徴(アイコン)である歯車時計を簡単に描けるようになって胸がすいたのもまた事実だ。