質問: 円グラフのようなローダーを・・・ 初心者故に、分かりづらい点や無作法があるかと思います。 分かりづらい点に関しては加えて解説をしたいと思います。 円グラフのようなローダーを作りたく、シェイプトゥイーン等を使って見たのですが、一向に出来ません。 50コマ目に半円、100コマ目に円を置いて、シェイプトゥイーンをするのにはやはり無理がありすぎるのでしょうか。 作り方や参考サイトをご存知の方がいらっしゃいましたら、教えて頂けるとありがたいです。 棒グラフタイプのローダーで100%になると再生開始、というのは作れますので、円グラフのシェイプに関しての疑問ということでお願いします。
回答: 普通は, シェイプトゥイーンでするのではなくて, 角度の小さい扇を描いて,それを複製します。 ローディングなどとは全く関係ない話が主体ですが, 円グラフを作成する部分だけは, このご質問に関連しています↓。 ~ 本家 adobe より ~ 「xml を利用したインタラクティブな円グラフの作成」 http://www.adobe.com/jp/devnet/flash/articles/ad-mix.html 上記ページから 2ページ後 に, http://www.adobe.com/jp/devnet/flash/articles/ad-mix02.html > 円を3.6度分切り出した扇形のグラフィックを用意します。 > このムービークリップは、回転させながら複製するので、 > 基準点が円の中心部分になるように作成します。 と書いてありますね。 こんな感じで細い扇を描いて複製すれば, 円グラフが描けます。 1度の扇を描いてムービークリップに変換して, そのムービークリップをさらにムービークリップの中に入れて, 360フレームでだんだん扇ができるようにして, そのムービークリップのタイムラインをローディングのパーセンテージで進めるようにしてもかまいませんよ。 しかし,かなり面倒ですし, 複製は手動より actionscript の方が,簡単で綺麗(綺麗な角度と位置)に複製できます。 また, 細い扇など描くのも面倒くさいですから, 扇の作図や,ローディングの割合によって, その細い扇を複製するのまで, 全て actionscript でするようにしたものを作ってみました。 それが,次の actionscript です。 _root の フレーム1 に書いて(コピペして) くださると, そのまま使えると思います。 ----------------------------------------------- // とりあえずストップ stop(); // // 扇の中心の x座標(※可変(一応真ん中)) var o_x = stage.width/2; // 扇の中心の y座標(※可変(一応真ん中)) var o_y = stage.height/2; // 扇の半径を設定(※可変) var o_l = 100; // 始まる角度の指定(上から) var o_r = 90; // // ---扇を作成------ // 空のmc「ougi」を 深度1 に作成 _root.createemptymovieclip("ougi", 1); _root.ougi._x = o_x; _root.ougi._y = o_y; _root.ougi._rotation = o_r; // // 空のmc「tri」を 「ougi」 の深度0 に作成 _root.ougi.createemptymovieclip("tri", 0); with (_root.ougi.tri) { // 青色の塗り(※可変) beginfill(0x0000ff, 100); linestyle(1, 0x0000ff, 0); moveto(0, 0); lineto(-o_l, 0); lineto(-o_l*math.cos(math.pi/180), o_l*math.sin(math.pi/180)); endfill(); } // // ローダー // 1フレーム進む時間ごとに毎回実行 _root.ougi.onenterframe = function() { // ロードされた割合を計算 var ratio = _root.getbytesloaded()/_root.getbytestotal(); var deg = math.round(ratio*360); // tri0 ~ tri(deg2) までを 複製&回転 for (var i = 1; i<=deg; i++) { _root.ougi.tri.duplicatemovieclip("tri"+i, i); _root.ougi["tri"+i]._rotation = i; } // もし100%ロードされたら if (ratio>=1) { // mc「ougi」を削除 _root.ougi.removemovieclip(); // 再生開始(※可変) _root.play(); // onenterframe を削除 delete _root.ougi.onenterframe; } }; ----------------------------------------------- 上記スクリプトでは, ロード完了次第,フレーム2に行くようになっていますが, // 再生開始(※可変) _root.play(); この辺は変えてください。