— boreal-kiss.com

Archive
2008年9月 Monthly archive

外部画像ファイルをアプリケーションにドロップしてやるとキャンバスに描画するように改良。キャンバスの解像度が16×16しかないのでファミコンの大昔のキャラクターやらfaviconあたりをつっこむときれいに描画するはず。お試しあれ。» [AIR] Dot3D

追記 2008/09/30

Windowsで機能していない模様。原因究明中。

追記 2008/10/01

Windowsでも機能するようにした。ただしファイルがJPG, PNG, GIF形式の場合のみ。

追記 2008/10/01

以下ライブラリのおかげでICO, BMP形式も描画可能になった。
BMPDecoder – Spark project
ICODecoder – Spark project

Read More

Dot3D for Flash Player 10

AIRのFileStream.writeBytes()がAstro(Gumbo)のFileReference.save()にかわっただけなので移植は超簡単。問題はこれがFlash Player 10正式版になっても稼働するかどうかだ。(昔作ったやつは軒並み死亡)

» Dot3D for Flash Player 10

Read More

外国語相互添削SNS「Lang-8」すごいよいかも。何がよいかというとネイティブに添削してもらえるところ。

例えば海外の雑誌に論文等を書くと、日本人は内容以前にまず間違いなく「一度ネイティブに読んでもらって直してください。」と言われる。ここまでひどいことを言われなかったとしても、ネイティブに手直しを受けていない論文をそのまま世の中に放流すると、今度は技術書翻訳サービス等を扱っている会社からダイレクトメールが来るようになる。「(うちで雇った)学生が貴方の論文内の言い回しが変ちくりんなことに気づきました。うちでは〜〜」等々。ネイティブと非ネイティブには越えられない壁があるのを実感するし、非ネイティブであることは一生自覚していくべきだと常々思っている。

Lang-8だとそんな貴重な(自称)ネイティブな人がどこからともなくやってきて添削してくれる。まあ論文チェックしてもらうわけにはいかないだろうけど、カジュアルだけど正しい外国語で記しておきたいものを見てもらうのによいかも。なんといっても無料だし早いし。Dot3Dの英語ページ直してくれって日記書いたら1時間後には添削されまくってた。アプリケーション使った感想なんかも歓迎って書いといたんだけどそれは無視されてた。でもありがとうrichvhさん!今度変な日本語教えてあげるね!

Adobe AIR application that makes a 16×16 dotted-like picture 3D.
⇒Dot3D is an Adobe AIR application that lets you view a 16×16 pixel picture in 3D.

You can freely draw, rotate a picture on the canvas, and save it on your desktop as an image file (PNG).
⇒You can freely draw, rotate the picture on the canvas, and save it to your desktop as an image file in PNG format.

I am looking forward to Dot3D images made by you!
⇒I am looking forward to seeing Dot3D images made by you!

For the detail, see the last section on the page.
⇒For details, see the last section of the page.

Install automatically from the button below.
⇒Install it automatically using the button below.

If you could not install it automatically, try manual install from here
⇒If you could not install it automatically, try to manually install it from here.

(you may probably need to install Adobe AIR Runtime).
⇒(You may need to install the Adobe AIR Runtime.) OR (You will probably need to install the Adobe AIR Runtime.)

Run Dot3D application.
⇒Run Dot3D.

Push “Rotate” button and drag-and-rotate the canvas.
⇒Push the “Rotate” button to drag-and-rotate the canvas.

Push “Save” button to save the image onto the desktop (PNG).
⇒Push the “Save” button to save the image onto the desktop in PNG format.

The checkbox on the bottom determines whether the image background is transparent (checked) or not (unchecked).
⇒If the checkbox on the bottom is checked, the image background is transparent.

Pushing “Clear” button make a canvas completely whitened, so be careful.
⇒Pushing the “Clear” button completely erases the canvas, so be careful.

