【カウンタ画像表示】split？

質問

Flashのアクセスカウンターを作りたいと思って
PHP側から値を抜いて、
それをsplit()を使ってバラバラにして
その数値の値と同じ値を表示させるＭＣ（ムービークリップ）を
使って桁数を指定してやる方法を教えてください。

PHPから数値"20"を引っ張って、
表示した時にＭＣで【"00020"人目の訪問者です】
というイメージです。

回答No.1

noname#35109 · ベストアンサー

例のごとく，
PHP 以外の部分を説明します。
つまり，
変数（n）と，その値（20）は，PHPから受け取ることができた次の段階の話からです。

split() と言う遠回りをしなくても，
文字列関数 substr だけでできますよ。

以前，ココ↓で書いた方法でもありますが。

「取得した時間の表示について。」
http://oshiete1.goo.ne.jp/qa2575992.html
　　↑教えて！goo　　↓OKWave　（同じです）
http://okwave.jp/qa2575992.html
　　↑OKWave　　↓教えてBP！（同じです）
http://oshiete.nikkeibp.co.jp/qa2575992.html

しかし，

> 数値の値と同じ値を表示させるＭＣ（ムービークリップ）

これが謎ですね。
どういうことでしょう？

単に，テキストフィールドに表示する桁を合わせたいだけなのか，
0 ～ 9 の文字を画像で表示したいということなのか，
どちらなのでしょうか。

題名にある 【カウンタ画像表示】 というところから，
0 ～ 9 の文字を画像で表示したいと解釈できそうですが...。

/////////////////////////////////////////////////////////////////

とりあえず簡単な，
「単に，テキストフィールドに表示する桁を合わせる」方法から説明します。

PHP から例えば 「n=20」 を受け取ったとします。
また，
ムービークリップのインスタンス名は「counter」にしておいたとしておきます。
また，
「counter」の中のテキストフィールドのインスタンス名は「counttxt」にしておいたとしておきます。
つまり，ファイルの階層構造は次にようになっているということです。

　_root
　　└ counter (ムービークリップ)
　　　　　└ counttxt (テキストフィールド)

そして，
フレームのスクリプトに次のように書けばできあがりです。

--------------------------------------------
var n = 20;
_root.counter.counttxt.text = ("0000"+n).substr(-5, 5);
--------------------------------------------

ご質問で "00020" と書いていらっしゃるところから，
万の位まで表示させると解釈した上でのスクリプトです。

仮に n の値が 20 であるとした場合，
まず， ("0000"+n) で "000020" という文字列が得られます。
次に .substr(-5, 5) で，
"000020" の文字列のうち，最後から5番目の文字（下5桁）から5文字を取ってくることになります。

　００００２０
　　|← ５ →|

("0000"+n) のように 0 を４つ引っ付けているのは，
n の値が 1桁 の場合も有り得るからです。

/////////////////////////////////////////////////////////////////

次に，少しややこしい方，
「0 ～ 9 の文字を画像（凝った文字）で表示させる」方法です。

これはまず，
0～9の画像を 1～10 の各フレームに書いたムービークリップを作成します。
ムービークリップ内のタイムライン↓（ずれていると思いますが）。

　　　　　　　　 　　　　　１　　　　　　　　　　　　　　　10
　□　レイヤー　筆・・|●|●|●|●|●|●|●|●|●|●|
　　　　　　　　 　　　　　０ |１ |２ |３ |４ |５ |６ |７ |８ |９

つまり，
フレーム1 に ０ の絵を描いて，
フレーム2 に １ の絵を描いて，
　　　…　　…　　…
フレーム10 に ９ の絵を描くということです。

そのムービークリップをコピペで５つに増やし横に並べます。

　　↓フレーム1 のみが見えるはずなのですべて ０
　「０」「０」「０」「０」「０」

そして，
左（万の位）から順に c5，c4，c3，c2，c1 というインスタンス名を付けます。
その c5 ～ c1 をまとめて移動しやすいようにさらにムービークリップに変換します。
c5 ～ c1 が入ったムービークリップのインスタンス名を上の説明と同じく，
「counter」ということにしておきます。

つまり，ファイルの階層構造は次にようになっているということです。

　_root
　　└ counter (ムービークリップ)
　　　　　├ c5 (ムービークリップ) 一番左
　　　　　├ c4 (ムービークリップ)
　　　　　├ c3 (ムービークリップ)
　　　　　├ c2 (ムービークリップ)
　　　　　└ c1 (ムービークリップ) 一番右

そして，
フレームのスクリプトに次のように書けばできあがりです。

-------------------------------------------------------
var n = 20;
for (i=1; i<=5; i++) {
_root.counter["c"+i].gotoAndStop(Number(("0000"+n).substr(-i, 1))+1);
}
-------------------------------------------------------

Number は 文字列を数値に変換する関数です。
[ ] は配列アクセス演算子です。
substr に関しては，最初の方法で説明した通りです。

お礼

わかりやすい解説ありがとうございます。
動作確認致しました！