WINGSプロジェクト 風田 伸之 [著] 山田 祥寛 [監修] 2009/03/11 14:00

サンプルファイル 4.80 KB

 本連載では、PHP上で動作するアプリケーションフレームワークであるZend Frameworkについて紹介していきます。今回はZend Framework 1.6から追加されたモジュールの一つであるZend_Dojoの紹介の中編で、高機能ウィジットのDijitをZend Frameworkから利用する方法について説明します。

1 2 3 4 →

はじめに

 本連載では、PHP上で動作するアプリケーションフレームワークであるZend Frameworkについて紹介していきます。今回はZend Framework 1.6から追加されたモジュールの一つであるZend_Dojoの紹介の中編で、高機能ウィジットのDijitをZend Frameworkから利用する方法について説明します。

 「Dijit」はDojo Widgitの略で、静的なHTMLだけでは実現できないような「動きのある」部品をいくつか提供しています。Zend_DojoにはこのDijitのうち、レイアウトに関するものとウェブフォームに関するものを作成するための機能が付属しています。今回はZend_DojoからDijitを利用する基本的な方法について説明します。

対象読者

 PHPの基本構文は一通り理解しているが、フレームワークを利用したことはないという方を対象としています。

必要な環境

 Zend FrameworkはPHP 5.1.4以降とWebサーバがインストールされている環境で利用可能です。本稿ではWebサーバとしてApache 2.2を、OSにWindows XPを採用し、アプリケーションを作成していきます。

 以下に、今回アプリケーション作成/動作確認に用いた環境を示します(インストールにあたっては最新安定版の使用を推奨します)。各項目の詳細なインストール手順は、「サーバサイド技術の学び舎 - WINGS」より「サーバサイド環境構築設定手順」を参照ください。

  • Windows XP SP2
  • PHP 5.2.6
  • Apache 2.2.10

 LinuxやFreeBSDなどUNIX系OSをお使いの方もコマンドはほぼ一緒ですので、パスなどは適宜読み替えてください。

DijitとZend_Frameworkからの使い方

 最初にも述べたとおり、DijitはDojo Toolkitが提供するウェブ部品です。Dijit自体にはさまざまな機能のものが提供されていますが、その中でZend_Dojoから利用できるのはページ内で部品を配置するための「レイアウト機能」と、Dojo Toolkit独自の「フォーム要素」です。図1は、レイアウト機能の「Tabレイアウト」と、フォーム要素の「ComboBox要素」を使った例です。