Pushing “Reset” button make a canvas on the initial position (i.e., no rotation).
⇒Pushing the “Reset” button returns the canvas to its initial position (i.e., unrotated.)

You can periodically check a newer version of the application from “Update” button.
⇒You can periodically check for a newer version of the application using the “Update” button.

You can follow the instructon to update (everything will go automatically).
⇒Just follow the instructions to update (everything will go automatically.)

I am looking forward to your images on the demo gallery.
⇒I am looking forward to adding your images to the demo gallery.

If you have a nice pics, send them to the following address.
⇒If you have a nice picture, send it to the following address. OR If you have some nice pictures, send them to the following address.

No-rotating image with a background color (i.e., 2D-like)
⇒An unrotated image with a background (i.e., 2D-like)

Rotated image with a background color (i.e., 3D-like)
⇒A rotated image with a background (i.e., 3D-like)

Read More

ドット絵エディターの3Dバージョン!!好きな角度に回転して画像保存(デスクトップにPNG形式で保存)できるのでドット絵マニアは使うといいね!今のところ16×16区画のみ。

» [AIR] Dot3D

追記 2008/09/25

背景(カラー)の表示・非表示機能を追加。ちょっとだけキャンバスを小さくした(500 -> 480 px)

Read More

AirUpdaterUI.mxml

なかなかシステマティックに完成したのでパッケージで公開。セールスポイントはAdobe AIR Update Frameworkの1/10以下のファイルサイズに収まっていること。あと今っぽくAjaxアニメーションで待ち時間を表示すること。AjaxローディングアイコンはAjaxload – Ajax loading gif generatorで作成した。暇なときにでも表示アイコンを増やそうと思う。

AIRアプリケーションのオートアップデートライブラリ(AirUpdater.as)にAjaxローディングアイコンを表示するUI(AirUpdaterUI.mxml)を組み込んだパッケージで以下の機能と利便性があります。

  1. AIRアプリケーションからそのアプリケーションの最新バージョンの有無をチェック
  2. 最新バージョンがあるようならその場でファイルをダウンロード、アップデートを行う(アプリケーションの上書き)。
  3. アップデート情報確認中、および実際のアップデート中にAjaxローディングアイコン(計8種類、選択可能)の表示
  4. アップデート情報のキャッシュを有効にすることでサーバーに負担をかけない設定が可能。
  5. 設定ActionScriptコマンドはわずか2行。
  6. わずか32kbと軽量 (Adobe AIR Update Frameworkは350kb)。

[AIR] AirUpdaterUI.mxml

Read More

Wikipediaを見て調べたので大嘘があるかもしれません。Wikipediaの文章には即しているつもりです。

GPL

コピーレフト(使用等に関する制限が派生物に一生つきまとう)。配布する場合は、改変できるように必要なものを全て配布する必要があり、また複製・改変したものを再配布する場合も同様にGPLに関わるもの全てを開示しなくてはいけない。GPLを含む商用アプリケーションを配布する場合は面倒くさいかも。TVゲームのICOでGPL違反があったとかでニュースになっていたのが記憶に新しい。著作者の表示とかは不要。

代表的なもの:
amfphp
FLARToolKit – Spark project

参考:
GNU General Public License – Wikipedia

Mozilla Public License (MPL)

コピーレフト。基本はGPLと同じ。ただし再配布物のライセンスをMPL, GPL, LGPL(Lesser GPL。GPLより制限の緩いもの)から選択可能な点が異なる。一旦ライセンスを変更した派生物はそのライセンスに従う必要がある。例えばMPLのものを改変しGPLで再配布したらその派生物のライセンスは以降GPLとなる。下記のThunderBoltはコンソール本体のソースを公開していないのでプロジェクト全体としてはMPLの基準を満たしていない。

代表的なもの:
flash-thunderbolt – Google Code
Flex SDK – Adobe open source

参考:
Mozilla Public License – Wikipedia

MIT License

