FileMakerでメディア管理 – サムネイルのタイルビューを作った その3。ビューのために追加するレイアウトについて。
このページ内の見出し
レイアウト
タイル状のビューを行うレイアウトがひとつ必要です。そして、試作品ではプレビュー用のレイアウトもひとつこしらえています。タイルビューで画像をクリックしたら、プレビューウインドウがカードスタイルで現れるという仕様です。
カードスタイルをやめて新規ウインドウにしたり、そもそもプレビューウインドウを使わず直接画像データベースのメイン画面にジャンプしてもいいんです。なんでもいいんです。ここではカードスタイルのプレビューウインドウです。
※ スタイルと書きましたが、FileMakerの用語についてまとめたこちらの記事もご参考に。 → FileMaker ウインドウに関する忘れがちな用語のまとめ
タイルビューのレイアウト
タイルビューのレイアウトにWebビューアを配置します。

レイアウト編集画面はこう。仕組みはwebビューアを配置しているだけです。

このレイアウトではWebビューア幅が380pxくらいでしょうか、小さく作っています。そうすることで小さなモニターで小さく表示できます。
「自動サイズ調整」でフレキシブルに設定することを忘れないようにしましょう。四方をロックすることで、ウインドウサイズに追随します。

Webビューアの左側を空けているのは、後々ここにサイドメニュー的なフィールドやインターフェイスが配置されることを想定しているからです。
Webビューアの設定
webビューアの設定で表示させるアドレスを指定します。
表示させるのは生成したHTMLです。
フィールドに作成してそれを指定しています。その名も「HTML生成」。もうちょっとましな名前を付けるのがよろしいかと思います。フィールドを使わず、計算式をWebビューアの設定の中に直接書いてもいいです。

プレビューのレイアウト
プレビューウインドウのレイアウトです。こちらも単純なものです。画像データベースのメインイメージを配置しているだけです。

Webビューアの配置と同じように、画面は小さく、イメージは大きく。自動サイズ調整でしっかり可変サイズにしておきます。
ここでは戻る進むボタンを配置しています。プレビューウインドウに戻る進むボタンがいらないなら取っ払いましょう。
タイルビューに必要なレイアウトについてでした。次回はフィールドを説明します。
→ 次のお話 その4 フィールド