投稿内容:「FileMaker(ファイルメーカー)のレイアウトがよく分かっていない初心者の方向けにまとめてみました。」
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOQo7Du0II3RwXM29J7DgAjz0a7EXBnpMWLqhCduy3-L8lEIYTskcolhZk0r3lJJCZzyqz4hd0udKNQUYMvbIQehNHtal7IUGwRjviyqa4TxoBoPrP8CLzNFnN0yL8aV3SA6HnevdEGvE/s400/%25E3%2581%25AF%25E3%2581%25A6%25E3%2581%25AA03.jpg)
FileMakerを導入して、さあ作るぞ!と思った時、最初のほうでぶつかる壁がレイアウトです。
はっきりいって、レイアウトを扱えないとFileMakerは作ることが出来ません。
全くもって先へ進めなくなってしまうという事態にもなりかねないのです。
そこで今回は初心者・初級者の方向けに、レイアウトに関して書いてみたいと思います!*難しい内容だったらスミマセン汗*(※注意※ FileMaker Pro 18を使用して解説しています)
★この辺はもう知っているというあなたはコチラ >【初級向け】FileMakerの超基本なレイアウト構成
広告
データを見るためまずは表形式にしてみる
新規のファイルを作成するところは大丈夫ですかね?(もしファイルの新規作成から不安なときはこちらの記事をご参照下さい ▶「FileMaker 制作の一番最初、新規作成でファイルを保存する」)
あなたは「新規作成」によってファイルをひとつ作成しました、という想定から始めます。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbQtou6uK-b4NoaoFbV2h5EP_9BEhwhe5Ff_0EX7zJ_pQI1GWhZBfr9C_fZzdZOefTQmXY8DQcWqlngosqQgzjcicQvFJm8UywrviWWSwU6IM7zZkj9H28-owDMucxDXcJNadrCB3enYI/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258800.png)
すると初期段階としてFileMakerが自動で色々と用意してくれます。
テーブル、フィールド、レイアウトです。
ここでは説明上、フィールドを3つ追加で作りました。
・シリアルキー(管理IDと思って下さい)
・フィールド01
・フィールド02
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUqc6fewaFMaZgSLDtSbbdDileSiaRJXk5IXZVtxFJ_dLQUKlWs-68pzVO00TwLawKkLOR2BYNvK37S_W-IGf4MnEwML5luxV6Vp-Xh3Lj8j_j7Bwf2_CHcA_xc8zLHexcjRmPXDjK-_g/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258800-2.png)
さて、自動で作られたレイアウトを見てみましょう。
データベースの管理を閉じるとこんな画面が表示されていないでしょうか。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha0tIzXC46RyP7zlHHgzSw6hJj_r8bHgIQ0VjoGokwpRIA3I3FHv1Vky0TPb5WOiAVt_Lm-ll5Hb8RGgXTzKtlUIHLVRCDFux8ZmzFPozPo-lFaIWZ1nQY2oqbIZWUsCFGXZFOen4XwSc/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258805.png)
この時点でもう「???」になる方も多いです。確かに、本当に初めての場合はよく分からないと思います。。。
では、次の赤丸の箇所をクリックしてみて下さい。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjOQa9hQEA3O95ZZMIvRejbbfd0NmrelrCnOPvqH_3fvNlNhxyS0OGbJwTm210KRtKR97s9HdYDhQfuN5XuGTmnQzC0WDbQBYORfMTYM6wWEu2E8Y8nEVXW82oLxRp6WdszXo_zS5Jpqg/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258806.png)
「表形式」と呼ばれるレイアウト形式に変わりました。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnK9oRwyvO5M4VqOP5HTJZY6g7j3hplhPZEhcxv9L1DzdJvWpNKHY-Fn8-IkVPvqkOS3jUv3wRjDnJLk1H8maCjctsf9hT15cMNS3Dv5Znt2VD1lYHpqhM1OvOzYAl-GYdIYMSZNjm6uY/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258807.png)
まずはこの画面のままでレコードやデータを追加してみて下さい。
データの追加は「新規レコード」をクリックしたり、ショートカット ctl + n (Windowの場合)でも追加できます。
そしてデータも入力してみます。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtpbcISw0vDrhfQi6Qwpw4ZBl4hD1pEQhFLv1VGBqESfYcLItMdckfvH5jzuDmQtn2HZjL_MD-Lb95uRMi2-gGN0ssu3gAC20YeS8HhhJM0zMZuPPTe8CeE_xUF2eoIgDs8_vCHKImJRM/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258808.png)
表計算ソフト(ex.エクセル)っぽいですよね。
レコードの件数が何件あるのか、データがどのように入力されているのか、そういった情報を見る方法として、この「表形式」が適していると僕は思います。
FileMaker、データベース、というものに慣れていない場合は、まずは「表形式」で色々試してみることをオススメします。
ところで、フィールドを追加した時には、レイアウト上にもフィールドを配置しないといけません。
「フィールド03」というフィールドをデータベースに追加したとします。
レイアウトモードで、レイアウト上に「フィールド03」を配置します。フィールドパネルからドラッグしたり、「フィールド02」をコピーして中身を「フィールド03」に変更するなど、どんな方法でも構いません。(画像はフィールド一覧からドラッグ配置した例)
(もしくは表形式の場合であれば、右上にある「変更」からもフィールドを表示することが出来ます。)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg70ANEUNM1Sizis0FJHZcnTMZ3V2yjA60OIPR9wmBjrEsS2zLGviTUeN9ZxM3BTt3saq9TB2fsNZAkIMK-B6xHy4FRv5GY3szgKwZABmLVB35bHDdpRyi_a-yNqvSi8-ca_tP0U4OVY38/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258819.png)
☆自社で作って費用対効果バツグン!
▶FileMaker の技術をゼロから学べて開発も同時に進むサポート一覧🔗
リスト形式でFileMakerっぽく表示させる
レコードの状態やデータの状態を表形式で見慣れるようになったら、次は「リスト形式」にいきましょう。
赤丸のボタンをクリックします。
すると、表形式とはまったく違った見た目に切り替わります。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBkQKAfJcUQoBEnA-rMHQUscxYGGm4aTAiJjpLrVmRww13w6eCksgnJSr62Z6OveUN9CwGVOTKSjm2QMhWgP_aQ2bp7ctMZ0gFlLJSuGpHabDX_vQYfNeAZXNj6EyjodJpKwPDlKQ14TU/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258809.png)
この段階だと「???」なので、レイアウトを編集してみましょう。
「レイアウトモード」にします。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmfChj8wBIWVN4LKWTKQLkqro1PlJ2asYWOt-WdYWkMPyZY9YQAtcfKOvVUJ2jBB_G8xj3GDUH8QHUoQUkEY-3COiV2XCghaMkUb7ULWgL_2m8WNox0BSS3n0JXXHTBTNzasHDE-CQqKQ/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258810.png)
「ボディ」の高さをマウスのドラッグでギュッと縮めて詰めてみて下さい。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOvMCuXA07Zqtv3ouJ7sh58s2F5y3Gq-gDkoP5Drmna7J6e7EdIFuY43jD11gzvLbB7QgOxHE9AA6mSypjul087iPoqCUPoIXWxx-PQy2FQlK_VnkpDvKuWHxhLZid4WnM9s4TsRlSIJA/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258811.png)
そして、左の「ボディ」をクリックして選択し、インスペクタの「線」のところで「単色」「1」「黒」と、赤丸箇所の下線をクリックします。(これはボディに線を入れてレコードとレコードの境界を分かりやすくするための作業です)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrGIcJ7wywPYhmMaVbq3od9Ss0W36Y5CgdojXu_hs9RRQcJucsZ159kjeesVuKTnYBgfI7-P11i-IybtOd_ZO7-8qNvwTHRyavlEhpJ_WO3Ux4pxZIHM6wY9S15pnyPYYffBhNleGKaxg/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258812.png)
ではブラウズモードにしてみましょう。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6fprnNlA08IAEFliMCFo0vjeLqbRa85qw2S6de9nvIDaJ9jVt6McXI8h_2DDFmzKHQpQRnOiyWFVc5IiIKJsKDzkjWHxK8Ux9LKkuHj56Mhqjq-zN7dDoeBZU94j59D6NqiX5LnXgnnQ/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258813.png)
リスト形式は、リストっぽく一覧で表示させる目的のレイアウト形式です。
表形式とは違って、自由にレイアウトをカスタマイズすることが出来ます。
レイアウトを作り込むことで、ユーザーが作業しやすく、レコード数を把握しやすいように出来、業務の効率化を図ることが出来ます。
このリスト形式をうまく利用できるかどうかが、FileMakerの使い勝手を左右すると言っても過言ではありません。
リスト形式で思う存分、あなたが理想とするレイアウトに仕上げて下さいヽ(=´▽`=)ノ
フォーム形式でたくさんの情報を表示する
リスト形式はボディの高さが小さく、1行1行が細くなるのが通常です。
そのため、最低限の情報しか表示できないというジレンマが出てきます。
そういった場合に「フォーム形式」を使って、よりたくさんの情報を表示します。
【注】「フォーム形式」といっても、入力の「フォーム」だけに使用する意味ではありません。「詳細」や「detail」と同じ意味で、一枚ペラの大きく使える画面のことです。
フォーム形式にするには、新たにレイアウトを用意するのが良いです。
ここでは、上で作ったリスト形式のレイアウトを複製して作ってしまおうと思います。
「レイアウトモード」にして、「レイアウト」メニューから「レイアウト複製」をクリックします。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj72JuZnOo9CYfD2AZ8EH-USXK6inz4-Ij3HWVJr_vGV8w646VZ2gXKb3F_rOAUmiD-ok8gnkZ4uJjGoxYhXCRTd89DgX8aaclSc0K9-geJwWBHUkZhqWXBL7Etrfg0Amn-9fjQP4ZSrbg/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258814.png)
レイアウトが複製されましたので(左上のレイアウト名を見ると「名称未設定 コピー」のように「コピー」の文字があります)、今度はボディの高さを大きく拡げます。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_4JjoYXeJbfs_dX7L5S2H6dTXV-y7sGiysZjyTAY-koGEPsRjJQjY7eKSjS_Ap7Yur2bUKjta7i5z18annFFoSQNyl4KChG3MIDlR72yU6BrF9HuU0bitpl8xyuwplSjTAgWSIVg6X7M/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258815.png)
「ブラウズモード」にして、赤丸の「フォーム形式」をクリックします。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBoDfjWGOkhQlU2hrHvPLi4yt699X697kDDbB4W7ec7qP0YQSfJp6hdwsQSJJkvgVd0fc1ySXqpS3Zj-Gfc3kgOaP-zTbIviFn_SUL9hNkTEcJpOA2ULO5YAx3gF8Y1iv3L1vXxlRBZhQ/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258816.png)
フォーム形式にすると、1件のレコード情報だけが表示されることになります。
ほかのレコード情報を見たい場合は、左上のレコード切替やスライダーバーを動かして表示させます。(赤枠の箇所)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf9l3Jy5roCr48PWIF_QbpxEpX2F3bU8E5UfyvE_J7lT2obuItsTGFR0ASoqDxclT16SaeReiVGzPbBsI538Gt6ysmSWs8YjJ4lg27P2OTVfPaz1mhOTdBFTnMoan97oYmbO_ehKpc84I/s640/FileMaker%25E3%2583%25AC%25E3%2582%25A4%25E3%2582%25A2%25E3%2582%25A6%25E3%2583%258817.png)
フォーム形式でも、自由にカスタマイズが可能ですので、あなたが思い描く画面を作成しましょう(*´ω`*)
まとめ
まずは「リスト形式」。*「表形式」は後で
「リスト形式」では自由にカスタマイズに挑戦してみて下さい。
フィールドの幅や高さ、フォントの大きさ、線の色、配置など、あなたのイメージをそのまま表現できるようになれば、FileMakerが楽しくなってくると思います(*´ω`*)
次に「フォーム形式」。
ここでは更に見やすいレイアウト、共有したい大事な情報をうまいこと配置して、業務改善や効率化につなげていきましょう。
大きめのレイアウトを使えるので、写真やPDFなども配置するとビジュアル的にも情報共有がしやすくなりますね!
そして「表形式」。 レコード全体が見やすいので、データベースとしての中身を見たいときは「表形式」を使うと良いです。検索でのデータ確認もやりやすいですね。
「表形式」のレイアウトは別途作成するのがオススメです。管理者・制作者だけがデータを見るための専用画面にするのです。
普段の業務で使うリスト形式やフォーム形式のレイアウトを作っていく際に、データの中身を表形式で確認しながら作り進めるとスマートにいくこともあります。
ということで、FileMakerのレイアウトについて初級・・・というよりは初心者の方に向けて書いてみました(*^_^*)
余裕があれば、「FileMakerの超基本なレイアウト構成」もどうぞ >
そうそう、レイアウトについては動画でも話していますよ。
【こちらもどうぞ】
制作初期の疑問解消を目指す記事をまとめました ▶
今日も良い一日を♪
Blogger Comment
Facebook Comment