非コピーレフト。問題が生じても一切責任は負わないという条件が特徴(免責事項を記載しなくてよい)。好き勝手使ってよい。著作者と使用許諾(どちらも決まったフォーマット有。詳しくはlicenses/MIT_license – Open Source Group Japan Wiki)を全ての配布物、または重要な箇所に記載しておく必要がある(開示の必要性があるかどうかは不明)。Flashのオープンソースプロジェクトはこのライセンスのものが多い。

代表的なもの:
papervision3d – Google Code
tweener – Google Code
rubyamf – Google Code

参考:
MIT License – Wikipedia

BSD License

非コピーレフト。上記MITライセンスと似ていて無保証と著作権表示を守れば改変・再配布OK。さらに配布物の開示も不要。現在はBSDライセンスに関する宣伝条項を撤廃したNew BSD Licenseが主流(著作者表示を撤廃したわけではない)。

代表的なもの:
as3flexunitlib – Google Code
as3corelib – Google Code
Cairngorm – Adobe open source

参考:
BSDライセンス – Wikipedia

Apache License

非コピーレフト。著作権と免責事項の表示が必要(テンプレート有)。改変したものを配布する場合は、改変箇所の明記が必要。配布時には別途Apacheライセンスの条文コピー(LISENCE)と使用ライブラリに関する詳細(NOTICE)を記述したファイルを添付する必要がある。

代表的なもの:
away3d – Google Code
ICODecoder – Spark project

参考:
Apache License – Wikipedia
Apache License, Version 2.0 – The Apache Software Foundation

追記2009/03/28

New BSDライセンスに関する説明を訂正。詳細はNew BSD License のNew部分を勘違いしてた – boreal-kiss.com

Read More

publicとinternalはクラスに修飾できるので、それ以外のprivate(自分のみアクセス可能なコンストラクタ)とprotected(継承したクラスのみアクセス可能なコンストラクタ)を作ってみる。注意する点があって、ここで言うprotectは継承クラスのアクセスは可能で自分のアクセスは不可。というのも親玉クラスをAbstractクラスとして扱いたいという理由があったからです(サブクラスのみnew可能にしたかった)。

privateクラス

privateにしたいクラス(TestPrivate)ファイル内のパッケージ外部にダミークラスを作成し、TestPrivateクラスのコンストラクタの引数にする。DummyクラスはTestPrivateクラスファイル内ではアクセス可能だが、その他からはアクセス不可能でnewしようとするとコンパイルエラーになる。実際にインスタンスを使用する場合はTestPrivateクラス内のメソッド経由(ここではgetInstance)で作成するしかない。少し改良を加えるとsingletonインスタンスを作るときに使える。

//TestPrivate.as
package com.borealkiss{
    public class TestPrivate {
        
        private _instance:TestPrivate;
        
        //Constructor
        public function TestPrivate(dummy:PrivateClass){
        }
        
        public static function getInstance():TestPrivate{
            _instance = new TestPrivate(new Dummy());
            return _instance;
        }
    }
}

//Dummy class outside the package but still in the same file.
class Dummy{
    //Constructor
    public function Dummy(){    
    }
}

protectedクラス

protectedにしたいクラス内にそのクラス名を記述したコンスタントを作成しておく。コンストラクタ内でnewされようとしているクラス名と比較し、合致したらエラーを吐かせる。TestProtectedクラスをnewするとエラーが表示されるが、TestProtectedクラスのサブクラスの場合、getQualifiedClassname(this)の内容が変化するのでnew可能。Abstractクラス(サブクラスのみnew可能)として利用できる。

//TestProtected.as
package com.borealkiss{
    import flash.errors.IllegalOperationError;
    import flash.utils.getQualifiedClassName;
    
    public class TestProtected {
        private static const THIS_CLASS_NAME:String 
                                            = "com.borealkiss:TestProtected";
        //Constructor
        public function TestProtected(){
            if (getQualifiedClassName(this) == THIS_CLASS_NAME){
                throw new IllegalOperationError("Must be subclassed to use.");
            }
        }
    }
}
Read More

