Excel やスプレッドシートから業務ツールへの移行を一緒に進めてもらいたい。
一緒に最適解を考えてくれるのはお人好しアドバイザーながにぃ
~作業時間を10分の1に、人生の充足時間を10倍に~

生産管理システムの一覧画面をカスタマイズ<レイアウト編集>vol.5

「生産管理システムを自作してみる」シリーズvol.5!
一覧画面をいろいろカスタマイズしてみます^ ^

----------------------------------------------------------
2021.02.17追記
制作過程を”超”端折って・・・・・・
基盤システム第1弾『[ki録s]生産管理』無料版リリース!詳細はこちら >
----------------------------------------------------------

生産管理システムの一覧画面をカスタマイズ<レイアウト編集>vol.5


☆今回の記事を動画にまとめました↓クリック↓





生産管理シリーズ5回目は、前回作った一覧画面をカスタマイズしたいと思います。

(前回の記事)
生産管理システムの簡単な一覧画面を作る<初めての画面制作>vol.4




一覧画面は作ったものの、見やすさや使い勝手がよくありません。

使いやすくなって、見やすくもなってこそ、よりシステムを使いたくなっていきます^ ^




※本記事は初心者/初級者の方向け(未経験~おおむね2年未満)に書いています。




<もくじ>
  • 右寄せ左寄せ中央寄せ
  • フィールドの大きさや枠などを整える
  • 3桁カンマ区切り
  • 小計・税金・税込合計を自動計算
  • まとめ

<登場するトピック>
インスペクタ
右揃え/左揃え/中央揃え
3桁カンマ区切り
計算フィールド


生産管理する製品と工程の確認


#製品:壁掛け水墨画はがき


#生産工程:
 受注 → 材料確認(はがき/筆ペン/はがき掛け) → 描き入れ製造 → セッティング/梱包 → 納品

#目指すシステム:
 『受注から納品まで一気通貫した管理システム』

#環境:
Window10、FileMaker Pro Advanced 18

※なぜ「水墨画はがき」かというと、ながにぃは水墨画講師を目指して2年間学んでいたことがあり、手元にモノがあったからです。

右寄せ左寄せ中央寄せ


シリーズvol.4ではリスト形式の一覧画面を作るところまでいきました。

わかり易くするため、具体的なデータを入れてみました。




表示上で不足しているフィールドもありますが、ひとまずこのまま進めます。

フィールドの文字の位置(右寄せ左寄せ中央寄せ)や枠の大きさを調整してみます。

日付は中央寄せ、金額と数量は右寄せにしてみましょう。




レイアウトモードにします。

「受注日」「納品予定日」を選択して、インスペクタ「外観」タブの「段落設定 > 行揃え」で中央揃えにします。(FileMakerでは「中央寄せ」ではなく「中央揃え」のようです)



もしインスペクタが表示されていない場合は、メニューの「表示 > インスペクタ > インスペクタ」で表示させて下さい。




次に金額や数量を選択し、今度は「右揃え」にします。

ドラッグすることで複数選択ができ、まとめて「右揃え」にすることができます。







フィールドの大きさや枠などを整える


フィールドを適切な大きさにしてます。

大きさを変える最も簡単な方法は、ドラッグして大きさを変える方法です。




例えば金額や数量のフィールドを整えてみます。

複数選択したものをまとめて変えることもできます。





その他のフィールドの大きさも、ほどよい大きさに整えます。




フィールドには薄っすらとグレーの枠がついています。

この辺は好みになりますが、枠を消してスッキリした見た目にしてみます。

レイアウトモードで、フィールドを全て選択し、インスペクタ「外観」タブの「線」で「すべての枠」をクリックして枠を消します。





デフォルトでは、アクティブなレコード行に色が付くようになっています。

その時、フィールドの枠が白く浮き出てしまいます。気になる場合は、フィールドを透明にするか、アクティブなレコード行に色を付けないようにします。




ここでは、フィールドを透明にしてみます。

レイアウトモードで、フィールドを全て選択し、インスペクタ「外観」タブの「塗りつぶし」で「なし」を選択します。





(※「単色」で「透明」(赤い斜線が入った色)を選ぶと、フォーカスした時だけ色を付けるなど、細かい設定が可能になります。この辺の設定に慣れたらトライしてみるのがいいと思います。)




一応、アクティブなレコード行に色を付けない方法も載せておきます。