図1:Dijitを利用した例(http://localhost/)
図1:Dijitを利用した例(http://localhost/)

 これらを含め、Zend_Dojoから利用できるレイアウトに関するDijitは4種類、ウェブフォームに関するDijitは18種類あります(正確にはSplitレイアウトもありますが、互換性のために残されているだけなので扱わないことにします)。

 Dijitレイアウトはページ内で描画される内容の配置や切り替えを行うための仕組みです。ページ内で描画される内容はペインと呼ばれる単位で管理されます。このペインを切り替えて表示したり、画面内で配置したりするわけです。

レイアウトに関係するDigitの一覧
クラス名必要なモジュール説明
Accordiondijit.layout.accordion表示したいペイン以外のペインが上下に折り畳まれているようなレイアウト
Borderdijit.layout.borderペインの配置を上下左右などで指定するレイアウト
Stackdijit.layout.stackペインが重なって配置されていて、JavaScriptで表示したいペインを指定するレイアウト
Tabdijit.layout.tabペインが重なって配置されていて、タブで表示するペインを切り替えるレイアウト

 Zend_Dojoから利用できるDijitウェブフォーム要素は、Spinnerのように通常のHTMLでは実現できないようなものや、NumberTextBoxのように入力のチェックをしてくれるものなどがあります。また、これらはZend_Formのウェブフォーム要素と互換性のあるように設計されているため、既存のウェブフォームと混ぜて使ったり、置き換えたりすることが可能です。

ウェブフォームに関係するDigitの一覧
クラス名必要なモジュール説明
Buttondijit.form.Button通常のHTMLのボタン
SubmitButtondijit.form.Button送信ボタン
CheckBoxdijit.form.CheckBox選択されている・いないの二つの状態を持つボタン
RadioButtondijit.form.CheckBox複数の選択肢から排他的に一つを選ぶためのボタン
Editordijit.Editorリッチなテキストも編集できるテキストエリア
Textareadijit.form.Textarea入力された文章によって長さが伸びるテキストエリア
HorizontalSliderdijit.form.Slider水平スライダー
VerticalSliderdijit.form.Slider垂直スライダー
ComboBoxdijit.form.ComboBoxユーザーからの任意の入力も受け付けるテキスト選択
FilteringSelectdijit.form.FilteringSelect与えられた値以外の値はエラーにするテキスト選択
TextBoxdijit.form.TextBox基本的なテキストボックス
ValidationTextBoxdijit.form.ValidationTextBox入力が与えられた正規表現にマッチするか調べるテキストボックス
PasswordTextBoxdijit.form.ValidationTextBoxパスワード入力用テキストボックス
DateTextBoxdijit.form.DateTextBox日付入力用のテキストボックス
TimeTextBoxdijit.form.TimeTextBox時間入力用のテキストボックス
NumberSpinnerdijit.form.NumberSpinner数値入力用のテキストボックスで、数値増減用のボタンが付いている
NumberTextBoxdijit.form.NumberTextBox数値入力用のテキストボックス
CurrencyTextBoxdijit.form.CurrencyTextBox金額入力用のテキストボックス

 Zend_DojoからDijitを使えば、見栄えの良いページをあまり面倒な手間をかけずに作成することができます。今回は、図1のサンプルがどのように動作しているかについての説明を通じて、Zend_DojoからDijitをどのように使うかについての基本的な方法と、その動作の仕組みについて見ていきます。

 DijitもDojo Toolkitの一部ですので、基本的な使い方はDojo Toolkitの他の機能と同じになります。

  1. Zend_Dojoビューヘルパを有効にする
  2. Zend_Dojoの設定を行う
  3. Zend_Dojoに関係するヘッダを出力
  4. Dijitを作成(場合によっては(3)より前に行う必要がある:後述)
  5. Dijitの出力

 おさらいとなりますが、Zend_Controller経由でページを描画する際の処理の流れはフロントコントローラ(index.php)→アクションコントローラ(IndexController.php等)→ビュースクリプト(index.phtml等)となっています。このうち(1)と(2)はアクションコントローラで、(3)~(5)はビュースクリプトで処理することになります。

 では、まずアクションコントローラで行う処理について見ていきます。


1 2 3 4
→
INDEX
Zend Framework入門(17): ウィジェットDijitをPHPアプリで利用する - Zend_Dojo(中編)-
Page1
はじめに
対象読者
必要な環境
DijitとZend_Frameworkからの使い方
DijitのためのZend_Dojoの設定
ビュースクリプトでの出力
おわりに
プロフィール
WINGSプロジェクト 風田 伸之 カゼタ ノブユキ

WINGSプロジェクトについて>
有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2012年2月時点での登録メンバは37名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書記事多数。


プロフィール
山田 祥寛 ヤマダ ヨシヒロ

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。
主な著書に「入門シリーズ(サーバサイドAjax/XMLDB/PEAR/Smarty)」「独習シリーズ(ASP.NET/PHP)」「10日でおぼえる入門教室シリーズ(ASP.NET/PHP/Jakarta/JSP&サーブレット/XML)」「Pocket詳解辞典シリーズ(ASP.NET/PHP/Perl&CGI)」「今日からつかえるシリーズ(PHP/JSP&サーブレット/XML/ASP)」「書き込み式 SQLのドリル」他、著書多数


記事へのコメント・トラックバック機能は2011年6月に廃止させていただきました。記事に対する反響はTwitterやFacebook、ソーシャルブックマークサービスのコメントなどでぜひお寄せください。

スポンサーサイト