在flash中用webp圖像

原創

2018-08-26 14:08

顯示不完整請移步作者官方博客：http://www.sineysoft.com/blog/post/124.html

webp是google的發佈的新的互聯網圖片格式,與傳統的jpg,png圖片相比,在不明顯損失圖片質量的情況下,擁有更大的圖片壓縮比, 同時支持alpha通道圖片,與flash自帶的透明圖像壓縮方法(通道分離+jpg圖片壓縮)相比也有更大壓縮比,所以在flash遊戲中如果採用webp格式將會顯著降低資源尺寸,加速下載, 可惜的是flash player沒有直接提供對webp的支持,想到可以用alchemy移植webp的代碼.

開始在google搜索,找到一個blog,幹了同樣的事情,可是下載回來發現它提供的swc不支持帶alpha通道的圖片格式,真是見鬼了,這不是google提供的代碼嗎?難道他還有刪減? 不死心,於是自己download webp源碼移植到alchemy, 才發現各種問題, 怪不得人家不支持, 首先是alchemy不支持__asm__的內聯彙編,修改爲c代碼後,發現自己生成的庫也不支持alpha通道圖片,還是不死心,代碼內加入各種log,跟蹤到底是哪裏出的問題,最後發現是alchemy不支持uint64的位移操作,所有<<,>>這樣的操作都返回0, 這可要命了, 沒有辦法手寫c代碼替換n多位移操作,總算可以編譯通過,解碼帶有alpha通道的圖片了,夠折騰的.

最終生成的 webpswc.swc 在這裏

完整支持webp各種格式, 包括帶alpha通道的webp格式.

測試代碼如下:

package
{

    import flash.display.*;
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.Sprite;
    import flash.geom.*;
    import flash.utils.*;
    import flash.utils.ByteArray;
    import flash.net.*;
    import flash.events.*;
    import sineysoft.WebpSwc;

    public class webptest extends Sprite
    {
        [Embed(source="img.webp", mimeType="application/octet-stream")]
        private const WebPImageClass:Class;

        [Embed(source="monster.webp", mimeType="application/octet-stream")]
        private const MonterClass:Class;


        public function webptest()
        {
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.align = StageAlign.TOP_LEFT;
            init();
        }

        private function init():void
        {

            var now:int = getTimer();
            var ba:ByteArray = new WebPImageClass() as ByteArray;
            var bitmapData:BitmapData = WebpSwc.decode( ba );
            trace(getTimer()-now);

            addChild(new Bitmap(bitmapData as BitmapData));

            now = getTimer();
            ba = new MonterClass() as ByteArray;
            bitmapData = WebpSwc.decode( ba );
            trace(getTimer()-now);

            addChild(new Bitmap(bitmapData as BitmapData));

        }
    }
}

數據對比

格式	----	對應webp尺寸, 標準webp輸出質量 80
monster.png( png8 格式,帶alpha通道 ) 44452 bytes		23814 bytes 需要chrome瀏覽器纔可以預覽
img.jpg (photoshop 輸出質量 8) 232407 bytes 點擊查看原圖		91238 bytes 需要chrome瀏覽器纔可以預覽
monster.swf(採用swf壓縮,jpg 壓縮質量80) 28492 bytes		23814 bytes 需要chrome瀏覽器纔可以預覽