AIRコンポーネントではローカルのファイルにアクセスすることができます。下記のコードは日本語を含むマルチバイトのテキストファイルを読み込み、画面い表示する処理を行います。

大まかな手順

1. FileStreamのコンストラクタの引数に対象のファイルへのパスが設定されたFileインスタンスを渡す。
2. FileStream#openAsyncで実ファイルへのパイプ接続。
3. この時、非同期の読み込み完了／エラーを取得するためにイベントを登録しておく。
4. 実際の文字の読み取り（どれだけ読むか、文字コードの変換など）はFileStream#readMultiByteで行う。
5. ストリームのインスタンスには接続時にpositionプロパティ（何処読んでいるかのポインタみたいなもの）からファイル末尾までのサイズ（bytesAvailable）を取得してるので、読み込みサイズにそれを指定。
6. FileStream#close()でストリームを閉じる

ソースコード

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
  title="テキストビュワー">
  <mx:Script>
    <![CDATA[
    import flash.filesystem.*;
    import mx.events.*;
    import mx.controls.Alert;

    private var choDir:File = File.documentsDirectory; // 開くディレクトリを指す
    private var curFile:File; // 選択されたファイル
    private var stream:FileStream;

    private function onOpenFileBut():void {
      choDir.addEventListener(Event.SELECT, onSelectFile);
      choDir.browseForOpen("開く"); // ファイル選択ダイアログの表示
    }

    // ファイルが選択されたイベント
    private function onSelectFile(e:Event):void {
      txtArea_.text = "";
      stream = new FileStream();
      curFile = e.target as File;
      stream.addEventListener(Event.COMPLETE, onCompleteReadFile);
      stream.addEventListener(IOErrorEvent.IO_ERROR, onIOErrorReadFile);
      stream.addEventListener(ProgressEvent.PROGRESS, onProgReadFile);
      stream.openAsync(curFile, FileMode.READ); // 非同期読み込み
      curFile.removeEventListener(Event.SELECT, onSelectFile);
    }

    private function onCompleteReadFile(e:Event):void {
      try {
        // OS標準の文字コードで読み込み
        var str:String = stream.readMultiByte(stream.bytesAvailable, File.systemCharset);
        // OS標準の改行文字への変換
        var pat:RegExp = new RegExp(File.lineEnding, "g");
        str = str.replace(pat, "n");
        txtArea_.text = str; // テキストエリアに表示
        stream.removeEventListener(Event.COMPLETE, onCompleteReadFile);
        stream.removeEventListener(IOErrorEvent.IO_ERROR, onIOErrorReadFile);
        stream.removeEventListener(ProgressEvent.PROGRESS, onProgReadFile);
      } catch (err:Error) {
        progLab_.text = "IOError: " + err;
      }
      finally {
        // パイプのクローズ
        if (stream != null) {
          stream.close();
        }
      }
    }

    private function onIOErrorReadFile(e:IOErrorEvent):void {
      Alert.show("ファイルを読み込み不可", "Error", Alert.OK, this); // 第4引数には親オブジェトを渡す
      if (stream != null) {
        stream.close();
      }
    }

    private function onProgReadFile(e:ProgressEvent):void {
      progLab_.text = "Progress: " +  e.bytesLoaded + " / " + e.bytesTotal + " bytes";
    }
    ]]>
  </mx:Script>
  <mx:VBox x="0" y="0" height="100%" width="100%">
    <mx:HBox width="100%">
      <mx:Button label="ファイルを開く" id="openBut_" click="onOpenFileBut();"/>
      <mx:Label id="progLab_"/>
    </mx:HBox>
    <mx:TextArea width="100%" height="100%" id="txtArea_"/>
  </mx:VBox>

</mx:WindowedApplication>

リファレンス

• Adobe AIR 1.5 * ファイルの読み取りと書き込みのワークフロー
• Adobe AIR 1.5 * 読み取りバッファと FileStream オブジェクトの bytesAvailable プロパティ

関連すると思われる記事：

• AIR: テキストファイルに書き込み – openAsync()、writeMultiByte()
• Python: CSVファイルの読み込み – csv.readerオブジェクト
• Python: テキストファイルの読み込み – read()、readlines()、readline()メソッド
• Python: テキストファイルに書き込み – write()、writelines()メソッド
• Python: テキストファイルの行頭に行番号を追加

AIR: テキストファイルを非同期に読み込む – openAsync()、readMultiByte() is a post from: Yukun's Blog

Demo(Uncompleted): http://www.yukun.info/labs/flex/AmazoCluster01/
※追記：2011年現在Amazonのサービス仕様の変更により上記のリンク先アプリは正常に動作しません<(_ _)>