Adobe Labsが提供しているAIRアプリケーションの自動更新機能と専用のUIを含んだ便利パッケージについて。実際の使用方法はAdobe AIR Update Frameworkを使ってみる – kwLogがわかりやすい。

長所

  • 更新情報のキャッシュが効く。ApplicationUpdaterUI.delayというプロパティ(defaultは1日)で最新アプリケーション情報を記述したファイルへのアクセス頻度をコントロールできる(ボタン連打されても無問題)。更新状況はSharedObjectに保存されている。Macだと以下。
    /Users/USERNAME/Library/Preferences/app_name/Local Store/ApplicationUpdater
    
  • 他言語に対応したリリースノートを定義できる。以下のように更新情報を定義しておくと、言語環境に応じてアップデート詳細の表示が変わる。
    <update xmlns="http://ns.adobe.com/air/framework/update/description/1.0">
        <version>2.0</version>
        <url>http://example.com/app_name.air</url>
        <description>
            <!--Release notes-->
            <text xml:lang="en">
                <![CDATA[
                    English description is here.
                ]]>
            </text>
            <text xml:lang="ja">
                <![CDATA[
                    日本語の更新情報はこちら。
                ]]>
            </text>
        </description>
    </update>
  • Adobeが提供しているだけあって見た目がAIR(のインストーラー)っぽい。

短所

  • UIのファイルサイズが結構でかい(~350kb)。元々ファイルサイズ2Mのアプリケーションなら気にならないかもしれないけど、550kbのアプリケーションが自動更新機能付けて900kbになるのは結構萎える。UI無しの選択肢もあることはある。
  • ダウンロードした最新版アプリケーションが上記SharedObject保存先に居座りっぱなし。

結論

導入する/しないのcriteriaは元のアプリケーションファイルサイズかなあ。UIにこだわらず作る気があれば完全に自作でもよいと思う。他言語対応は便利かも。

Read More

SimpleLogger update

[AIR] SimpleLogger ver. 1.07

  • mxパッケージ専用のクライアントSimpleLoggerMx.asを追加。
  • オートアップデート機能を追加。

Alertのデザイン変更ではまった。どうもAlert内部のボタンのデザインはAlertのプロパティbuttonStyleNameを変更してやらないといけないらしい(デフォルトはbuttonStyleName=”alertButtonStyle”)。上記の場合だと

/* alert_desin.css */

Alert{
    buttonStyleName: "alertButton";
    fontWeight: normal;   
    color: #FFFFFF;
    backgroundColor: #101010;
    borderStyle: solid;
    cornerRadius: 4;
}

.alertButton{
    textRollOverColor: #00FF00;
    color: #FFFFFF;
    themeColor: #00FF00;
    fillColors: #101010, #101010;
    borderColor : #101010;
    highlightAlphas: 0.0, 0.0;
    cornerRadius: 4;
    fontWeight: normal;
}

という設定にしてやってmxmlに埋め込んである。

<mx:Style source="alert_design.css" />

コンポーネントのCSSデザインはadobe – Flex 2 Style Explorerを使った。コンポーネントのデザインを動的に変更でき、変更したスタイル情報がその場にCSSとして表示されるので便利。

Read More

追記 2008/09/13

もう少し読みやすい文章(図付き)はこちら

追記 2008/09/16

すでにAdobe AIR Update Framework なんてものがあるじゃないか。。。仕組み的には同じっぽいのでまあ安心した。使い方は自動Update part2 (shin1)が詳しいのかな。

追記 2008/09/17

[AIR] Adobe AIR Update Frameworkを使ってみた – blog Boreal Kiss

___________________________

AIRアプリケーションのアップデート機能は汎用性が高いと思われたので専用のActionScriptライブラリを作った。このライブラリは、(このライブラリをインポート済みの)古いAIRアプリケーションから最新バージョン情報の有無をチェックして、もし最新バージョンがあるようならその場でアップデートを行う。ライブラリ以外に必要なのは以下の2ファイルで、それぞれweb上にアップロードしてあることが前提。

  • アプリケーションの最新バージョン
  • アプリケーション最新バージョンの設置先URLとそのバージョン情報を記述したXMLファイル

