Viewer
Viewerコンポーネントは、プロジェクト実行中に生成される画像ファイルなどをブラウザから確認するためのコンポーネントです。 表示可能なファイルは次のとおりです。
- apng (Animated Portable Network Graphics)
- avif (AV1 Image File Format)
- gif (Graphics Interchange Format)
- jpeg (Joint Photographic Expert Group image)
- png (Portable Network Graphics)
- webp (Web Picture format)
- tiff (Tagged Image File Format)
- bmp (BitMaP image)
- svg (Scalable Vector Graphics)
Viewerコンポーネントに指定できる固有のプロパティはありません。 また、Viewerコンポーネントにはoutput filesプロパティを設定することはできません。
Viewerコンポーネントの挙動
Viewerコンポーネントは先行するコンポーネントの実行終了後にinput filesから接続されたファイルを受け取ります。
input filesに “./” と設定した場合について
input filesに ./ と設定することで、input filesとして渡されるファイル（Viewerコンポーネントで表示可能な拡張子が対象）はすべてViewerコンポーネントディレクトリ直下に置かれます。
これらのファイルに、ブラウザで表示可能な画像ファイルが含まれているときは、初回のみブラウザ上にダイアログが表示されます。 ok ボタンをクリックすると別のタブでビューワー画面が表示されます。
また、画面上部の open viewer screen ボタンが有効になり、以降はこのボタンをクリックすることでビューワー画面を表示することができます。
ビューワー画面
ビューワー画面には、input filesから受け取ったファイルがタイル表示されます。
タイル表示から表示したいファイルをクリックすると、スライドショー表示されます。
スライドショー表示時の操作方法
スライドショー表示時はツールバーが表示され、各ボタンにてファイルの表示を操作することができます。
| 構成要素 | 説明 | |
|---|---|---|
| 1 | zoomIn ボタン | 拡大表示します |
| 2 | zoomOut ボタン | 縮小表示します |
| 3 | oneToOne ボタン | 原寸表示します |
| 4 | reset ボタン | 表示状態をリセットします |
| 5 | prev ボタン | 前のファイルを表示します |
| 6 | play ボタン | 全画面表示します |
| 7 | next ボタン | 次のファイルを表示します |
| 8 | rotateLeft ボタン | 左に90°回転します |
| 9 | rotateRight ボタン | 右に90°回転します |
| 10 | flipHorizontal ボタン | 左右反転します |
| 11 | flipVertical ボタン | 上下反転します |
スライドショー表示の終了方法
スライドショー表示を終了する場合は、右上の × ボタンもしくはファイル以外の任意の場所をクリック、または Esc キーを押下します。