これは何？

Amazon.co.jpの任意の商品の類似商品を線で結び関連付けを視覚化するアプリ。（見にくいね。まだ未完成だけど、暇を狙って完成させる）

どうやって使うの？

1. 商品画像をダブルクリックすると類似商品の画像が表示されます。またその画像をダブルクリックすると・・・以下ループ。
2. 画像をドラッグすると線で結ばれた類似商品も納豆の糸のようについてきます。

今後直したい／追加したい機能は？

1. 商品の検索フォーム
2. 商品-類似商品間の距離調整だけでなく類似-類似間の調整も行う
3. 各イベントによる処理のタイミングの調整
4. ドラッグ中の商品とその関連商品を結ぶ線の色と画像のサイズを変更
   • 関連の深さによって色合いとサイズが変化
5. 商品をクリック／マウスオーバーしたときのアクションを増やす
   • タイトル等の商品の詳細情報を表示
   • Amazonページへのリンク
6. 関連度合いによるエフェクトの区別
7. 3D表示：Z軸への意味付け（時間軸、ここでは出版年度なんかは最適かも？）

それができたら使うメリットはある？

たぶん色々とある。作る前から作るべき明確なメリットを定義して作り始めるのがベターというかマストだけど。どちらにせよ仮説と検証の試行錯誤は必要。

そういえば、なんで作ろうと思ったの？

以前授業の課題で書いたX11でフラクタル描くコードと卒研のコードを読み直していたら今回のアプリを想像して「ん？これくらいならサクッと書けるかも」と思ったのが発端。また、「検索行動の典型」＝「フォームにキーワードをスペースはさんで入力→ポチっ→ページのリストから選択」とはひと味変った検索のメリットを見出したい、というのがメタ動機。その一例（にできればいいね）。

作って勉強になったことは？

一応作ることで、以前よりクラスの役割付け（機能の結合度合い）とデザパタの適応を以前よりスムーズにこなせるようにはなった。おおまかな設計→コーディングの速度も少し上がった（気のせい）。でもそれ以外は・・・うーん、今後の課題。
今回はAmazonの商品を線で繋げたけれど、それをTwitter(つぶやき-つぶやき中のキーワード間、ユーザ-フレンド間)やDelicious(タグ-ブックマーク間、ユーザ-フレンド間)、WordPressブログ（タグ-記事間）に変更しても基本UIの部分はわずかな修正でいけるクラス群だと思う。もちろん、場合によっては類似度を算出する部分も用意する必要がある。

最近ブログ書いてないね。

卒研とバイトその他で詰まっているのは理由としては身も蓋もナフサ。単に私の生活の中でブログのプライオリティや使い道が変化してきているのかも。

関連すると思われる記事：

• AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作
• AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加
• AS3でお絵かきFlashを作る (2)ボタン作成 – Flexコンポーネントの導入
• ActionScript: 画像ファイルをダウンロードして表示 – Loaderクラス
• AS3でお絵かきFlashを作る (5)エアーブラシ機能

AmazoCluster: 一発で納得のいくものができればいいけれどね・・・ is a post from: Yukun's Blog

ソースコード

package info.yukun
{
	import flash.display.Loader;
	import flash.display.LoaderInfo;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.IOErrorEvent;
	import flash.net.URLRequest;

	/**
	 * 外部画像のロードサンプル
	 */
	public class LoadImage extends Sprite {
		private var imageURL:String =
			"http://www.google.co.jp/intl/ja/images/about_logo.gif";
		private var imageLoader:Loader;

		public function LoadImage():void {
			init();
		}

		private function init(e:Event = null):void {
			imageLoader = new Loader();
			var imageURLreq:URLRequest = new URLRequest(imageURL);
			var imgInfo:LoaderInfo = imageLoader.contentLoaderInfo;
			imgInfo.addEventListener(Event.INIT, onInit);
			imgInfo.addEventListener(IOErrorEvent.IO_ERROR, onIOerror);
			addChild(imageLoader);
			imageLoader.load(imageURLreq);
		}

		// ダウンロード完了
		private function onInit(e:Event):void {
			trace("Can access the loaded object.");
		}

		// IOエラーによりダウンロード失敗
		private function onIOerror(e:IOErrorEvent):void {
			trace("IO Error.");
		}
	}
}

リファレンス

• Loader – ActionScript 3.0 Language and Components Reference
• LoaderInfo – ActionScript 3.0 Language and Components Reference

関連すると思われる記事：

