FileMakerで一覧画面から「詳細をサクッと編集したい」と思った時、別レイアウトに移動したり、新しいウィンドウを開いたりするのは少し面倒ですよね。そこで便利なのが「カードウィンドウ」を使ったモーダル編集画面です。画面遷移を最小限に抑えつつ、分かりやすい編集用の小窓を表示できるので、操作性も見た目もすっきりします。
この記事では、専門用語をできるだけ避けながら、カードウィンドウを使ったモーダル編集画面の基本的な考え方と、実装の流れを分かりやすく紹介します。
カードウィンドウとは？モーダル画面との違い
カードウィンドウは、FileMaker Pro 16以降で使えるウィンドウの表示方法です。もともとの画面（元ウィンドウ）の上に、小さな「カード」のようなウィンドウを重ねて表示できます。
- 元の画面は見えているが、操作はカードウィンドウ側に限定される
- 背景を半透明にして「奥にある」雰囲気を出せる
- 画面の中央など、位置やサイズを細かく指定できる
一般的な「モーダル画面」と同じように、「閉じないと次の操作に進めない」編集用ダイアログとして使えるのがポイントです。エラーメッセージや確認ダイアログだけでなく、「1件分のレコードをじっくり編集する画面」としても活躍します。
どんな場面でカードウィンドウが便利？
カードウィンドウによるモーダル編集画面は、次のようなケースで特に効果を発揮します。
- 一覧レイアウトから、指定した1件のレコードだけを別枠で編集したい
- 小規模な入力フォーム（備考欄や詳細情報など）を、画面遷移せずに表示したい
- ユーザーに「ここで入力を完了してください」と明確に伝えたい
例えば、顧客一覧画面に「編集」ボタンを付けておき、そのボタンを押したらカードウィンドウで「顧客詳細編集」レイアウトが開く、といったイメージです。ユーザーは一覧の状況を頭に残したまま編集でき、編集が終わればカードウィンドウを閉じてすぐ一覧に戻れます。
カードウィンドウを使った編集画面の基本構成
モーダル編集画面を作るときは、次の3つを用意すると分かりやすくなります。
- 編集用レイアウト（カードウィンドウで表示するレイアウト）
- カードウィンドウを開くスクリプト
- 「保存」「キャンセル」などのボタンと、それに対応するスクリプト
あらかじめ「編集用レイアウト」を1つ作っておけば、同じレコードテーブルを使う別の画面からも流用できます。デザインをすっきりまとめられるので、保守も楽になります。
ステップ1：編集用レイアウトを作る
まずはカードウィンドウに表示する専用レイアウトを用意します。
- レイアウトモードを開く
- 対象のテーブルを元に、新しいレイアウトを作成する
- 幅・高さはカードウィンドウで表示したいサイズをイメージして決める（例：幅600px、高さ400px程度）
- 必要なフィールドと、画面下部に「保存」「キャンセル」ボタンを配置する
ポイントは、一覧レイアウトよりも情報を少なめにして「編集しやすさ」を優先することです。入力してほしい項目に絞り、ラベル（フィールド名）も分かりやすく整えましょう。
ステップ2：カードウィンドウを開くスクリプトを作る
次に、カードウィンドウを表示するスクリプトを作成します。大まかな流れは以下の通りです。
- 編集したいレコードを指定する（ボタンを押した行のレコードなど）
- 「新規ウィンドウ」スクリプトステップで、スタイルに「カード」を選択
- 表示したいレイアウトに切り替える（「レイアウト切り替え」スクリプトステップ）
- 適宜、ウィンドウのタイトルやサイズ、背景の暗転（ダイム）などを設定
「新規ウィンドウ」→「スタイル：カード」とすることで、元の画面の上にモーダル風の小窓を開くことができます。ウィンドウオプションで「閉じるボタンを表示」や「ツールバーを表示」なども制御できます。
ステップ3：「保存」「キャンセル」の動きを決める
カードウィンドウの中で、ユーザーが必ず触れるのが「保存」と「キャンセル」のボタンです。この2つにはそれぞれスクリプトを割り当てておきましょう。
- 保存ボタン：レコードをコミット（保存）し、「元のレコードに戻す」などは行わず、そのままカードウィンドウを閉じる
- キャンセルボタン：編集中のレコードの変更を元に戻して（「レコードの復帰」スクリプトステップなど）、カードウィンドウを閉じる
レイアウトを「ブラウズモード」で開く場合は、レコードの変更をどのタイミングで保存するかも重要です。落ち着いて操作してもらいたい画面であれば、明示的に「保存」ボタンを押したときだけ「レコードを保存（コミット）」するようにしておくと分かりやすくなります。
ユーザーにとって使いやすいモーダル画面にするコツ
カードウィンドウを使ったモーダル編集画面は、設定次第で使いやすさが大きく変わります。いくつか簡単な工夫を挙げます。
- タイトルバーに「◯◯編集」など、目的が分かる名前を付ける
- 保存前に必須項目の未入力チェックを行う
- エラーメッセージはカードウィンドウ内に分かりやすく表示する
- 閉じるボタンをむやみに増やさず、「保存」と「キャンセル」に絞る
また、カードウィンドウのサイズが大きすぎると「ただの別ウィンドウ」と変わらない印象になってしまいます。最小限の情報に絞りつつ、横スクロール・縦スクロールが出ない程度の控えめなサイズに調整すると、モーダルらしい使い心地になります。
運用時に気をつけたいポイント
実際に運用するときには、次のような点にも注意しておくとトラブルを減らせます。
- カードウィンドウを開く前に、必ず編集対象のレコードが確定しているか確認する
- 一覧側でレコードを絞り込んだり並べ替えたりしても、カードウィンドウ側で混乱しないようにする
- スクリプトの中で「元のウィンドウに戻る」処理を入れておき、カードウィンドウを閉じた後の状態を分かりやすくしておく
特に、同じテーブルを複数のウィンドウで開く場合は、「どのウィンドウでどのレコードを見ているのか」がわかりにくくなりがちです。カードウィンドウ用のレイアウト名やスクリプト名に「Card」「編集用」などのキーワードを付けておくと、開発者側の管理もしやすくなります。
まとめ：カードウィンドウで編集体験をスマートに
カードウィンドウを使ったモーダル編集画面は、FileMakerの操作性を一段と高めてくれる便利な仕組みです。
- 一覧を見ながら、対象レコードだけを落ち着いて編集できる
- 画面遷移が少ないので、ユーザーが迷いにくい
- デザインを統一しやすく、システム全体の印象も良くなる
最初は「新規ウィンドウ（カード）」の設定に慣れる必要がありますが、一度パターン化してしまえば、他のレイアウトにも同じ仕組みを横展開できます。ぜひ、自分のシステムでも小さな編集用カードウィンドウから試してみて、ユーザーにとって使いやすいモーダル画面づくりに役立ててください。