mieki256's diary



2013/09/10(火) [n年前の日記]

#1 [haxe] HaxeFlixel勉強中

Haxe + OpenFL + HaxeFlixel で書いたサンプルが、flashで書き出すと動くのに、html5で書き出すと動かない件。なんかちょっと分かってきた。
json を解析するところで止まってしまう症状は、json 解析後に、var w = Std.parseInt(d.width); 等、Std.parseInt() を使ってたせいらしい。json解析直後、数値にできる情報は既に数値になっているようで、また数値化しようとするとそこでコケる、のかなと。

04WebServer を経由して開いた html 上では、一応動くようになった。Firefox、Google Chrome、IE で動くことを確認。もちろん、サウンドは鳴ってないけど。

TmxJson.hx の修正版をメモ。 :

_Tiled Map Editor でエクスポートした json を読んで、BG描画用の csv に変換するソース、の修正版をメモ。

TmxJson.hx
package ;

import haxe.Json;

/**
 * Tiled Map Editor で export した json を解析
 * @author mieki256
 */
class TmxJson {

    public var width:Int;
    public var height:Int;
    
    public var layerTileData:Map<String,String>;
    public var layerWidth:Map<String,Int>;
    public var layerHeight:Map<String,Int>;
    
    public var tileWidth:Int;
    public var tileHeight:Int;
    
    public function new(jsondata:String) {
        // jsonを解析
        var d = Json.parse(jsondata);
        
        // タイルの縦横個数を取得
        width = d.width;
        height = d.height;
        
        // タイルのサイズを取得
        tileWidth = d.tilewidth;
        tileHeight = d.tileheight;
        
        layerTileData = new Map();
        layerWidth = new Map();
        layerHeight = new Map();

        // 各レイヤーのタイル並び情報を取得
        var layernum:Int = d.layers.length;
        for (i in 0...layernum) {
            var name:String = untyped d.layers[i].name;
            
            // レイヤーの縦横タイル個数を取得
            var w:Int = untyped d.layers[i].width;
            var h:Int = untyped d.layers[i].height;
            layerWidth.set(name, w);
            layerHeight.set(name, w);
            
            // タイル並びを整形
            var tiledata:Array<Int> = untyped d.layers[i].data;
            var count = 0;
            var layer:String = "";
            for (y in 0...h) {
                var row = new Array();
                for (x in 0...w) {
                    var c:Int = untyped tiledata[count];
                    
                    // Tiledのデータは、
                    // 0番が透明、1番からチップ番号が始まるので、
                    // 若干番号を調整する。
                    if ( c > 0 ) c -= 1;
                    
                    row.push(c);
                    count++;
                }
                layer += row.join(",") + "\n";
            }
            layerTileData.set(name, layer);
            //trace('tmx layer=$name is save');
        }
    }

    // 与えられたレイヤー名のタイル並びを返す
    public function getLayer(layerName:String):String {
        if (layerTileData.exists(layerName)) {
            return layerTileData.get(layerName);
        }
        else {
            trace('$layerName layer is None');
            return "0";
        }
    }
    
}

利用してる箇所をメモ。
import flash.display.BitmapData;
import openfl.Assets;
import org.flixel.FlxTilemap;
import TmxJson;
        // BGを生成
        
        // BG用画像ファイル読み込み
        var mapimg:BitmapData = Assets.getBitmapData("assets/maps/mylevel1_tiles.png");

        // json読み込み
        var mapdata:String = Assets.getText("assets/maps/mylevel1.json.txt");

        // json解析・BG用データを記録
        var dt:TmxJson = new TmxJson(mapdata);

        // 奥のBG
        bg_c = new FlxTilemap();
        bg_c.loadMap(dt.getLayer("layer4"), mapimg, dt.tileWidth, dt.tileHeight, FlxTilemap.OFF);
        bg_c.solid = false; // アタリなし
        bg_c.scrollFactor.x = 0.25; // スクロール速度の割合
        bg_c.scrollFactor.y = 0.25;
        add(bg_c);

ただ、Hxae + OpenFL には、そもそも tmx というライブラリがあって、ソレを使えば直接 tmx から ―― Tiled の保存ファイルから読み込みができそうなのだけど。使い方がどこにも載ってなかったので今回はアレだけど、そのあたりのドキュメント・サンプルが出てくるならそっちを使ったほうが良さそうだなと。

#2 [cg_tools] ImageMagickでインデックスカラーのpngをアルファチャンネルつきフルカラーpngにしたい

HaxeFlixel ではインデックスカラーのpngを扱えないように見えたので、アルファチャンネルつきフルカラー画像の png にしないといけない。EDGE2で編集するたびに、GIMPで開いて変換してたけど、いくらなんでもアホすぎるなと。

ImageMagick を使えば、以下でできるらしい。
convert hoge.png png32:hoge.png
png32 てのが、32bit color = アルファチャンネルつきフルカラー、に相当するのだろうか。

これで変換できるかなと思ったのだけど、identify -verbose hoge.png で確認してみたら、Type: PaletteAlpha と表示されてるな…。ファイルサイズは増えているから、何かしら以前とは違った内容になっているのは間違いないけど。まあ、HaxeFlixel で扱えてるみたいだから、これでもいいのかな…。

そもそも、HaxeFlixel 上でも、インデックスカラーのpngは扱えるっぽい。256色のpngにしたらフツーに表示できた。以前試したときは色数が異常だったのだろうか…?

#3 [cg_tools] blenderで作業中

宝石アイテムがくるくる回転するアニメを作りたいなと思って作業してるのだけど。コレがなかなか上手く行かず。くるくる回ってる際にピカッピカッと光が反射する感じにしたいのだけど、ライトの位置が上手く調整できなくて。

最初のうちは、ダイヤモンドっぽい形のソレを回していたのだけど、縮小するとどうも回転してるように見えず。結局、ラピュタの飛行石みたいな形を作り直したり。

ちなみに、アドオンの _Add Extra Objects を追加すると、色々な形を一発で作ってくれる。 _Gemstones てのが宝石形状。

以上、1 日分です。

過去ログ表示

Prev - 2013/09 - Next
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

カテゴリで表示

検索機能は Namazu for hns で提供されています。(詳細指定/ヘルプ


注意: 現在使用の日記自動生成システムは Version 2.19.6 です。
公開されている日記自動生成システムは Version 2.19.5 です。

Powered by hns-2.19.6, HyperNikkiSystem Project