【T4】PHPチュートリアルセッション「はじめての Delphi for PHP」
CodeGear
エヴァンジェリスト
高橋智宏

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

1アジェンダ• ハンズオントレーニングに必要なもの• Delphi for PHP V2.0 の環境設定• VCL for PHP の基本的な動作を確認• フォトギャラリの製作• マスターページ• 画像アップロード• カスタムコンポーネントの導入など…

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

2

1

ハンズオントレーニングに必要なもの• ラップトップPC• Windows Vista, XP, 2000
• Delphi for PHP V2.0（起動できる状態であること）• USBポート• 完成版の演習ファイルをUSBメモリでお渡しして、差し上げます

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

3

Delphi for PHP V2.0 の環境設定• IDE画面およびインストールフォルダの確認• phpinfo(); をテスト実行• IDEの設定• php.ini• エディタフォント• ユーザープロファイルフォルダ• プロジェクト作成時の注意点• vcl-bin って?
• 別ドライブは×• php.exe をコマンドラインで実行
Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

4

2

VCL for PHP の基本的な動作を確認• メインフォームという概念は無い• ユニット（フォーム, データモジュール）が基本• unit1.php• unit1.bom• unit1.xml.php• 「フォームデザイナ」と「HTMLデザイナ」• require_once と use_unit の違い
• 構造
• クラス
• プロパティ• イベント(PHP, JavaScript)• 画面遷移• redirect
Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

5

動作イメージ
Webブラウザセッション(1)

unit1.xml.php
unit1.php

(2)
(3)

PHP5
Httpd*.php*.php*.php
unit2.php

unit2.xml.php

xxxx.jszzzz.jpg
yyyy.css

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

63

はじめてのVCL for PHPアプリケーション• Webページは1ページだけ• アプリケーションの新規作成とファイル保存• コンポーネントの配置• エディット（Editコンポーネント）• ラベル（Labelコンポーネント）• ボタン（Button）• ページと各コンポーネントのデザイン時のプロパティを適切に変更• イベントハンドラの追加
Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

7

プロジェクトの作成 と ページのデザイン

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

84

ボタンのOnClickイベントハンドラ

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

9「デバッグ実行」 、「デバッグ無し実行」• 起動アイコンは2種類• IDE上でアクティブな.phpファイルを実行• デバッグ実行のほうが処理が遅くなる• ブラウザの選択• URLのポート番号、パス• デバッグ時、日本語の文字列を確認するには？
• 現時点では、XPでのみサポート• （一度だけ） PHPのデバッグエンジンを設定(リセット)し、IDEを再起動する必要あり

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

105

実行結果および考察• HTMLデータ• Buttonのタイプ• JavaScript• CSS• セッションによる画面情報の自動維持• フィルタリング• <, >, &, ‘, “• EditのFilterInputプロパティ(デフォルト=True)
Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

11

フォトギャラリの製作
マスターページ
画像アップロード
カスタムコンポーネントの導入など…

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

126

完成すると… アップロード用のページ

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

13

完成すると… 画像一覧のページ

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

14

7

マスターページの構造各Pageによって置き換えられる

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

15

マスターページを作成• アプリケーションを新規作成• マスターページのユニット名 - MasterPageUnit• IsMaster - true (ページは実行しても何も表示しなくなります!!)• Color - #FF8040• Panel(MasterHeaderPanel)• Label(MasterLabel1)– Caption– ParentFont(false)– FontのSize(20px)

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

168

マスターページを作成（続き）• Panel(MasterNaviPanel)• GroupBox(MasterNaviGroupBox)• Caption - ‘メニュー’• Label(NaviLabel1)• Caption - ‘アップロード’• Link - ‘UploadUnit.php’• Label(NaviLabel2)• Caption - ‘一覧’
• Link - ‘ListAllUnit.php’

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

17

マスターページを作成（続き）• Panel(MasterBodyPanel)• ParentColor - false• Color - #FFFFFF• OnShowイベントハンドラ(実装は空)の追加 – 重要!!
master.css• StyleSheet(MasterStyleSheet)• FileName - master.css#MasterNaviGroupBox a {font-size: 8pt;
color: white;text-decoration: none;}#MasterNaviGroupBox a:hover {text-decoration: underline;}

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

18

9

アップロード用のページをデザイン• ページのユニット名 - UploadUnit• 親クラスを MasterPageUnit に変更!!
• [ファイル]-[ユニットを使う…]でrequire_once(“MasterPageUnit.php”);• Caption - ‘フォトギャラリー’• Panel(Panel1)• ParentColor - false• Color - #FFFFFF

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

19

