iPadなどのデバイスの向きに応じてレイアウトを自動的に切り替えつつ、最初に開くレイアウトを指定のレイアウトにし、ウィンドウを画面の中央に配置する方法の忘備録です。
管理人はFileMakerをiPadとPC(Windows)で使用しています。レイアウト描画領域はiPadの横画面サイズを基準で作成していますので、iPadでは元々画面サイズ一杯に表示されます。ウィンドウのセンタリング設定は主にPCで開く時に機能する感じです。
2021/03/08
誤った解説を修正し、説明不足部分を補填しました。
このページのコンテンツ
ウィンドウを上下左右中央に配置する
まずはセンタリングの方法です。
以下のスクリプトでレイアウト描画領域に自動調整されたウィンドウを、画面の上下中央位置に配置できます。
デバイス(iPad)の向きに応じてレイアウトを自動変更
iPad横用レイアウトとPC用レイアウトは共通で使用。iPad横用(PC用)のレイアウト分だけ縦用レイアウトを用意して切り替えます。
2021/03/08追記
以下の重要な説明が抜けておりました。
横用レイアウトと縦用レイアウトのレイアウト名は同じにした上で、それぞれレイアウト名の末尾に「横」か「縦」を判定させるためのワードの追加が必要です。
例:レイアウト名「顧客一覧」の場合、横用レイアウト名は「顧客一覧横」縦用は「顧客一覧縦」
これは、下記「各レイアウトに設定するスクリプト」の 5行目「変数を設定」の末尾で指定したワードになります。
各レイアウトに設定するスクリプト
上記を自動切り替えしたい横画面用レイアウトと縦画面用レイアウトのレイアウト設定→スクリプトトリガ→OnLayoutEnterとOnLayoutSizeChangeに指定します。
上記設定で画面の向きに応じたレイアウトの自動切り替えが可能になります。
センタリング+最初に開くレイアウト指定
iPad横画面用レイアウトをPCで開いた時に、ウンィンドウサイズをレイアウト描画領域に自動サイズ調整し、画面の中央にセンタリングします。
上記スクリプトを、APPのファイルオプション→スクリプトトリガ→OnFirstWindowOpenに設定します。
まとめ
以上の設定で、PCで開いた時はレイアウトの描画領域に合わせて自動的にウィンドウサイズが変更され、PC画面の上下左右の真ん中に配置されます。またiPadで開いた時は、横画面用レイアウトと縦画面用レイアウトが画面の向きに応じて、自動的に切り替わります。
この記事を書いた人管理人
SAKURAGRAPHICA代表
会社員の傍ら、フリーランスでWEBサイトの制作やWordPressによるCMSの構築・障がい者の就労支援としてホームページ制作の職業指導員も行っております。