rssloader.jpg

FLASHにatomフィードを読み込み表示。さらに、モリサワのMBゴシックで表示したかったのでフォントを埋め込んだswfファイルを読み込ませます。

MT RSS Loader

このサイトをリニューアルするときに使いたいので作りました。仕組みを作るのに精一杯で表現はひどいです・・

今回はatomフィードを使ってみましたが、よく考えたらFLASHに全文読み込む必要は無いのでRSSフィードで良かったかも。

クラス主体のコーディング手法は FLASH OOP を参考にしました。やっと mx.eventDispatcher の使い方が分かってきた。また、FLASHでXMLをカンタンに扱うことのできるXPath4AS2というAS2ライブラリをつかってみました。

作成ファイル

rssloader.fla
 ┗embed_font_mc:MovieClip
・embed_font_mcはフォントを埋め込んだSWFの読み込み用に作成したMCです。embed_font_mcの子要素で埋め込んだフォントを使用できます。

MBGothic.fla
・MBGothic Bold を埋め込んだテキストフィールドを作成しパブリッシュします。

rssloader.as
・RSSLoaderパッケージのInitクラスのインスタンスを作成します。rssloader.flaにインクルードしておきます。

/RSSLoader(パッケージ)
 ┗Init.as
  ・RSSLoaderパッケージ内の必要なクラスのインスタンスを作成します。
  ・XMLModelクラスのloadDataメソッドを実行し、読み込みを開始します。
 ┗XMLLoader.as
  ・XMLデータを読み込みます。
 ┗XMLModel.as
  ・読み込んだXMLデータを整形し、onDataイベントを発行します。
 ┗EmbedFont.as
  ・onDataイベントを受信し、embed_font_mcにMBGothic.swfを読み込みます。
  ・onEmbedFontイベントを発行します。
 ┗View.as
  ・onDataイベントでXMLデータを受け取ります。
  ・onEmbedFontイベントを受信し、embed_font_mcにテキストフィールドを作成しXMLデータを表示します。

と、結構大量のスクリプトになったのでソースは端折って掲載します。

Init.as

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
//Init.as
import RSSLoader.*;
class RSSLoader.Init
{
  private var mc:MovieClip;
  //コンストラクタ
  function Init( _mc:MovieClip )
  {
    mc = _mc;
    //XMLモデルのインスタンス
    var model:XMLModel = new XMLModel();
    //XMLデータの読み込み
    model.loadData("http://www.110chang.com/atom.xml");
    //埋め込みフォント読み込みのインスタンス
    var my_embed_font:EmbedFont = new EmbedFont( model, mc.embed_font_mc );
    //SWFファイルのURI指定
    my_embed_font.setURI("http://www.110chang.com/lab/mt_rss_loader/MBGothic.swf");
    //my_embed_font.setURI( "./MBGothic.swf" );
    //ビューのインスタンス
    var my_view:View = new View( model, mc.embed_font_mc );
    //埋め込みフォントにリスナー登録
    my_embed_font.addEventListener( "onEmbedFont", my_view );
  }
}

XMLModel

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
import RSSLoader.SuperModel;
import RSSLoader.XMLLoader;
import com.xfactorstudio.xml.xpath.*
//スライドモデルクラス
class RSSLoader.XMLModel extends RSSLoader.SuperModel
{
  //コンストラクタ
  function XMLModel()
  {
    //コンストラクタ関数のスーパークラスバージョンを呼び出す
    super();
  }
  //ファイル読み込み
  function loadData( url:String ):Void
  {
    XMLLoader.loadXML( url, parse, setData, this );
  }
  //XML解析
  function parse( xml:XML ):Object
  {
    //ここでxpathを使って解析します。
    //titles[i] = XPath.selectNodes( xml, "/feed/entry["+(i)+"]/title/text()" );
    //bodies[i] = XPath.selectNodes( xml, "/feed/entry["+(i)+"]/content/text()" );
    //dates[i] = XPath.selectNodes( xml, "/feed/entry["+(i)+"]/published/text()" );
    //とかやってまとめて返します。
    //data_obj[i] = { title:titles[i], body:bodies[i], date:dates[i] };
    return data_obj;
  }
  private function entryNodesLength( xml:XML ):Number
  {
    var XMLPath:String = "/feed/entry";
    var my_array:Array = XPath.selectNodes( xml, XMLPath );
    return my_array.length;
  }
}

EmbedFont.as

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
import RSSLoader.XMLModel;
class RSSLoader.EmbedFont extends RSSLoader.SuperView
{
  private var mc:MovieClip;
  private var model:XMLModel;
  private var uri:String;
  //コンストラクタ
  function EmbedFont( _model:XMLModel, _mc:MovieClip )
  {
    super();
    mc = _mc;
    model = _model;
    model.addEventListener( "onData", this );
  }
  function setURI( _uri:String ):Void
  {
    uri = _uri;
  }
  private function onData():Void
  {
    var my_mcl = new MovieClipLoader();
    my_mcl.addListener( this );
    my_mcl.loadClip( uri, mc );
  }
  private function onLoadStart( target_mc:MovieClip ):Void
  {
    //ロード開始
  }
  private function onLoadProgress( target_mc:MovieClip, loadedBytes:Number, totalBytes:Number ):Void
  {
    //プログレスバー表示など
  }
  private function onLoadComplete( target_mc:MovieClip ):Void
  {
    //ロード終了
    dispatchEvent({ type:"onEmbedFont" });
  }
}

View.as

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
import RSSLoader.XMLModel;
class RSSLoader.View extends RSSLoader.SuperView
{
  private var mc:MovieClip;
  private var model:XMLModel;
  private var data_obj:Object;
  //コンストラクタ
  function View( _model:XMLModel, _mc:MovieClip )
  {
    super();
    model = _model;
    mc = _mc;
    model.addEventListener( "onData", this );
  }
  function onData( obj:Object ):Void
  {
    data_obj = obj.data
  }
  function onEmbedFont():Void
  {
    for( var prop in data_obj )
    {
      //タイトルを作成
      makeTitle();
    }
  }
  private function makeTitle():Void
  {
    //テキストフォーマットやテキストフィールドの作成
  }
}