• ActionScript: マウスをイベントリスナーに登録
• ActionScript: Flash(*.swf)にmp3ファイルを埋め込む – Embedタグ
• AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加
• Android: リソースの画像ファイルの拡大・縮小描画 – drawBitmap()
• AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作

ActionScript: 画像ファイルをダウンロードして表示 – Loaderクラス is a post from: Yukun's Blog

関連すると思われる記事：

• AS3でお絵かきFlashを作る (2)ボタン作成 – Flexコンポーネントの導入
• AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作
• AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加
• AS3でお絵かきFlashを作る (1)自由曲線のUndo、Redo
• AS3はじめました

AS3でお絵かきFlashを作る (5)エアーブラシ機能 is a post from: Yukun's Blog

まず、(2)のオブジェクト間の階層（レイヤー）移動機能ですが、これは描画した図形上で右クリックを押すことで呼び出せるコンテキストメニューから使えます（下図）。

この機能で図形の重なり順序を調節することが出来ます。また、「配置」ツールで図形を選択するとその図形は自動的に最前面レイヤーに移動されます。これによって、マウスイベントの発生源を図形毎に持たせても、重なり具合によるイベントの取りこぼしか無くなる利点があります。結果、OOPにある程度沿ったプログラミングを行うことを可能にします。

ちなみにこのレイヤー移動アクションは履歴には記録せずundo、redoの対象にはしませんでした（このレベルのアプリに対しては必要ないかと思ったので）。もし貼り絵のように絵を描きたく、またundoを利用していきたい場合はPhotoshopやGIMP等の明確なレイヤー機構を実装したほうがすっきりすると思います。内部機能の実装の手間はさほど掛かりませんが、ツールボックスのようなUIを作らなくてはいけないのが今の私にとってメンドイところです。しかしFlexコンポーネントを学ぶ良い機会でもあるのでさわりだけでもやってみようかな。

こう機能が増えてくるとユーザインターフェース(UI)にもしっかり取り組まなければならないんですが、UIはリリースするプラットフォーム（PCデスクトップ上、PCブラウザ上、モバイル、スマートフォン）に依存する部分が大きいのでまだ取り掛かるのはいいかなと思ったり（ぉぃ）。

さて、今回で基本的なブラシツール（ベクター以外）は揃ったかと思いますので、そろそろテキスト系の機能を実装していきたいと思います。初回に「頭の中のアイディアを楽しくまとめられるツールを作ってみたい」とのたまっていたので、ちょっとチャレンジしてみます。合わせてベクターツールも追加してみます。

関連すると思われる記事：

• AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加
• AS3でお絵かきFlashを作る (1)自由曲線のUndo、Redo
• AS3でお絵かきFlashを作る (2)ボタン作成 – Flexコンポーネントの導入
• AS3でお絵かきFlashを作る (5)エアーブラシ機能
• AmazoCluster: 一発で納得のいくものができればいいけれどね・・・

AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作 is a post from: Yukun's Blog

描画できる図形の種類を直線、長方形、楕円に増やしました。また、描いた図形を任意の場所に移動することが出来ます（「配置」ボタンをクリック後、図形をドラッグ＆ドロップ）。そして、配置移動も履歴に残しているのでUndo、Redoの対象になります。

以下は作成後の反省点の一部の走り書き。

問題点や改善点

• 図形の描画やオブジェクトのD&Dの際に、線分上に薄い青のエフェクトをかけると爽快感＋視認性が上がるかなぁと試してみたんですが、実装したら煩わしい感じになってしまいました。エフェクトのON/OFFのチェックボックスをつけておこう。
• 図形オブジェクトがD&Dでキャンバスのサイズ外に出てしまう。Flexコンポーネントの親子関係や背景色の設定し忘れ等からくる問題だと推測。
• 描画ツールのボタンは押し込み式にして、選択しているツールを分かりやすくしよう。レイアウトいじるのは後回しになりがちだなぁ。
• 長方形と楕円ツールは塗りつぶし設定の追加やShift+ドラッグ描画で正方形と円を作成できるようにしておこうかな。
• 複数の図形が重なった際のドロップ処理の再考。

関連すると思われる記事：

• AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作
• AS3でお絵かきFlashを作る (2)ボタン作成 – Flexコンポーネントの導入
• AS3でお絵かきFlashを作る (1)自由曲線のUndo、Redo
• AS3でお絵かきFlashを作る (5)エアーブラシ機能
• AmazoCluster: 一発で納得のいくものができればいいけれどね・・・

AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加 is a post from: Yukun's Blog

