携帯サイトをつくろう。

前回はswf内の画像置換について説明しました。
今回はActionScriptでswfからPHP経由で値を取得する方法について説明します。
参照：swfmillでケータイFlashを動的生成してみよう（画像置換編）
　
FlashLite1.1でswfからPHPや外部テキストから値を取得する場合は、loadValiables()関数を使用します。
これはHTMLでいえばAjaxでPHPと通信するようなもので、ページ遷移を行わずにデータを取得してFlashにデータを読み込むことができます。
　
ですがFlashLite1.1には「ボタンクリックなどのユーザーアクションなしにデータを読み込めない」制限があります。
なので、初期状態でデータを設定するにはswfmillなど動的にswfファイルを出力する処理を組み合わせる必要があります。
今回は説明をシンプルにするためにswfmillを使わない方法で説明します。
　
　

処理の流れ

処理の流れは以下のようになります。
・swfファイルにアクセス
・swfに対してアクションがあればPHPに対して外部読み込み
・PHPでデータを取得してSWFが読める形式で出力する
・swf内の変数の値が更新される
　
　

---

swfファイルを用意する

あらかじめFlashLite1.1のswfファイルを用意します。
今回は店舗検索ページのようなサンプルを用意しました。
→[図68]
　
このFlashは以下のパーツで構成されています。
・都道府県を選択するボタン
・検索結果10件の表示用ダイナミックテキスト
・ページ移動用のボタン
・ページ番号を表示するダイナミックテキスト
　
最初にサイズを240px×240pxとし、パブリッシュバージョンをFlashLite1.1とします。
　
静止テキストでタイトルを配置します。
　
エリアを選択するボタンを４つ作成します。
静止テキストの背景にボタン的なグラフィックを重ねています。
押すと色が変わるようにオーバーとダウンのフレームでは色を変更したものを配置しています。
→[図60]
　
ページを移動する２つのボタンも同様に作成します。
　
検索結果を表示するダイナミックテキストを10個配置します。
フォントは「_等幅」でフォントサイズは12です。
→[図61]
ダイナミックテキストにはそれぞれ変数名「result0」～「result9」を指定します。
後でクリックできるようにそれぞれボタンに変換しておきます。
→[図62]
　
現在のページと全ページ数を表示するダイナミックテキストを配置します。
それぞれ変数名を「page」「pagemax」としておきます。
→[図63]
　
次は各ボタンにアクションを設定していきます。
　
エリアを選択するボタンには以下のアクションを指定します。

on (press) {
    pref = 27;
    loadVariables("sample1926.php?pref=27&page=1", _root, "GET");
    page = 1;
}

→[図64]
loadVariables()関数の第一引数には値を読み込むテキストファイルやPHPファイルなどのURLを指定します。
第二引数には値をセットする階層やムービークリップのインスタンス名を、
第三引数には値を取得する際のメソッドを指定します。
今回はsample1926.phpに対してprefとpageをパラメータとして送信して結果を取得します。
prefの値は以下のように設定します。
大阪府→27　兵庫県→28　京都府→26　奈良県→29
同時にswf内のprefとpageの値をセットします。
　
検索結果を表示するダイナミックテキストを格納したボタンには以下のアクションを指定します。

on (press) {
    if (key0) {
        getURL("sample_detail1926.php?key=" add key0);
    }
}

→[図65]
上から順にkey0,key1→key9まで変更したアクションをセットしていきます。
　
「前へ」ボタンには以下のアクションを指定します。

on (press) {
    if (page>1) {
        page--;
        loadVariables("sample1926.php?pref=" add pref add "&page=" add page, _root, "GET");
    }
}

→[図66]
「前へ」ボタンをクリックすると、
現在のページ番号が1ページより大きいときだけページを一つ前に戻して、
前のページのデータを読み込むように処理を書いておきます。
　
「次へ」ボタンには以下のアクションを指定します。

on (press) {
    if (page<pagemax) {
        page++;
        loadVariables("sample1926.php?pref=" add pref add "&page=" add page, _root, "GET");
    }
}

→[図67]
「次へ」ボタンをクリックすると、
現在のページ番号がそのエリアの全ページ数より小さいときだけページを一つ次に進めて、
次のページのデータを読み込むように処理を書いておきます。
　
ダイナミックテキスト「変数名：page」と「変数名：pagemax」にはその時点のそれぞれの値がセットされます。
　
swfファイルができたらサーバーにアップします。
　
　

---

ActionScriptからの変数読み込みのしくみ

sample1926.phpにアクセスすると以下のような値を返すようになっています。
例：sample1926.php?pref=27&page=1

key0=20&result0=門真市店&key1=21&result1=難波中１丁目店&
…(中略)…
&key9=29&result9=出来島二丁目店&pagemax=3

