TWSNMP FC:Wails V2でWindows 98風の設定ツールを作り始めるが文字を入力できない問題で諦めかける
昨日から Wails v2
を使ってTWSNMP FCの設定ツールを作り始めました。まずは、作りたい機能が実現可能かテストプログラムでいろいろ試してみています。
画面表示のテンプレートは、Svelte
にしました。画面のデザインのためのCSSは、前に見つけたWindows 98風の画面が表示できる
を使って見ることにしました。洋服や音楽でも古いものが最近流行っているようなのでパソコンのソフトも古いデザインが流行るかもしれないと勝手に思って決めました。
SvelteにCSSを組み込む方法は、
を参考にしました。
昨日の夕方、これらを組み合わせて、
のような画面ができました。表示できた瞬間、かなり嬉しくなりました。
でも、操作してみると文字入力ができません。ボタンは反応していますが、スライダーも反応しません。
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で作ることにしました。(また、挫折するかもしれませんが)
その後、いろいろ試して、
のような画面になりました。フォントがギザギザなのが懐かしい感じがします。
フォルダーの選択は、
のような感じで、これは動作するOSが表示しているのでWindows 98風にはなりません。
Windows環境でも動かしてみました。
動作はしますが、タイトルバーを何とかする必要がありそうです。
Windowsで起動した時に
が実行されました。1回目だけかと思いましたが、2回目も画面は表示されました。2回目はインストールを実施していないようです。
これも調べる必要がありそうです。
なんとなく方向性が見えてきたので、GitHubにリポジトリを作って本格的に開発をはじめようと思います。思ったより大作になりそうです。
明日に続く