base64转成图片的问题

Creator 2.x
#30

人工置顶。

#31

ios会报错

#32

微信小游戏上 android手机会显示不了图片，不过改成.png就没问题了。 ios会报错ERROR 4930。

#33

已解决，是base64编码问题，andriod可行，在ios上 + 识别不了 改成 %2B 就行了

1赞
#34

请问你是2.4以后的版本么

#35

我用的是2.4.3 ，运行平台在微信小游戏

#36

额 那跟我的情况完全不一样

#37

人工置顶！

#38

帮你 置顶一次 类似问题 我也想找到答案.

#39

mark!!!

#40

人工指定！

#41

人工置顶！

#42

var image = new Image();

                image.src = "data:image/jpeg;base64," + strData;

                let texture = new cc.Texture2D();

                texture.initWithElement(image);

                texture.handleLoadedTexture();

                callback(fileName, texture);
#43

老哥 你这个是web的解决方案，native下Image会报错

#44

let img = new Image();
img.src = “data:image/jpeg;base64,” + base64Data;

img.onload = function () {
let texture = new cc.Texture2D();
texture.initWithElement(img);
let spriteFrame = new cc.SpriteFrame(texture);
sprite.spriteFrame = spriteFrame;
}

#45

老哥 你这个是web的解决方案，native下Image会报错

#46

这方法跑3.x版本，又用不了。

#47

3.x 方法：

    var self = this;
    var img = new Image();
    img.src = base64htmlstring;   //base64 转为贴图 到 Sprite或Mesh上

    img.onload = function () {
        let imgAsset = new ImageAsset();//重置此图像资源使用的原始图像源
        imgAsset.reset(img);

        let texture = new Texture2D();
        texture.image = imgAsset;

        const sp = new SpriteFrame();
        // sp.reset({
        //     originalSize: spriteframe.getOriginalSize(),
        //     rect: spriteframe.getRect(),
        //     offset: spriteframe.getOffset(),
        //     isRotate: spriteframe.isRotated(),
        //     borderTop: spriteframe.insetTop,
        //     borderLeft: spriteframe.insetLeft,
        //     borderBottom: spriteframe.insetBottom,
        //     borderRight: spriteframe.insetRight,
        // });
         
       //sprite 图片
        sp.texture = texture;
        self.node_sprite.getComponent(Sprite).spriteFrame = sp;
     
        let Meshtexture = new Texture2D();
        Meshtexture.image = imgAsset;
       
       //mesh  模型
        self.node_mesh.material.setProperty('mainTexture', Meshtexture);

    }
5赞
#48

UPNG.js https://github.com/photopea/UPNG.js

/**
 * 格式化二进制数据
 * @param data 
 * @returns 
 */
protected getUint8ArrraybyData(data) {
    // @ts-ignore
    const img = UPNG.decode(data);
    // @ts-ignore
    var buffer = UPNG.toRGBA8(img)[0];
    return new Uint8Array(buffer);
}

                // @ts-ignore  
                const data = jsb.fileUtils.getDataFromFile(pathNative);
                const u8array = this.getUint8ArrraybyData(data);
                const texture2d = new cc.Texture2D();
                texture2d.initWithData(u8array, cc.Texture2D.PixelFormat.RGBA8888, value.width, value.height);
                const spriteFrame = new cc.SpriteFrame();
                spriteFrame.setTexture(texture2d);
                this.iconSpriteFrame = spriteFrame;

不知道 这样行么？我截图保存后， 再读取是可以的 版本2.4.3

1赞
#49

v3.6版本实现：
const newBaseStr = “data:image/jpeg;base64,” + imgBase64Str;
assetManager.loadRemote(newBaseStr, {ext:’.jpeg’}, (err, imgAsset:ImageAsset)=>{
console.log(imgAsset);
const texture = new Texture2D();
texture.image = imgAsset;
const sp = new SpriteFrame();
sp.texture = texture;
const avatar = find(’/Canvas/nodeAvatar’);
const avatarSp = avatar.getComponent(Sprite);
avatarSp.spriteFrame = sp;
})

1赞