このテキストデータをloadValiablesで読み込ませると、
Flashは自動的に内部の変数を以下のように上書きします。

変数名	値
key0	20
result0	門真市店
key1	21
result1	難波中１丁目店
(中略)
key9	29
result9	出来島二丁目店
pagemax	3

　
この状態で一番上の結果をクリックすると以下のアクションが実行されます。

getURL("sample_detail1926.php?key=" add key0);

→sample_detail1926.php?key=20にアクセス
　
「add」は文字列同士を結合する演算子ですのでURLと変数「key0」の値が結合されてアクセスされます。
　
sample_detail1926.phpはパラメータ「key」を指定すると店舗情報が表示されるような処理になっています。
　
「前へ」「次へ」ボタンをクリックした際の動作はエリアを選択した時とほとんど同じですが、
pageの値を加算・減算する処理が入っているのと、
クリックされたときに現在のpageの値から処理を行うかどうかを決める処理が入っています。
ページ加算の条件pagemaxは店舗データの取得時に一緒に取得させています。
　
　

---

PHP側の処理

まずFlashに渡すデータを取得します。
普通はデータベースから取得させますが、
今回は配列で指定しておきます。

$data[26] = array (
    0  => array('key'  => '1' , 'result'  => '烏丸五条店'),
（以下略）

　
都道府県キーとページ番号を取得します。

$pref = intval($_GET['pref']);
$page = intval($_GET['page']);

　
都道府県キーとページ番号から一覧を取得して出力文字列を作成します。

for ($i = 0; $i < 10; $i++) {
    $key = $data[$pref][$i + (($page - 1) * 10)]['key'];
    $result = $data[$pref][$i + (($page - 1) * 10)]['result'];
    $output .= "key{$i}={$key}&";
    $output .= "result{$i}={$result}&";
}

　
全ページを計算して出力文字列に追加します。
全ページ数はデータ件数を１ページあたりの件数10で割って切り上げすると取得できます。

$pageMax = ceil(count($data[$pref]) / 10);
$output .= "pagemax={$pageMax}";

　
文字列をShift-JISにエンコードします。
※この場合UTF-8で作成していますので以下の記述にしていますが、環境に合わせてください。
※FlashLite2.0以上の場合はUnicodeですのでUTF-8で出力します。

$output = mb_convert_encoding($output, 'SJIS', 'UTF-8');

　
テキストのヘッダを出力します。
ヘッダの出力がなくてもDoCoMoとSoftbankの場合は認識しますが、
auの場合にヘッダを出力しないと読み込めない問題があるようですのでヘッダを出力します。

header('Content-type: text/plain');

　
最後に文字列を出力します。

echo $output;

　
　

---

PHPソース例

実際のソースは以下の通りです。
　
sample1926.php

<?php
/*
 * 店舗情報の一覧をFlashに読み込み可能な文字列で出力するサンプル
 */

// 京都府の店舗データ
$data[26] = array (
    0  => array('key'  => '1' , 'result'  => '烏丸五条店'),
    1  => array('key'  => '2' , 'result'  => '山科店'),
    2  => array('key'  => '3' , 'result'  => '長岡店'),
    3  => array('key'  => '4' , 'result'  => '下鳥羽店'),
    4  => array('key'  => '5' , 'result'  => '竹田店'),
    5  => array('key'  => '6' , 'result'  => '十条駅前店'),
    6  => array('key'  => '7' , 'result'  => '千本丸太町店'),
    7  => array('key'  => '8' , 'result'  => '円町店'),
    8  => array('key'  => '9' , 'result'  => '百万遍店'),
    9  => array('key'  => '10', 'result'  => '烏丸二条店'),
    10 => array('key'  => '11', 'result'  => '京都男山店'),
    11 => array('key'  => '12', 'result'  => '園部店'),
    12 => array('key'  => '13', 'result'  => '上久世店'),
    13 => array('key'  => '14', 'result'  => '河原町三条店 '),
    14 => array('key'  => '15', 'result'  => '阪急桂駅前店'),
    15 => array('key'  => '16', 'result'  => '京都駅前店'),
    16 => array('key'  => '17', 'result'  => '西京樫原店'),
    17 => array('key'  => '18', 'result'  => '烏丸七条店'),
    18 => array('key'  => '19', 'result'  => '烏丸今出川店'),
);

// 大阪府の店舗データ
$data[27] = array (
    0  => array('key'  => '20' , 'result'  => '門真市店'),
    1  => array('key'  => '21' , 'result'  => '難波中１丁目店'),
    2  => array('key'  => '22' , 'result'  => '鶴橋駅前店'),
    3  => array('key'  => '23' , 'result'  => '花園南二丁目店'),
    4  => array('key'  => '24' , 'result'  => '新町三丁目店'),
    5  => array('key'  => '25' , 'result'  => '塚西店'),
    6  => array('key'  => '26' , 'result'  => '昭和町駅前店'),
    7  => array('key'  => '27' , 'result'  => '東淀川豊新店'),
    8  => array('key'  => '28' , 'result'  => '心斎橋駅前店'),
    9  => array('key'  => '29' , 'result'  => '出来島二丁目店'),
    10 => array('key'  => '30' , 'result'  => '内本町店'),
    11 => array('key'  => '31' , 'result'  => '吹田寿町店'),
    12 => array('key'  => '32' , 'result'  => '正雀本町店'),
    13 => array('key'  => '33' , 'result'  => '豊中稲津町店'),
    14 => array('key'  => '34' , 'result'  => '高麗橋１丁目店'),
    15 => array('key'  => '35' , 'result'  => '江坂二丁目店'),
    16 => array('key'  => '36' , 'result'  => '庄内駅前店'),
    17 => array('key'  => '37' , 'result'  => '天六駅前店'),
    18 => array('key'  => '38' , 'result'  => '伏見町３丁目店'),
    19 => array('key'  => '39' , 'result'  => '道頓堀二丁目店'),
    20 => array('key'  => '40' , 'result'  => '難波玉屋町店'),
    21 => array('key'  => '41' , 'result'  => '十三店'),
);

// 兵庫県の店舗データ
$data[28] = array (
    0  => array('key'  => '42' , 'result'  => '尼崎武庫元町店'),
    1  => array('key'  => '43' , 'result'  => '伊丹緑ヶ丘１丁目店'),
    2  => array('key'  => '44' , 'result'  => '川西笹部店'),
    3  => array('key'  => '45' , 'result'  => '神戸港島中町６丁目店'),
    4  => array('key'  => '46' , 'result'  => '神戸元町駅前店'),
);

// 奈良県の店舗データ
$data[29] = array (
    0  => array('key'  => '47' , 'result'  => '近鉄奈良駅前店'),
    1  => array('key'  => '48' , 'result'  => '奈良阪店'),
    2  => array('key'  => '49' , 'result'  => '生駒俵口町店'),
    3  => array('key'  => '50' , 'result'  => '天理中町店'),
    4  => array('key'  => '51' , 'result'  => '桜井阿部店'),
    5  => array('key'  => '52' , 'result'  => '橿原石川町店'),
);

// 都道府県キーを取得
$pref = intval($_GET['pref']);
// デフォルトは27
if ($pref === 0) {
    $pref = 27;
}

// ページ番号を取得
$page = intval($_GET['page']);
// デフォルトは1
if ($page === 0) {
    $page = 1;
}

// 出力文字列$outputを初期化
$output = '';

// 10回ループ
for ($i = 0; $i < 10; $i++) {
    // キーを取得
    $key = $data[$pref][$i + (($page - 1) * 10)]['key'];
    // 店舗名を取得
    $result = $data[$pref][$i + (($page - 1) * 10)]['result'];
    // 出力文字列に追加
    $output .= "key{$i}={$key}&";
    $output .= "result{$i}={$result}&";
}

// 全ページ数を計算
$pageMax = ceil(count($data[$pref]) / 10);

// 出力文字列に追加
$output .= "pagemax={$pageMax}";

// SJISにエンコード
$output = mb_convert_encoding($output, 'SJIS', 'UTF-8');

// テキストのヘッダを出力
header('Content-type: text/plain');

// 文字列を出力
echo $output;
?>

　
　

---

flaファイルサンプル

sample1926.zip※Flash8形式
→こちらよりダウンロードしていただけます。
　
　

---

参照URL

AU で loadVariables() が動かない・不具合の解消法 （Flash Lite 1.1） - 1ka2ka.com
→auでloadVariables()が動かない問題の対処法について参考になります。
　
　

---

実行例

実行例はこちらからご確認下さい。

→URLをメールで送る

http://ookura.tanikaze.com/Sample/post1926/

　
　

---

Flashサイト動的生成関連の記事一覧

1.ケータイFlashの概要
　1-1 ケータイFlashの概要について
　
2.ケータイFlashのページ作成
　2-1 ケータイFlashのページを作ってみよう
　2-2 ケータイFlashで縦スクロールするページを作ってみよう
　
3.swfmillでケータイFlashを動的生成
　3-1 swfmillでケータイFlashを動的生成してみよう（インストール編）
　3-2 swfmillでケータイFlashを動的生成してみよう（文字列置換編）
　3-3 swfmillでケータイFlashを動的生成してみよう（画像置換編）
　3-4 ケータイFlashのレイアウトを文章量に同期させよう
　
4.ActionScriptとPHPの連携
　4-1 ActionScriptで文字列をPHPから動的に取得しよう
　4-2 ケータイFlashでテキスト入力フォームを作ろう
　
　

---