レイアウトモードで、ボディを選択します。

右クリックの「パートの定義」で設定ウインドウを出し、「アクティブな行状態を使用」のチェックを外します。





3桁カンマ区切り


さて、金額や数量は3桁のカンマ区切りが見やすいので対応してみます。




レイアウトモードにして、金額や数量を選択します。

インスペクタ「データ」タブの一番下にある「データの書式設定」で「書式」を「通貨」にします。

「3桁区切りを使用」にチェックを入れます。入力欄に「,(カンマ)」が入ります。(ここは編集が可能で、例えば全角のカンマを入れることも出来ます。)







金額のほかに数量も選択しているので、「\(円マーク)」が表示されないようにします。

「通貨」のところで「\(円マーク)」が入力されているので、Deleteして入力を消します。







小計・税金・税込合計を自動計算


小計や税金、税込合計は自動的に計算されると楽ちんです。

そこで自動計算を設定してみたいと思います。

メニューの「ファイル > 管理 > データベース」から、データベースの管理を開きます。




「小計」フィールドを選択して、タイプを「計算」に変更し、「変更」ボタンを押します。

「~~処理を続けますか?」というダイアログボックスが出るので「OK」を押します。



これは「計算フィールド」と言って、常に自動的に計算を行ってくれる機能を持ったフィールドになります。




計算式を書いていきます。

①左側のフィールド一覧から、「製品価格」を選択してダブルクリックします。

②記号が縦に並んでいるところから、「*(アスタリスク)」を選択します。

③再び左側のフィールド一覧から、今度は「数量」を選択してダブルクリックします。



左下の「計算結果」が「数字」になっていることを確認して、「OK」します。

※念の為ですが、「*(アスタリスク)」は掛け算、「/(スラッシュ)」は割り算として使われる記号です。




同様に、税と税込合計も計算フィールドに変更して、計算式を書き込みます。

消費税の場合





税込合計の場合





そして、データベース管理を「OK」にしてみます。

「製品価格」や「数量」を変更してみてください。

うまく計算されましたでしょうか?




計算フィールドは、手入力によるデータの変更はできません。

小計や税込合計にカーソルを入れて、数字を変更してみてください。エラーのダイアログボックスが出ます。






最後に、命名規則のところを整備します。

計算フィールドは少し特殊なフィールドになるため、「テキスト」「数字」「日付」といったものとフィールド名を区別した方が後々わかり易いです。




データベース管理をもう一度開きます。

「小計」「消費税」「税込合計」のフィールドをそれぞれ、



「c_小計」「c_消費税」「c_税込合計」



に変更します。

「c_」は「計算(Calculation)」を表します。(「C_」や「c」だけなど、会社や制作者によってルールはそれぞれです。)

このように名前で区別するといったアナログな対応をFileMaker(ファイルメーカー)ではよく行います。







まとめ


FileMaker(ファイルメーカー)の面白さとして、まずはレイアウトの作りやすさがあります。

ここでは右寄せ左寄せ中央寄せ、フィールドの色や枠、3桁カンマ区切りをいじってみました。

ここはそんなに難しくないところかと思います。(数が多いと手間がかかりますが)




ほかの面白さとして、計算のしやすさがあるかと思います。

「小計 + 税込合計」のように指定しましたが、あっけない感じのシンプルさがあります。(複雑な計算ももちろん色々できます)




FileMaker(ファイルメーカー)は良い意味で「ゆるく」進められるので、「壁にぶち当たる」とか「うまくいかない」というのを比較的回避しやすいソフトです。(とはいえ、ジワジワと登り坂になります^^;)




他のソフトの場合、何かで詰まるともう先へ進めなくなり、時間も根気もなくなって諦めてしまうことがあります。

FileMaker(ファイルメーカー)は何となくでも進むことができるのが隠れた大いなるメリットのように思います。




その代わり、命名規則といったアナログ的なところで「分かり易く」制作することが重要になってきます。

ただ、今これをお読みになっても何が「分かり易い」のかが分からない状態かもしれません。

こればっかりは半年~1年~2年と制作の経験を経ていくしかないですが、もしもご質問などあればお問合せください^ ^







それでは今日も良い一日を♪






SHARE

Japan Bit Innovation

  • Image
  • Image
  • Image
  • Image
  • Image
    Blogger Comment
    Facebook Comment

FileMaker&個人的Post