つれずれなるままの開発日記(最近はFlexばかり..)

Archive for 4月, 2009

AdobeのサイトからAIR1.5のコンポーネントのサンプルアプリケーションを見つけた。

これを見れば、作りたい部品をどうやってつかえるのかがわかると思う。
また、ソースも見ることができるので役に立つと思います。

難点（？）はAIRアプリなのでインストールが必要です。

http://www.adobe.com/devnet/flex/tourdeflex/

プログラムを作成していると、何かと日付形式の変換にぶつかる。
PHPだと、文字列から日時の変換は strtotime() で、文字列への変換はdate(format)でかなり使えるのだが、
FlexというかActionScriptの場合はどうなのだろうかと・・・・・

でstrtotimeは、Date.format でかなりいけるようだが、date(format)が見当たらないので、
探しているよりはと、作成しました。

出力フォーマットとしては基本的に説明はPHPのdate関数を参考にしています。
ただし、未実装なものもあります。

実装済みなものは d,D,j,l（エル),w,F,m,M,n,t,Y,y,a,A,g,G,h,H,i,s です。
また、ちょっと違った動きをするようにすることができます。

たとえば、曜日の出力を Mon ではなく「月」のような感じです。
日本では結構必要なのではないでしょうか？
上の例では、下記のように出力を第３パラメータに指定しています。

private function clickFmt3():void{
var opts:Object = new Object();
opts["D"] = ["日", "月", "火", "水", "木", "金", "土"];
opts["l"] = ["日曜日", "月曜日", "火曜日", "水曜日", "木曜日", "金曜日", "土曜日"];
opts["F"] = ["睦月", "如月", "弥生", "卯月", "皐月", "水無月", "文月","葉月","長月","神無月","霜月","師走"];
opts["A"] = ["午前","午後"];
output3.text = DateUtils.dateToString(fmt3.text,null,opts);
}

ソースのダウンロードはこちらから

[更新情報:2009/09/08]
こちらのソースは新しく更新されました。
こちらをご覧ください

Flexには、Loggerが用意されておりこれを使うことで、他の言語と同様にログの出力レベルに応じて出力を変えるなど柔軟に対応できる。
また、自分好みにログの出力方法を変えることも可能なのだ。

というわけで、今までTraceTarget（実際の中身はtrace()をしていただけ）を使っていたが、これを任意のファイルに書かせようとおもって、
作成しました。

var fileTarget:FileTarget = new FileTarget();
fileTarget.includeCategory = false;
fileTarget.includeDate = true;
fileTarget.includeTime = true;
fileTarget.includeLevel = true;
fileTarget.level = LogEventLevel.INFO;
// *** ここから FileTarget特有のプロパティ ***** //
fileTarget.directory = File.applicationStorageDirectory;
fileTarget.filename = "log.txt";
// ************************************** //
log.addTarget(fileTarget);
log.info("brabrabra.......");

といった感じに、directoryプロパティとfilenameプロパティで実際に出力するファイルを指定できる。

また、

fileTarget.append = false;
fileTarget.levelSet = [LogEventLevel.DEBUG];

のように
appendプロパティでファイルが追記か、新たに記述するかを指定できる。

また、levelSetというプロパティは、指定したレベルのみを出力することが可能になる。
開発時などにはデバッグレベルのみ別ファイルにして、見てみたいという要望もあることでしょう。

また、ファイルのローテーションなどはありませんが、Timerクラスとfileプロパティを使えば、時間に沿ったローテーションなどもできるには、
できると思い思います。

ソースのダウンロードはこちらから

現在、POP3のプロトコルをSocketクラスを使って読み込むサンプルを作成していたが、
ByteArrayに書き込んだデータを読もうとしても、常に０（ゼロ）になってしまい、はまってしまいました。

var ba:ByteArray = new ByteArray();
ba.writeMultiByte("abc","UTF-8");
trace("Length is " + ba.length + "( " + ba.bytesAvailable + ")");

//  必ず　Error #2030: End of file was encountered.のエラーが発生します。
try{
	var ret1:String = ba.readUTF();
	//  必ずエラーです
}
catch(err:Error){
	trace(err.message);
}

//  positonを0にしなければいけません
ba.position = 0;
trace("Length is " + ba.length + "( " + ba.bytesAvailable + ")");
try{
	var ret2:String = ba.readUTFBytes(ba.bytesAvailable);
	trace(ret2 + " is abc");
}
catch(err:Error){

}

positionを0に設定しなければいけないようです。
結構、ここに達するまでに時間がかかってしまいました。

よくおすすめ度とかで星が並んでいるやつをボタンとして作成してみました。
前回、ImageButtonで画像関連をいじってみましたので、これもできるなとつくってみました。

サンプルとして、ボタンとして星の上の部分をクリックするとその星の数の分だけ、星の色が変わります。
また、現在の星の数は number というプロパティで取得できます。

下のサンプルは、星を押しても何もなりませんが、ボタンを押すと星が増えていきます。
（最大に達すると、また、０に戻ります。）
また、４つ以上になると星の色が変わります。

これらの星は画像として登録できます。
はじめは、ベクターとして線を書こうかなと思いましたが、結局、画像が一番いろいろ融通がきくとおもったので、
画像にしました。

ちなみに、画像は３種類設定できます。

1. 選択されていないときの画像（サンプルでは灰色）
2. 選択されているときの画像（サンプルでは黄色）
3. マウスが上にきたときの画像（サンプルでは赤）

また、条件としてこれらの画像サイズは同じである必要があります。

onImg="@Embed(source='assets/StarOn.png')"
offImg="@Embed(source='assets/StarOff.png')"
overImg="@Embed(source='assets/StarOver.png')"
total="5"
number="4"
buttonMode="true"
click="onMouseClick(event)"
/>

ソースはこちらからダウンロードできます。