第4回　ソースコードまで踏み込んでビューをカスタマイズ

河村 嘉之
オープンソースCRM株式会社
2008/12/18

画面を定義する「メタデータアーキテクチャ」

　ここから、SugarCRMで表示される画面がどのように作られるかを考えてみます。SugarCRMでは、スタジオ機能などを使って、編集画面や詳細画面にどのフィールドをどこに表示するかカスタマイズすることができます。

　多くのアプリケーションでは、ページを生成する際、ページのテンプレートなどを利用しています。どこにどのデータを表示するかをテンプレートに記述し、対応する場所にデータの値を当てはめて実際の表示を行います。

　SugarCRMでも同様に、ページの表示にテンプレートエンジンを利用しています。しかし、フィールドの配置を変更するために、このテンプレートを編集する必要があるのでしょうか？

　SugarCRMでは、特殊な画面を除いて、テンプレートを直接編集する必要はありません。それでは、どのようにしてどのフィールドをどのようなレイアウトで配置するか決めるのでしょうか？

　この答えが、メタデータアーキテクチャです。SugarCRMでは、どのフィールドをどこに配置するかを、例えば「詳細画面用にはこのファイル」「編集画面にはこのファイル」というように、アクションに合わせたファイルの中で定義します。このファイルの中に記述された定義情報を基に、それぞれのアクションに対応した画面を生成し、表示します。こうした画面の定義情報をここでは「メタデータ」と呼びます。

　メタデータは、各モジュールのmetadataディレクトリに格納されています。例えば、一覧表示であればlistviewdefs.php、詳細表示であればdetailviewdefs.phpがそれぞれのメタデータのファイルになります。

　以下の表に、metadata以下のファイルがどのようなメタデータを表しているかをまとめました。

ファイル 説明 editviewdefs.php 編集画面の定義 detailviewdefs.php 詳細画面の定義 listviewdefs.php 一覧画面の定義 popupdefs.php ポップアップで表示される検索フォームや一覧の定義 searchdefs.php 基本検索と詳細検索の検索条件の定義 sidecreatedefs.php 画面横に出るショートカットパネルでの簡易作成フォームの定義 subpaneldefs.php ほかのモジュールに関連する際に表示されるサブパネルの定義 additionalDetails.php 一覧表示でマウスカーソルを行に合わせた際に表示される情報の定義 metafiles.php メタデータファイルの場所をデフォルトと異なる値に上書きする場合にその場所を定義する。詳細、編集、一覧およびポップアップの際に参照される

表1　メタデータファイル

　ここでは取引先モジュールを例に、詳細画面のメタデータを見てみましょう。このファイルは、SugarCRMをインストールしたディレクトリ以下のmodules/Accounts/metadata/detailviewdefs.phpになります。

<?php /********************************************************************************* * SugarCRM is a customer relationship management program developed by * SugarCRM, Inc. Copyright (C) 2004 - 2007 SugarCRM Inc. * * This program is free software; you can redistribute it and/or modify it under * the terms of the GNU General Public License version 3 as published by the * Free Software Foundation with the addition of the following permission added * to Section 15 as permitted in Section 7(a): FOR ANY PART OF THE COVERED WORK * IN WHICH THE COPYRIGHT IS OWNED BY SUGARCRM, SUGARCRM DISCLAIMS THE WARRANTY * OF NON INFRINGEMENT OF THIRD PARTY RIGHTS. * * This program is distributed in the hope that it will be useful, but WITHOUT * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more * details. * * You should have received a copy of the GNU General Public License along with * this program; if not, see http://www.gnu.org/licenses or write to the Free * Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA * 02110-1301 USA. * * You can contact SugarCRM, Inc. headquarters at 10050 North Wolfe Road, * SW2-130, Cupertino, CA 95014, USA. or at email address contact@sugarcrm.com. * * The interactive user interfaces in modified source and object code versions * of this program must display Appropriate Legal Notices, as required under * Section 5 of the GNU General Public License version 3. * * In accordance with Section 7(b) of the GNU General Public License version 3, * these Appropriate Legal Notices must retain the display of the "Powered by * SugarCRM" logo. If the display of the logo is not reasonably feasible for * technical reasons, the Appropriate Legal Notices must display the words * "Powered by SugarCRM". * *******************************************************************************/ $viewdefs['Accounts']['DetailView'] = array(   'templateMeta' => array(     'form' => array('buttons'=>array('EDIT', 'DUPLICATE', 'DELETE', 'FIND_DUPLICATES')),     'maxColumns' => '2',     'widths' => array(       array('label' => '10', 'field' => '30'),       array('label' => '10', 'field' => '30')     ),     'includes'=> array(       array('file'=>'modules/Accounts/Account.js'),     ),   ),   'panels' => array(     array('name', 'phone_office'),     array(array('name'=>'website', 'type'=>'link'), 'phone_fax'),     array(       'ticker_symbol',       array('name'=>'phone_alternate', 'label'=>'LBL_OTHER_PHONE')     ),     array('parent_name', 'employees'),     array('ownership', 'rating'),     array('industry', 'sic_code'),     array('account_type', 'annual_revenue'),     array(       array(         'name'=>'date_modified',         'label'=>'LBL_DATE_MODIFIED',         'customCode'=>'{$fields.date_modified.value} {$APP.LBL_BY} {$fields.modified_by_name.value}')     ),     array(       array(         'name'=>'assigned_user_name',         'label'=>'LBL_ASSIGNED_TO'       ),       array(         'name'=>'date_entered',         'customCode'=>'{$fields.date_entered.value} {$APP.LBL_BY} {$fields.created_by_name.value}'       )     ),     array (       array (         'name' => 'billing_address_street',         'label'=> 'LBL_BILLING_ADDRESS',         'type' => 'address',         'displayParams'=>array('key'=>'billing'),       ),       array (         'name' => 'shipping_address_street',         'label'=> 'LBL_SHIPPING_ADDRESS',         'type' => 'address',         'displayParams'=>array('key'=>'shipping'),       ),     ),     array('description'),     array('email1'),   ), ); ?>

