为人方正实诚
为人方正实诚
  • 发布:2025-03-26 21:27
  • 更新:2025-07-29 16:14
  • 阅读:532

【报Bug】在uniappx中的image组件设置border-radius圆角无效,需要嵌套在view里设置view圆角才有效,请问这是bug吗,那如果图片需要设置圆角时,都得在外面加个view?

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: WIN11

HBuilderX类型: 正式

HBuilderX版本号: 4.57

手机系统: Android

手机系统版本号: Android 15

手机厂商: 小米

手机机型: note13

页面类型: vue

vue版本: vue3

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

<image class="w75r h75r" style="border-radius: 75rpx;" src="https://5b0988e595225.cdn.sohucs.com/images/20181215/350fdfdb33b84e54a0e8463d07eb8e94.gif" mode="aspectFill"></image>

操作步骤:

如上述代码

预期结果:

有效

实际结果:

无效果

bug描述:

【报Bug】在uniappx中的image组件设置border-radius圆角无效,需要嵌套在view里设置view圆角才有效,请问这是bug吗,那如果图片需要设置圆角时,都得在外面加个view?

2025-03-26 21:27 负责人:DCloud_Android_THB 分享
已邀请:
DCloud_UNI_OttoJi

DCloud_UNI_OttoJi - 日常回复 uni-app/x 问题,如果艾特我没看到,请主动私信

更新:
感谢反馈,已知问题,在安卓+gif 上有此问题。https://issues.dcloud.net.cn/pages/issues/detail?id=336,为了兼容多种图片格式可以在外层加圆角。


我测试 uniapp x 运行到安卓模拟器 是正常的。你升级下 HBuilderX 到最新版再试试

<template>  
  <view>  
   <image  style="width:100px;height:100px;border-radius: 75rpx;" src="/static/logo.png" mode="aspectFill"></image>  
  </view>  
</template>  
  • 爱豆豆

    你把图片改为gif

    2025-03-27 16:38

  • 爱豆豆

    gif链接: https://env-00jxh127ub71.normal.cloudstatic.cn/350fdfdb33b84e54a0e8463d07eb8e94.gif

    2025-03-27 16:43

  • DCloud_UNI_OttoJi

    回复 爱豆豆: 是的

    2025-03-27 16:47

  • DCloud_UNI_OttoJi

    回复 爱豆豆: 这个是已知问题,我补充一下

    2025-03-27 16:57

  • 爱豆豆

    回复 DCloud_UNI_OttoJi: 好的

    2025-03-27 17:06

  • 有问

    我使用HBX最新版,编译的安卓APP,使用的NVUE,图片组件也不能设置圆角,在外层加VIEW,外层设置圆角,但图片依然不能显示为圆角,而且NVUE中也不能用overflow:hidden,现在图片就是不能圆角怎么办呢?

    2025-07-29 16:12

7***@qq.com

7***@qq.com

我本地试了一下是没有问题的,你再检查一下呢。

靐齉齾麤龖龗

靐齉齾麤龖龗 - 解决不了问题,那就解决提出问题的人

你这图片。。。好多茄子

n***@lan-bridge.com

n***@lan-bridge.com

nvue中还是不能生效base64图片

有问

有问 - 生活,趣与失。

我使用HBX最新版,编译的安卓APP,使用的NVUE,图片组件也不能设置圆角,在外层加VIEW,外层设置圆角,但图片依然不能显示为圆角,而且NVUE中也不能用overflow:hidden,现在图片就是不能圆角怎么办呢?

要回复问题请先登录注册