APNG在QT中的使用-代码篇（二）

代码

apng-canvas.js库文件已上传，经过修改后可在QT，浏览器上正常使用。【点击此处下载apng-canvas.js】

function convertImgDataToBlob(base64Data) {  
      var format = "image/png";  
      var code = window.atob(base64Data);;  
      var aBuffer = new window.ArrayBuffer(code.length);  
      var uBuffer = new window.Uint8Array(aBuffer);  
      for(var i = 0; i < code.length; i++){  
          uBuffer[i] = code.charCodeAt(i) & 0xff ;  
      }  

      var blob=null;  
      try{  
          blob = new Blob([uBuffer], {type : format});  
      }  
      catch(e){  
          window.BlobBuilder = window.BlobBuilder ||  
          window.WebKitBlobBuilder ||  
          window.MozBlobBuilder ||  
          window.MSBlobBuilder;  
          if(e.name == 'TypeError' && window.BlobBuilder){  
              var bb = new window.BlobBuilder();  
              bb.append(uBuffer.buffer);  
              blob = bb.getBlob("image/png");  

          }  
          else if(e.name == "InvalidStateError"){  
              blob = new Blob([aBuffer], {type : format});  
          }  
          else{  

          }  
      }  
      return blob;     
};  

function replaceAnmiationEmotion()
{
    $('#apng').find('.apng_image').each(function(){    
        var imgObj = $(this);
        var emotionPath = imgObj.attr("src");
        //getImageBase64从QT上获取图片数据
        var baseData64 = external.getImageBase64(emotionPath);
        var reader = new FileReader();  
        var blob = convertImgDataToBlob(baseData64);
        reader.readAsBinaryString(blob);
        reader.onload=function(file){
            var url=file.target.result;
            url=encodeURI(url);
            imgObj.attr("data-src",url);
            APNG.animateImage(imgObj[0]);
        }
    });
}

QString getImageBase64(QString filePath)
{
    QFile file(filePath);
    bool ret = file.open(QIODevice::ReadOnly);
    QString data= file.readAll().toBase64();
    file.close();
    return data;
}

效果图

参考链接

APNG在QT中的使用（一）