　このファイルでは、取引先（Accounts）の詳細画面（DetailView）に関するメタデータを定義しているため、定義情報を$viewdefs[‘Accounts’][‘DetailView’]という変数に格納しています。メタデータは連想配列になっていて、templateMetaにこのページの構成に関する情報が入り、panelsはこのページの中の領域内に表示されるフィールドの情報を定義しています。

　templateMeta項目では、form項目で表示するボタンなどの情報、maxColumns項目でこのページに表示する最大の列数、width項目で列に合わせてラベルと値をどのような配分で表示するか、includes項目でこのページで必要なJavaScriptなどの外部ファイルをそれぞれ定義します。

　panels項目では、そこに表示するフィールドを定義します。パネル以下は配列になっていて、その要素1つ1つがそのパネル内で1行ごとに表示されます。行ごとの定義情報も配列になっていて、今回はtemplateMeta項目のmaxColumns項目で2列と定義されているため、その配列の要素は多くても2つになっています。2つのフィールドが定義されている行はそのフィールドが並べて表示され、1つのみが定義されている行はその行全体を使ってそのフィールドの値が表示されます。

　ここでフィールドの名前のみが記述されている場合は、そのフィールドのデフォルトの定義情報に従ってラベルや表示する情報を決定します。さらに細かい定義を行いたい場合は、配列によって細かく指定することができます。

　ではここで、billing_address_street項目を見てみましょう。このフィールドは請求先住所を表すものです。この項目では、name属性で対応するフィールドの名前、label属性でこのフィールドへのラベル、type属性でこのフィールドを表示する際の型、displayParams属性でフィールドを表示する際の付加的な情報を指定しています。

　このように、type属性を用いて、特別な形式で表示したいフィールドに対してその型を指定することによって、単純な文字列表示以外の形式でフィールドの値を表示することができます。この型をSugarFieldと呼び、現在のSugarCRMでは、基本的な型に加え、住所、リンクなどいろいろな型のSugarFieldが用意されています。SugarFieldの実装は、include/SugarFields/Fields以下のそれぞれのSugarFieldの名前に合わせたディレクトリに格納されています。

　ここでは詳細ページのメタデータを説明しましたが、メタデータファイルに記述される定義情報のデータ構造は、それぞれのページのタイプによって異なります。例えば一覧ページはそれほど細かな情報を表示しないため、詳細ページや編集ページとは異なった構造をしています。

　ここではすべてのメタデータに関する解説は割愛しますが、あまり複雑なデータ構造ではありませんので、表示されたページとメタデータを見比べながら読み解いていくと、どのような定義情報が記述されているか理解できると思います。

2/3

Index 徹底解剖、SugarCRM（4） 　ソースコードまで踏み込んでビューをカスタマイズ

Page 1 　カスタマイズを保護する「アップグレードセーフ」 　 Page 2 　画面を定義する「メタデータアーキテクチャ」   Page 3 　レイアウトのカスタマイズ 　ソースへのカスタムコード追加 　今回のまとめ

Linux Square全記事インデックス

---

Linux Squareフォーラム 仮想化技術関連記事

	連載：実践！ Xenで実現するサーバ統合 有力な仮想化技術として注目を集めるようになった「Xen」。このXenを活用してサーバ統合を実践していく手順を具体的に紹介します
	特集：サーバの仮想化技術とビジネス展開の可能性 jailからUML／VMwareまで 1台のマシンで複数のサーバを動かす「仮想化技術」。VMwareやUMLの登場により、WebサイトだけでなくOS自体を仮想化できるようになった
	特集：仮想化技術のアプローチと実装 VMwareから要注目技術Xenまで 1台のサーバで複数の仮想マシンを実行する仮想化技術は、空間コストを引き下げる可能性を持つ。最新の仮想化技術を概観してみよう
	特集：仮想OS「User Mode Linux」活用法 技術解説からカーネルカスタマイズまで Linux上で仮想的なLinuxを動かすUMLの仕組みからインストール／管理方法やIPv6などに対応させるカーネル構築までを徹底解説
	特集：仮想化技術の大本命「Xen」を使ってみよう インストール & Debian環境構築編 高いパフォーマンスで本命の1つとなった仮想マシンモニタ「Xen」。日本語による情報が少ないXenを、実際に動かしてみよう
	特集：仮想化技術の大本命「Xen」を使ってみよう Xen対応カスタムカーネル構築編 Xen環境およびその上で動作する仮想マシン用カーネルを自分で構築しよう。これにより、自由にカスタマイズしたカーネルを利用できる
	特集：IPv6、UML、セキュリティ機能の統合 全貌を現したLinuxカーネル2.6［第4章］ 今回は、これまでに紹介し切れなかった機能を一気に紹介する。これを読めば、カーネル2.6の正式リリースが楽しみになるだろう
	Linux Squareプロダクトレビュー　VMware Workstation 4 PC/AT互換機エミュレータとして不動の地位を築いたVMware。その新バージョンがリリースされた。新機能を早速試してみよう
	古くて新しい「サーバ仮想化技術」の行方 サーバ仮想化を実現するための技術がソフトウェア、ハードウェアの両面で出そろってきた。ハイパーバイザーのさらなる高速化に向けた動きを紹介する
	Linux Squareフォーラム全記事インデックス

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）