以前はボタンを作るのに直書きしていましたが、レイアウトの配置修正に手間取るのでFlexコンポーネントを使用することにしました。

少し話し変わりますが、ActionScriptのGraphicsクラスは標準で適切なタイミングでスクリーンのバッファをとっているのかな。

Javaでは通常画面バッファをとっていない為ウィンドウ描画の度にチラつきがあり、書き手がその辺の面倒を見なければいけませんでした。

しかし、ASではそういった設定が無くともチラつきが無いので、Graphicsクラス内部でやってくれているのかなぁと推測してみました（まだ調べていません）。

また話し変わりますが、フレームワークに囚われるとその枠組みから離れるた場合に思考停止になる危険があるかも。フレームワークの利点欠点が見極められるようにならないとなぁ(自戒)。

関連すると思われる記事：

• AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加
• AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作
• AS3でお絵かきFlashを作る (5)エアーブラシ機能
• AS3でお絵かきFlashを作る (1)自由曲線のUndo、Redo
• AmazoCluster: 一発で納得のいくものができればいいけれどね・・・

AS3でお絵かきFlashを作る (2)ボタン作成 – Flexコンポーネントの導入 is a post from: Yukun's Blog

まぁ最初は単なるペイントツールの機能を実装していきます。

さて、1回目は定番というか基本というかUndo（元に戻す）とRedo（やり直し）機能を実装してみました。
以下のFlash上でドラッグ＆ドロップすると青い線を引けると思います。

使い方

• Undo: 描いた線を取り消すにはZキーを押してください。
• Redo: Undoで取り消した線を再度描く（やり直す）際にはYキーを押してください。

どちらも、IMEの日本語入力はオフにして試してください。

今後はオープンソースのペイントプログラムを参考にしてみようかな。

関連すると思われる記事：

• AS3でお絵かきFlashを作る (4)塗りつぶしと簡易レイヤーの操作
• AS3でお絵かきFlashを作る (3)図形描画と配置選択ツールの追加
• AS3でお絵かきFlashを作る (2)ボタン作成 – Flexコンポーネントの導入
• AS3でお絵かきFlashを作る (5)エアーブラシ機能
• AS3でMind MapぽいFlashを作る (1)ノード間隔の安定化

AS3でお絵かきFlashを作る (1)自由曲線のUndo、Redo is a post from: Yukun's Blog

ソースコード

次のコードはEmbedタグで指定したサウンドを再生する処理を表しています。
PlaySound.as

package info.yukun
{
	import flash.display.Sprite;
	import flash.media.Sound;

	public class PlaySound extends Sprite
	{
		[Embed(source='sample.mp3')] // mp3ファイルのパスを指定（ここではカレントディレクトリのsample.mp3ファイル）
		private static const SampleSound:Class;

		private var sampleMp3:Sound = new SampleSound();

		public function PlaySound():void
		{
			sampleMp3.play(); // サウンドの再生
		}
	}
}

コードの説明

[Embed(source='sample.mp3')]
で指定されたmp3ファイルは、
private static const SomeSound:Class;
で静的なプロパティにClass型として格納します。次に、
private var sampleMp3:Sound = new SampleSound();
でSoundクラス型変数にSampleSoundインスタンスを代入し、
これによって、play()メソッドを用いてサウンドを再生しています。

Embedにはsource属性の他にもsymbolというのがあるみたいです。後でさらっておこうかな。

参考にしたサイト

• Embedding Resources with AS3 | BIT-101 Blog
• Sound – ActionScript 3.0 コンポーネントリファレンスガイド

関連すると思われる記事：

• ActionScript: 画像ファイルをダウンロードして表示 – Loaderクラス
• AIR: テキストファイルを非同期に読み込む – openAsync()、readMultiByte()
• AIR: テキストファイルに書き込み – openAsync()、writeMultiByte()
• ActionScript: マウスをイベントリスナーに登録
• ActionScript: XMLの子要素の読み込み – XMLオブジェクトと「.. 」「[]」演算子

ActionScript: Flash(*.swf)にmp3ファイルを埋め込む – Embedタグ is a post from: Yukun's Blog

XMLの扱い方の一例

以下は上のFlashの解説ではありませんが、作成過程でXMLの扱いで詰ったところがあったのでピックアップしてみます。

使用するXMLデータ

通常は外部ファイルを読み込みますが下の例ではXMLデータをソースコード中に書き込んでいます。
まず、扱うXMLデータは、

