Added the ability to display images related to tags

fai-9 commented 1 year ago

例えば https://note.com/aine_miyabi/n/n4dbadbcb882b のymlを使う時、タグの意味を視覚的に確認できると分かりやすいなと思い、タグにマウスカーソルを乗せると（あれば）画像が表示される機能を追加しました。

イメージ： https://github.com/blue-pen5805/sdweb-easy-prompt-selector/assets/132233681/60d69887-8bc7-4063-88b8-0842abd5d618

もし取り込んでいただける場合、お好きなように改変していただいて構いません。よろしくお願いします。

使い方

yamlファイルがある場所に、yamlファイルと同じ名前のフォルダを作成して中にタグ名と同じ名前で画像を置いてください。yamlファイルの中に階層がある場合はその階層でフォルダを作成してください。

例：

構図.yml

構図:
  上から: from above
  下から: from below
  横から: from side
  後から: from behine
  真上から: overhead shot
  顔アップ: close up

ファイルツリー

.
├── 構図
│   └── 構図
│       ├── 上から.png
│       ├── 下から.png
│       ├── 後から.png
│       ├── 横から.png
│       ├── 真上から.png
│       └── 顔アップ.png
└── 構図.yml

画像の拡張子はデフォルトは .jpg ですが、yamlファイルに .settings を追加して記載することで他の拡張子を使うこともできます。

例：

.settings:
  fileFormatForImages: png
構図:
  上から: from above
  下から: from below
  横から: from side
  後から: from behine
  真上から: overhead shot
  顔アップ: close up

fai-9 commented 1 year ago

インデントが元コードのルールに合っていなかったのを修正しました。また、画像の位置をタグの右側としており画面の右側に表示されているタグについては画像が見切れてしまっていたため、カーソルが画面半分より左にある場合は左端、右にある場合は右端に画像を寄せて表示するようにしました。 https://github.com/blue-pen5805/sdweb-easy-prompt-selector/pull/21/commits/df2c7b146aa6ab440688a460002333c5e68dd1a8

blue-pen5805 commented 1 year ago

前向きに検討します！

blue-pen5805 / sdweb-easy-prompt-selector

Added the ability to display images related to tags #21

使い方