y***@sina.com
y***@sina.com
  • 发布:2022-11-12 13:52
  • 更新:2024-03-20 14:44
  • 阅读:330

uni.canvasToTempFilePath在ios画出的图片为白屏

分类:HBuilderX

uni.canvasToTempFilePath,添加水印后导出的图片在ios上面显示为白屏,在安卓手机上没有问题

2022-11-12 13:52 负责人:无 分享
已邀请:
很硕大无比的

很硕大无比的

解决了吗,为什么官方不作为啊

喜欢技术的前端

喜欢技术的前端 - QQ---445849201

保存之前加个延时 setTimeout

<template>  
    <view>  
        <canvas canvas-id="myCanvas" id="myCanvas" class="canvas"></canvas>  
        <button @click="downloadImg">btn</button>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  

            }  
        },  
        methods: {  
            downloadImg() {  
                let ctxW = 375  
                let ctxH = 150  
                var context = uni.createCanvasContext('myCanvas')  
                context.fillStyle = '#ffffff' // 设置橙色背景  
                context.fillRect(0, 0, 200, 200)  
                context.drawImage('../../static/logo.png', 2, 2, 50, 50)  
                context.draw()  
                uni.showLoading({  
                    title: '正在下载...',  
                });  
                setTimeout(() => {  
                    uni.canvasToTempFilePath({  
                        canvasId: 'myCanvas',  
                        x: 0,  
                        y: 0,  
                        width: ctxW,  
                        height: ctxH,  
                        destWidth: ctxW,  
                        destHeight: ctxH,  
                        quality: 1.0,  
                        success: function(res) {  
                            uni.saveImageToPhotosAlbum({  
                                filePath: res.tempFilePath,  
                                success: function(saveRes) {  
                                    uni.showToast({  
                                        title: '保存成功',  
                                    });  
                                },  
                                fail: function() {  
                                    uni.showToast({  
                                        title: '保存失败',  
                                    });  
                                },  
                            });  
                        },  
                        fail: function(err) {  
                            console.log(JSON.stringify(err));  
                            uni.showToast({  
                                title: '生成图片失败',  
                            });  
                        },  
                    }, this);  
                }, 2 * 1000)  

            }  
        }  
    }  
</script>  
<style scoped>  
    .canvas {  
        width: 750rpx;  
        height: 300rpx;  
    }  
</style>

要回复问题请先登录注册