見出し画像

TWSNMP FC:Wails V2でWindows 98風の設定ツールを作り始めるが文字を入力できない問題で諦めかける

昨日から Wails v2

を使ってTWSNMP FCの設定ツールを作り始めました。まずは、作りたい機能が実現可能かテストプログラムでいろいろ試してみています。
画面表示のテンプレートは、Svelte

にしました。画面のデザインのためのCSSは、前に見つけたWindows 98風の画面が表示できる

を使って見ることにしました。洋服や音楽でも古いものが最近流行っているようなのでパソコンのソフトも古いデザインが流行るかもしれないと勝手に思って決めました。
SvelteにCSSを組み込む方法は、

を参考にしました。
昨日の夕方、これらを組み合わせて、

Mac OSの上で動くWindows98風の設定ツール

のような画面ができました。表示できた瞬間、かなり嬉しくなりました。
でも、操作してみると文字入力ができません。ボタンは反応していますが、スライダーも反応しません。
Wails v2がベータ版だからか?Windows 98風のCSSと組み合わせが良くないのか? いろいろ悪いこと考えて、やっぱり、この方法は諦めようと思って昨日は寝ました。

今朝は4時半に起きました。助手の猫が天から「 Wailsのサンプルでは入力できる!」と言ったような気がしました。そこで、サンプルの入力部分のソースを私が作ったものに埋め込んでみました。ちゃんと入力できます。
違いを比べてみると、

	<div id="input" data-wails-no-drag>
		<input id="name" type="text" bind:value={name}>
		<button class="button" on:click={greet}>Greet</button>
	</div>

のdata-wails-no-dragの有無でした。この設定は、https://wails.io/docs/guides/frameless/

によると画面のどこをドラッグしてもWindowを移動できるようにするためのもののようです。この設定を入力する部分にいれると、ちゃんと入力可能になりました。
入力問題が解決した瞬間に、やる気がでてきて、昨日は諦めようと思っていたWails v2 + Svelte + 98.cssで作ることにしました。(また、挫折するかもしれませんが)
その後、いろいろ試して、

TWSNMP FC管理ツール

のような画面になりました。フォントがギザギザなのが懐かしい感じがします。
フォルダーの選択は、

フォルダー選択の画面

のような感じで、これは動作するOSが表示しているのでWindows 98風にはなりません。
Windows環境でも動かしてみました。

Windows環境で動かした場合

動作はしますが、タイトルバーを何とかする必要がありそうです。
Windowsで起動した時に

EdgeのWebview2 Runtimeのインストール

が実行されました。1回目だけかと思いましたが、2回目も画面は表示されました。2回目はインストールを実施していないようです。
これも調べる必要がありそうです。
なんとなく方向性が見えてきたので、GitHubにリポジトリを作って本格的に開発をはじめようと思います。思ったより大作になりそうです。

明日に続く


開発のための諸経費(機材、Appleの開発者、サーバー運用)に利用します。 ソフトウェアのマニュアルをnoteの記事で提供しています。 サポートによりnoteの運営にも貢献できるのでよろしくお願います。