以下では上記の準備(1, 2)を行ってからライブラリの使い方(3)について説明している。

1. アプリケーション最新バージョンを作る

例えば最新バージョンのアプリケーション(latest_app.air, バージョン2.0と仮定)を以下のURLにアップロードしたと仮定。

http://example.com/latest_app.air

2. 最新バージョンチェック用のXMLファイルを作る

最新アプリケーションバージョンとそのファイル設置場所に関する情報を記述した以下のようなXMLファイル(update.xml)

<?xml version="1.0" encoding="UTF-8"?>
<application>
    <version>2.0</version>
    <download_url>http://example.com/latest_app.air</download_url>
</application>

を以下のURLにアップロードしたと仮定。

http://example.com/update.xml

3. ライブラリを使う

  1. ライブラリのダウンロード
  2. 古いAIRアプリケーション(例としてバージョン1.0)内にインポートしてAirUpdaterのインスタンスを作成。
    import com.borealkiss.fl.utils.AirUpdater;
    
    var updater:AirUpdater;
    updater = AirUpdater.getInstance("1.0",
                                     "http://example.com/update.xml",
                                     "version",
                                     "download_url");
  3. 上記引数は全てStringで一番前から順番に、(1)現在のアプリケーションバージョン、(2)バージョンチェック用XMLファイルのURL、(3)XMLファイル中の最新バージョンを記述しているノード名(<version>)、(4)XMLファイル中の最新バージョンのURLを記述しているノード名(<download_url>)、となっている。バージョンチェック用XMLファイル内のノード名は好き勝手つけれるが、必ずgetInstance()の引数名と一致させる必要がある。
  4. AirUpdater.check()でバージョンチェック開始。update.xmlの内容を解析して、現在のバージョンとXMLファイルに記述されたバージョンの数値の大小を比較して、(1)最新バージョンがある、(2)最新バージョンはない、(3)送信エラー(アクセス先URLにXMLファイルがない等)、の3通りの場合に対してイベントを返す。それぞれにイベントリスナーを設置。
    updater.check();
    
    //最新バージョンが存在する
    updater.addEventListener(AirUpdater.LATEST_VERSION_FOUND,onFound);
    
    //最新バージョンは存在しない(現在のものが最新)
    updater.addEventListener(AirUpdater.LATEST_VERSION_NOT_FOUND,onFound);
    
    //通信エラー
    updater.addEventListener(IOErrorEvent.IO_ERROR,onFound);
  5. あとは最新バージョンがある場合はAirUpdater.downloadUpdate()を行う。これで最新バージョンのアプリケーションをデスクトップにダウンロードし、現在立ち上げているアプリケーションを最新バージョンに書き換える。
    private function onFound(e:Event):void{
        switch(e.type){
            case AirUpdater.LATEST_VERSION_FOUND:
            updater.downloadUpdate();
            break;
                        
            case AirUpdater.LATEST_VERSION_NOT_FOUND:
            trace("No newer version found");
            break;
                        
            default:
            trace("Error");
    
    
        }
    }

その他注意点

  • 単純に数値の大きいものを最新バージョンと見なす。例えば上記の例の場合、1.0より2.0の方が最新ということになる。AirUpdaterに渡すバージョン情報とXMLファイル中のバージョン情報に数値以外が入っていると解析不能(例えばv2.5)。
  • アプリケーションの実際のバージョン情報を参照するわけではない。AirUpdaterに渡すバージョン数値とXMLファイル中のバージョン数値の大小を比較してアップデートを行う。
  • 最新バージョンをリリースするたびにバージョンチェック用のXMLファイルも修正する必要がある。
  • 同じアプリケーションID同士でないとアップデートできない。
Read More