<?xml version="1.0" encoding="UTF-8"?>
<books>
  <book>
    <title><![CDATA[新版 明解C言語 入門編]]></title>
    <author><![CDATA[柴田望洋]]></author>
    <image>http://ecx.images-amazon.com/images/I/51N3ym-NBRL._SL75_.jpg</image>
  </book>
  <book>
    <title><![CDATA[プログラミング言語C ANSI規格準拠]]></title>
    <author><![CDATA[B.W. カーニハン]]></author>
    <image>http://ecx.images-amazon.com/images/I/41W69WGATNL._SL75_.jpg</image>
  </book>
  <book>
    <title><![CDATA[やさしいC++―まずは「C言語」からはじめよう!! (I・O BOOKS)]]></title>
    <author><![CDATA[米村 貴裕]]></author>
    <image>http://ecx.images-amazon.com/images/I/51PKHX9QEVL._SL75_.jpg</image>
  </book>
</books>

とします。本のデータはAmazonで検索語を「C言語」にして検索した結果を用いています。
ちなみに、

<![CDATA[ホニャララ]]>

タグで囲まれた要素内では全ての文字列を扱うことが出来ます。

外部XMLデータからXMLオブジェクトを作成

大抵は外部ファイルから読み込みます。その場合は、URLLoaderクラスのdataフィールドをXMLのコンストラクタの引数に渡せばOKです。

var urlLoader:URLLoader = new URLLoader();
urlLoader.load("http://www.example.com/text.xml");
// 中略：ロードが完了(のイベントをキャッチ)したら↓
var booksXml:XML = new XML(urlLoader.data);

ここではbooksXml変数がXMLオブジェクトです。

ソースに直接XMLデータを書き込む場合

あまりそういった場合は無いのですが、テストなどの際は

var booksXml:XML = <?xml version="1.0" encoding="UTF-8"?>
<books>
	<book>
		<title><![CDATA[新版 明解C言語 入門編]]></title>
		<author><![CDATA[柴田望洋]]></author>

＜中略＞

	</book>
</books>;

のように書きます。他にもXMLコンストラクタに文字列リテラルとして渡すことも可能です。その場合、渡す文字列は一行にします。

XMLの各要素と属性へのアクセス

今回扱うXMLの入れ子の深さ2ですかね。booksタグの中にbook要素があり、そのbookタグの中にtitle、author、image要素があり、それぞれのタグの中にほしいデータがある、と。

XMLオブジェクトにデータを代入しインスタンスを作成した際に、パースは終わっていますので子要素へのアクセスは「.」、子孫へは「..」や「[]」演算子を用います。また、子(子孫)属性に対しては「.@」「..@」です。

trace(booksXml.book); // 実行結果A (booksXml['book']と同値)
trace(booksXml.book.title); // 実行結果B (xml['book']["title"]やbooksXml..titleと同値)

実行結果A

  <book>
    <title><![CDATA[新版 明解C言語 入門編]]></title>
    <author><![CDATA[柴田望洋]]></author>
    <image>http://ecx.images-amazon.com/images/I/51N3ym-NBRL._SL75_.jpg</image>
  </book>
  <book>
    <title><![CDATA[プログラミング言語C ANSI規格準拠]]></title>
    <author><![CDATA[B.W. カーニハン]]></author>
    <image>http://ecx.images-amazon.com/images/I/41W69WGATNL._SL75_.jpg</image>
  </book>
  <book>
    <title><![CDATA[やさしいC++―まずは「C言語」からはじめよう!! (I・O BOOKS)]]></title>
    <author><![CDATA[米村 貴裕]]></author>
    <image>http://ecx.images-amazon.com/images/I/51PKHX9QEVL._SL75_.jpg</image>
  </book>

実行結果B

<title><![CDATA[新版 明解C言語 入門編]]></title>
<title><![CDATA[プログラミング言語C ANSI規格準拠]]></title>
<title><![CDATA[やさしいC++―まずは「C言語」からはじめよう!! (I・O BOOKS)]]></title>

一致する全ての要素をXMLList形式で返しています。実際のプログラムではfor文で回してデータを取得します。
上で使った演算子に代わるメソッド等もありますが、それらはまたの機会に取り上げてみます。

関連すると思われる記事：

• ActionScript: Flash(*.swf)にmp3ファイルを埋め込む – Embedタグ
• ActionScript: 画像ファイルをダウンロードして表示 – Loaderクラス
• AS3でお絵かきFlashを作る (5)エアーブラシ機能
• AS3でMind MapぽいFlashを作る (2)各ノードのドラック＆ドロップ
• ActionScript: マウスをイベントリスナーに登録

ActionScript: XMLの子要素の読み込み – XMLオブジェクトと「.. 」「[]」演算子 is a post from: Yukun's Blog