HarmonyOS使用ArkTS的Image标签展示图片的方法

最新推荐文章于 2024-07-25 20:17:04 发布
最新推荐文章于 2024-07-25 20:17:04 发布
阅读量296 收藏 7
点赞数 4
分类专栏： HarmonyOS 文章标签： harmonyos 华为
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43972992/article/details/139659371
版权

HarmonyOS使用ArkTS的Image标签展示图片的方法

官网地址

将图片放在src/main/resources/base/media目录下

  • 注意，放在该目录下，当前的文档api是不允许存在文件夹的，也就是说该方法存储的所有图片，都只能放到media文件夹中，不能使用media/images/*
  • 使用这种方式引入图片不需要添加图片的后缀。，而且还会有代码提示。
    在这里插入图片描述
    在这里插入图片描述
Image($r('app.media.bz_img'))

将图片放在src/main/ets/目录下

  • 注意，这种方式必须要添加完整的图片后缀，比较麻烦。而且不能跨端使用。编写过程中也没有提示。
    在这里插入图片描述
Image('/assets/images/bg_00.png')
小火车况且况且
关注
  • 4
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ArkUI（ETS）openHarmony 自定义图片查看组件
maniuT的博客
03-21 1216
日常开发中，经常会遇到一些图片查看的需求，此时有的用户习惯放大图片来看，那么在ets中如何实现呢？今日分享的组件由subsampling-scale-image-view+swiper来实现深度缩放视图、图像显示、手势平移缩放双击等。此组件主要实现深度缩放视图、图像显示、手势平移缩放双击等。subsampling-scale-image-view：深度缩放视图、图像显示、手势平移缩放双。swiper图片轮播。setOrientation设置旋转角度。基本概念构建第一个ArkTS应用……
ArkTS的 Image 组件用相对路径加载图片不显示图片
weixin_62288574的博客
03-28 1465
解决方法：在同一个文件夹种时，在使用相对路径时不要加 ‘../’ 和 直接填写文件名 ‘ 111.png’ 而是采用所在文件夹名+ 文件名。问题：在引用图片时，使用 Image Image组件加载但是，图片没有显示。很明显Image占了位置但是图片加载失败。
HarmonyOS系统开发ArkTS常用组件图片及参数（四）
qq_41946216的博客
03-18 742
我们在使用resources下的资源时，无需指定具体的环境版本，系统会根据设备所处的环境自动选择匹配的版本，例如当设备系统语言为中文时，则会使用zh_CN目录下的资源，为英文时，则会使用en_US目录下的资源。resources 目录下，可能存在base、（zh_CN和en_US）、系统主题（dark和light）、设备类型（phone 和 tablet）和 rawfile 等适配不同的环境的不同版本的目录。用于存储任意格式的原始文件，需要注意的是rawfile不会根据设备所处的环境去匹配不同的资源。
基础ArkTS组件：图片（HarmonyOS学习第三课【3.2】）
qq_58213084的博客
05-07 2282
srcFlex() {Flex() {: {alt：设置占位图，图片显示之前先显示占位图，比如在加载网络图片或者图片加载失败时的场景。objectFit：设置图片的放缩类型，当Image组件大小和图片大小不同时指定图片的放缩类型，ImageFitCover（默认值）：保持图片宽高比进行放缩显示，使得图片完全显示在显示边界外。Contain：保持图片宽高比进行放缩显示，使得图片完全显示在显示边界内。Fill：不保持图片宽高比显示，是图片完全充满显示边界。
鸿蒙HarmonyOS实战-ArkTS语言基础类库（XML）_鸿蒙arkts定义样式xml文件(1)
2401_84181975的博客
04-14 875
在XML中使用XML Schema定义结构的方式是使用一个独立的XML Schema文件，该文件定义了你希望XML文档符合的结构规范。首先，创建一个XML Schema文件，例如"example.xsd"。在该文件中定义你的元素、属性和数据类型。-- 在这里定义你的元素、属性和数据类型 -->接下来，在你的XML文档中引用该XML Schema文件，以使XML文档与定义的结构匹配。为此，在XML文档的根元素上添加一个xmlns:xsi属性和属性。xmlns:xsi属性指定XML命名空间xsi的定义，
HarmonyOS应用开发者认证题目满分指南
01-27
- ArkTS是HarmonyOS应用开发的语言，基于TypeScript，用于编写组件和业务逻辑。 - `@Component` 装饰器标识一个结构体具备组件化能力，可以用来创建自定义组件。 - `@Entry` 装饰器修饰的自定义组件可以作为页面...
HarmonyOS应用开发者基础题库
12-29
【HarmonyOS应用开发者基础题库】主要涵盖了鸿蒙系统应用开发的基础知识，涉及DevEco Studio集成开发环境、 ArkTS编程语言、应用程序框架以及页面布局设计等方面。 1. **DevEco Studio**：它是华为提供的开发...
鸿蒙HarmonyOS应用开发者认证 题库+答案案
01-18
本资源提供了鸿蒙HarmonyOS应用开发者认证的题库和答案，涵盖了HarmonyOS应用开发的多个方面，包括容器组件、 Ability、Web组件、网络请求、首选项、自定义组件、弹窗组件、图片加载、网络权限等。通过学习和理解...
HarmonyOS UI编程框架快速上手.pdf
05-29
- **编译器与运行时**：使用方舟编译器和Runtime，这是一套专门为HarmonyOS设计的高性能编译和执行环境。 - **工具链**：包括一系列开发工具，如IDE、调试器等，帮助开发者完成从开发到调试的整个流程。 #### 三、...
PHP 将dataurl转成图片image方法总结
01-20
PHP 将dataurl转成图片image方法 使用canvas 生成的图片，是使用dataurl的，php无法直接通过file_put_contents方法保存到本地电脑，需要做一下转码。  图片dataurl 如下 $imgstr = ‘[removed]iVBORw0...
鸿蒙arkts的图片资源引入方式和样式的复用方式
weixin_63448554的博客
12-23 2726
组件内的样式不需要使用function 关键字声明，而组件外的样式需要function声明，需要在加上@style修饰符。关于arkts语言的图片资源引入方式目前有下面三种，大家随意选用就好，都可以实现效果。大家好我是海岛，分享一下在传智博学谷学习的一些知识技术。
黑马健康——鸿蒙ArkTs实战案例(2)
2301_78050022的博客
06-25 50
OK咱们进入正题，上一篇咱们确定了当前要制作的页面和其对应的功能，那么咱们现在就开始咱们的第一步：制作咱们的欢迎页面。
鸿蒙ArkTS声明式组件：【Image】
2401_82772199的博客
06-23 1312
Image为图片组件，常用于在应用中显示图片。Image支持加载\[PixelMap]、\[ResourceStr]和\[DrawableDescriptor]类型的数据源，支持png、jpg、bmp、svg和gif类型的图片格式。
鸿蒙界面开发
qq_46025779的博客
07-23 2432
界面开发界面开发-布局思路属性方法字体颜色文字溢出省略号、行高Image图片组件输入框与按钮综合实训设计资源-svg图标欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入MarkdownText-to-HTML。
鸿蒙HarmonyOS开发：多种内置弹窗及自定义弹窗的详细使用指南
在这里，我分享我的技术心得、项目经验、实用的技术教程、深入的技术分析以及前端开发的最新动态，希望能帮助到更多的人。
07-25 1027
弹窗是移动应用中常见的一种用户界面元素，常用于显示一些重要的信息、提示用户进行操作或收集用户输入。ArkTS提供了多种内置的弹窗供开发者使用，除此之外还支持自定义弹窗，来满足各种不同的需求。不同弹窗的详细使用介绍，消息提示框（showToast）、对话框（showDialog）、警告弹窗（AlertDialog）、操作菜单（showActionMenu）、操作列表弹窗（ActionSheet）、文本滑动选择器弹窗 (TextPickerDialog)、自定义弹窗 (CustomDialog)。
鸿蒙9+在TV端焦点封装控制
熊佳龙的博客
07-24 564
鸿蒙自定义Component焦点封装控制
【HarmonyOS】应用推送使用个推SDK如何实现？
最新发布
我的小窝
07-25 969
鸿蒙应用如何使用个推SDK实现推送功能？
如何使用image标签的图片作为背景
06-06
要将 `<img>` 标签中的图片作为背景，可以使用 CSS 的 `background-image` 属性。具体步骤如下： 1. 给包含 `<img>` 标签的元素添加一个 `class` 属性，方便在 CSS 中选择该元素。 例如，将包含 `<img>` 标签的 `...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值