HarmonyOS【ArkUI组件---Image组件】

1.实现效果

2.Image:图片显示组件

3.通过网络图片

javascript 复制代码
@Entry
@Component
struct Index {
  @State message: string = 'Hello World'

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
          .fontColor('#36D')
          .onClick(()=>{
            this.message='Hello ArkTS!'
          })
        Image('https://res.vmallres.com/uomcdn/CN/cms/202406/2db7e1ea3fbf40fbac8adce59b04f44d.png')
          .width(250)
      }

      .width('100%')
    }
    .height('100%')
  }
}

4.网络访问权限

当我们没有配置权限的时候,只能在预览器中看见网络图片,在模拟器上不可以

打开module.json5文件

javascript 复制代码
 "requestPermissions": [
      {
        "name":"ohos.permission.INTERNET"
      }
    ],

添加之后,效果如下图所示 :

5.本地图片

javascript 复制代码
 Image($r('app.media.app_icon'))
          .width(250)
          .interpolation(ImageInterpolation.High)
相关推荐
SWUT胖虎2 小时前
AlphabetIndexer组件 与 List 联动总结
list·harmonyos·arkts·鸿蒙
鸿蒙小白龙4 小时前
OpenHarmony轻量级内核LiteOS-M技术详解与应用实践
harmonyos·鸿蒙·鸿蒙系统·open harmony
Damon小智5 小时前
HarmonyOS应用开发-低代码开发登录页面(超详细)
低代码·harmonyos·鸿蒙·登录·arcts·arcui·griditem
爱笑的眼睛117 小时前
深入探讨HarmonyOS中ListItem的滑动操作:从基础实现到高级分布式交互
华为·harmonyos
摘星编程8 小时前
【参赛心得】HarmonyOS创新赛获奖秘籍:如何用Stage模型和声明式UI打造高分作品
ui·华为·harmonyos·鸿蒙开发·stage模型
2501_919749039 小时前
flutter鸿蒙:实现类似B站或抖音的弹幕功能
flutter·华为·harmonyos
鸿蒙小白龙9 小时前
OpenHarmony后台服务开发指南:ServiceAbility与ServiceExtensionAbility全解析
harmonyos·鸿蒙系统·open harmony
浅蓝色13 小时前
flutter平台判断,这次应该没问题了。支持鸿蒙,插件已发布
flutter·harmonyos
小雨青年21 小时前
鸿蒙 HarmonyOS 6|ArkUI(03):状态管理
华为·harmonyos·1024程序员节
猫林老师1 天前
HarmonyOS分布式数据库深度应用
harmonyos