アップロード用のページをデザイン（続き）• Upload(Upload1)• ParentColor - false• Color - #C0C0C0• Button(Button1)• Caption - ‘アップロード’• ParentColor - false• Color - #C0C0C0• ComboBox(ComboBox1)• Itemsプロパティに画像登録番号の選択肢を追加

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

20

10

アップロード用のページを実装• マスターページ内のMasterBodyPanelのOnShowイベントハン
ドラの実装メソッドをオーバーライド!!
• Panel1のshow()メソッドで、Panel1を出力• Page自身のOnShowHeaderイベント• Panel1に関するJavaScriptを生成する• Visible = true;• Page自身のOnStartBodyイベント• Panel1自体は非表示にする• Visible = false;※全てのプロパティはセッションで永続化されていることに注意しよう

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

class UploadUnit extends MasterPageUnit{...
function MasterBodyPanelShow($sender, $params){$this->Panel1->show();}function UploadUnitShowHeader($sender, $params){$this->Panel1->Visible = true;}
function UploadUnitStartBody($sender, $params){$this->Panel1->Visible = false;}
21

アップロード用のページを実装（続き）• Button1のOnClickイベントを実装• ComboBox1で選択した番号を元に、アップロードされたJPEG画像を保存するファイル名、生成されるサムネイルファイル名を決定する• PHPのJPEG用画像処理関数を使って、サムネイル画像をファイルとして出力する• イベントの最後に ‘ListAllUnit.php’へリダイレクト - redirect関数

このスライドで説明した実装コードは、完成版のプロジェクトのソースコードからコピー&ペーストしてください

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

2211

画像一覧のページをデザイン• ページのユニット名 - ListAllUnit• 親クラスを MasterPageUnit に変更!!
• [ファイル]-[ユニットを使う…]でrequire_once(“MasterPageUnit.php”);• Caption - ‘フォトギャラリー’• Panel(Panel1)• ParentColor - false• Color - #FFFFFF

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

23

画像一覧のページをデザイン（続き）• tableタグを実現するカスタムコンポーネント(高橋が製作)をIDEに導入する• USBメモリにパッケージが入ってますのでコピーします• コピー先フォルダ - <DelphiforPHP>¥2.0¥vcl¥ken• [コンポーネント]-[パッケージ]-[追加]• ken.package.php

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

24

12

画像一覧のページを実装• tableコンポーネント(KenTable1)• Col - 3
• Row - 1
• マスターページ内のMasterBodyPanelのOnShowイベントハンドラの実装メ
ソッドをオーバーライド!!
• Panel1のshow()メソッドで、Panel1を出力• Page自身のOnShowHeaderイベント• Panel1に関するJavaScriptを生成する• Visible = true;• Page自身のOnStartBodyイベント• Panel1自体は非表示にする• Visible = false;

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

class ListAllUnit extends MasterPageUnit{...
function MasterBodyPanelShow($sender, $params){$this->Panel1->show();}function ListAllUnitShowHeader($sender,$params){$this->Panel1->Visible = true;}
function ListAllUnitStartBody($sender, $params){$this->Panel1->Visible = false;25}

画像一覧のページを実装（続き）• table(KenTable1)のOnDrawCellイベントハンドラ• セル1つごとに呼び出される• パラメータ $params[“index”] にセルのインデックス番号が入っている、という仕様• サムネイルファイルに対する<image>タグを出力する
function KenTable1DrawCell($sender, $params){$index = $params["index"];echo “<img src=¥”“ . $this->GetThumbSrc($index) . ”¥“ alt=¥”空¥"/>";}
function GetThumbSrc($index){
return 'image' . $index . '_thumb.jpg';}

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

26

13

完成!!
• UploadUnit.php または ListAllUnit.php をIDEから実行する• マスターページは実行しても何も表示しないので注意!!
• USBメモリ内にあるJPEG画像をアップロードしてみよう• Webページのデザインは、CSSで如何様にも変更可能なので、StyleSheetコンポーネントを活用しよう• 標準のStyleSheetコンポーネントはシンプルなので、カスタムコンポーネントとして自前で実装し直すか、独自に.cssファイルをリンクするようコーディングするのが良いかも?

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

27

参考文献、情報リソース• HTML & CSS ビジュアル・リファレンス 改訂版• http://www.amazon.co.jp/dp/484435955X• CodeGearテクニカルサポートナレッジベース• http://support.codegear.com/jp/php• CodeGear Developer Network のPHPページ• http://dn.codegear.com/jp/php

Copyright ©2008 CodeGear. All Rights Reserved.本文書の一部または全部の転載を禁止します。

28

14