uni-app uni.chooseImage 设置crop裁剪后选择图片黑屏且app自动重启

uni-app uni.chooseImage 设置crop裁剪后选择图片黑屏且app自动重启

信息类别 信息内容
产品分类 uniapp/App
PC开发环境 Mac
版本号 10.13.6
HBuilderX Alpha
版本号 3.3.2
手机系统 Android
版本号 Android 4.4
手机厂商 smartisan
手机机型 T1
页面类型 nvue
Vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

示例代码:

<template>  
    <view class="container">  
        <text>点击方框调用uni.chooseImage</text>  
        <view class="chooseimg-view" @tap="chooseUserImg">  
            <image :src="avatar" mode="aspectFill" class="user-img" ></image>  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                avatar: ""  
            }  
        },  
        onLoad() {  
        },  
        methods: {  
            /**  
             * chooseUserImg  
             */  
            chooseUserImg() {  
                var the = this;  
                uni.chooseImage({  
                    count: 1, //默认9  
                    sourceType: ['album'],  
                    crop:{  
                        width: 400,  
                        height: 400  
                    },  
                    success: function (res) {  
                        console.log(res);  
                        the.avatar = res.tempFilePaths[0];  
                    },  
                    fail: function(err) {  
                        console.log(err);  
                    }  
                });  
            },  
        }  
    }  
</script>  

<style>  
    .chooseimg-view {  
        margin: 50rpx;  
        width: 200rpx;  
        height: 200rpx;  
        background-color: #2C405A;  
        border-radius: 15rpx;  
    }  
</style>

操作步骤:

1.点击调用uni.chooseImage  
2.选择图片后,等1秒出现黑屏,然后app自动重启  

备注:uni.chooseImage调用后,App.vue中onHide( ) 方法会被调用,不知道这是不是正常的?

预期结果:

uni.chooseImage 设置crop裁剪 选择图片后,能正常返回已经选择的图片,并且app不自动重启

实际结果:

uni.chooseImage 设置crop裁剪 选择图片后,app自动重启

bug描述:

uni.chooseImage 设置crop裁剪,选择图片后,等1秒出现黑屏 ,然后app自动重启

附件:

test_choseimg.zip


更多关于uni-app uni.chooseImage 设置crop裁剪后选择图片黑屏且app自动重启的实战教程也可以访问 https://www.itying.com/category-93-b0.html

24 回复

未复现此问题 此设备在旧版是否正常? 此版本使用其他设备是否正常?

更多关于uni-app uni.chooseImage 设置crop裁剪后选择图片黑屏且app自动重启的实战教程也可以访问 https://www.itying.com/category-93-b0.html


此设备在旧版HBuilderX上 正常,之前测试通过,HBuilderX用新版本就不行了

iphone6 测试正常

目前手边只有这个android设备

视频上传了

3.3.5的编辑器打包的 然后华为m10(安卓9的)也是这样,裁剪的时候直接黑屏了 就卡主了,我华为10的手机是正常的,在雷电模拟器也会出现 华为m10一样的情况,直接黑屏然后卡死

录屏看下

录制屏幕视频已上传附件

录制屏幕视频 已上传附件

此问题确实存在,个别手机有这种问题,目前我们自己有一个安卓9的手机会存在这个问题,安卓10的正常。就很正常的代码,只有一个选取图片和截取 demo附上 录屏视频附上,而且我在雷电模拟器里面也是一样的直接卡死(不知道有没有关联) <template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class=“text-area” @click=“uploadimg()”>
<text class="title">{{title}}</text>
</view>
</view>
</template>

<script> export default { data() { return { title: '测试图片裁剪' } }, onLoad() { }, methods: { uploadimg(){ var _this=this; uni.chooseImage({ count: 1, crop:{ width:300, height:300, quality:30, saveToAlbum:false }, success: (res) => { const tempFilePaths = res.tempFilePaths[0]; console.log(res); } }) }, } } </script>

如果没有相同手机复现,可以直接用模拟器试试,我用雷电模拟器 必现

确实有bug, 更新hbx后才出现的问题,之前版本正常

的确 直接卡死了 以前的版本可以 没有这个问题 更新了之后就出现了这个问题

我也遭遇了同样问题,手机为IQOO NEO 855版,手机系统为OriginOS 1.0,安卓版本为11,同样的从本地相册读取图片后黑屏无法正常显示,无法进行后续操作,但是应用没有重启


+1,希望快点解决

我们也有这个问题,希望尽快解决

bug已确认,将会在下版修复。

辛苦 !!

bug 已修复,请将HBuilder X升级到3.3.7及以上版本

手动点赞 !!!

我的版本 3.4.7。 iphone11,同样的问题,没有解决。

3.3.13版本,ios还是有的图片黑屏啊。什么操作这是。

3.6.5版本,ios16选择部分图片还是会黑屏或者白屏

根据你提供的信息,这个问题很可能是由Android 4.4系统兼容性引起的。uni.chooseImage在Android 4.4等低版本系统上使用crop参数时,可能会触发系统相册或裁剪组件的兼容性问题,导致应用进程异常重启。

从技术层面分析,当调用uni.chooseImage并设置crop参数时,系统会启动一个独立的裁剪Activity。在Android 4.4系统上,这个Activity的生命周期管理可能与uni-app框架存在冲突,导致应用被系统误判为异常状态而重启。App.vue中的onHide被调用,是因为裁剪Activity启动时,你的主应用Activity进入了后台(onHide),这是正常现象。

建议的解决方案:

  1. 降级处理:针对Android 4.4及以下版本,移除crop参数,改用纯前端裁剪方案。可以通过条件判断实现:
const systemInfo = uni.getSystemInfoSync();
const isLowAndroid = systemInfo.platform === 'android' && parseFloat(systemInfo.system) <= 4.4;

uni.chooseImage({
    count: 1,
    sourceType: ['album'],
    crop: isLowAndroid ? undefined : { width: 400, height: 400 },
    success: function(res) {
        if (isLowAndroid) {
            // 使用前端裁剪库处理图片,如使用uni.canvas或第三方裁剪组件
        } else {
            the.avatar = res.tempFilePaths[0];
        }
    }
});
回到顶部