Roku动画使用动画精灵，如何制作繁琐xml

Question

我制作了一个简单的 java 脚本代码来创建精灵 sheet xml 用于 roku 中用 brightscript 编写的精灵动画。有没有更简单的方法来传递 sheet 并让它计算出框架的尺寸？那会很酷。

我了解了动画精灵 here。

可以找到代码here。

JS

var generate = function () {
frame_w = parseInt($("#f_w").val());
frame_h = parseInt($("#f_h").val());
sheet_w = parseInt($("#s_w").val());
sheet_h = parseInt($("#s_h").val());

xml = '<BitmapSet>\r\n<Bitmap name="set" filespec="<PLACE YOUR SHEET PATH>">\r\n';
region = 0;
for (y = 0; y < sheet_h; y+=frame_h) {
    for (x = 0; x < sheet_w; x+=frame_w) {
        xml += '<Region name="r'+region+'"  x="'+x+'"   y="'+y+'" w="'+frame_w+'" h="'+frame_h+'"/>\r\n';
        region++;
    }
}
xml += '</Bitmap>\r\n<Animation name="animatedSprite">\r\n';
for (i = 0 ; i < region; i ++) {
    xml += '<frame use="set.r'+i+'"/>\r\n';
}
xml += '</Animation>\r\n';
xml += '<ExtraInfo width="'+frame_w+'" height="'+frame_h+'" />\r\n'
xml += "</BitmapSet>";
$("#xml").html(formatXml(xml));
};

 function formatXml(xml) {
 var formatted = '';
var reg = /(>)(<)(\/*)/g;
xml = xml.replace(reg, '\r\n');
var pad = 0;
jQuery.each(xml.split('\r\n'), function(index, node) {
    var indent = 0;
    if (node.match( /.+<\/\w[^>]*>$/ )) {
        indent = 0;
    } else if (node.match( /^<\/\w/ )) {
        if (pad != 0) {
            pad -= 1;
        }
    } else if (node.match( /^<\w[^>]*[^\/]>.*$/ )) {
        indent = 1;
    } else {
        indent = 0;
    }

    var padding = '';
    for (var i = 0; i < pad; i++) {
        padding += '  ';
    }

    formatted += padding + node + '\r\n';
    pad += indent;
});

return formatted;
 }

如果这对你有帮助，那么亲爱的，我想我会分享。

编码愉快:)

Answer 1

实际上，您不必为 sprite 动画使用 XML 文件。请注意必须设置框架的尺寸。

按照下面的示例，加载 128x128 尺寸和 12 帧的精灵：

compositor = CreateObject("roCompositor")
compositor.SetDrawTo(screen, &h80)
compositor.NewAnimatedSprite(576, 296, GetLoadingSpriteRegions())

Function GetLoadingSpriteRegions() as Object
    arr = []
    bitmap=createobject("robitmap","pkg:/images/loader_sprite.png")

    for i=0 to 1408 step 128        
        region=createobject("roRegion",bitmap,i,0,128,128)    'frame is created here
        arr.Push(region)
    next

    return arr
End Function

Roku动画使用动画精灵，如何制作繁琐xml

Roku animation using animated sprites, how to create the tedious xml

xml

animation

sprite-sheet

roku

brightscript