鸿蒙_使用DevEco Studio预览器

我们的第一个鸿蒙应用项目创建好后,开发工具默认生成了一个Index.ets页面,其结构如下,其中Index为页面名称,其他都是固定用法,而且需要注意的是build内只能包含一个根组件,我们一般放布局组件如横向Row、竖向Column,还有自动生成的相对布局RelativeContainer等,在内部再放其他UI组件。

复制代码
@Entry //页面入口
@Component //组件
struct Index {
  build() {
    //页面内容
  }
}

那么我们对页面内代码进行的修改应该如何看到效果呢,DevEco Studio自带了一个预览器功能,在右侧找到小眼睛的图标,点一下即可打开预览器,正常页面(由@Entry修饰)或添加了@Preview修饰的组件,大部分可以支持预览。

下图就是预览器的工具栏,我们把鼠标放上去后可以看到相应的功能名称,大家可以随便点点看看会发生什么变化,慢慢熟悉预览器的操作即可。

需要注意的是,如果代码内有错误,需要修复错误后才可以正常预览,修复错误后如果预览器没有变化,可以点击重新加载,或点击两次小眼睛图标(关闭、重新打开)重新触发预览即可。

相关推荐
WHMONY26 分钟前
大一独立开发鸿蒙原生 AI Agent:聊聊我为什么死磕端侧模型与“技术平权”
harmonyos
todoitbo2 小时前
把 K-Lite「什么都能播」搬上鸿蒙 PC:影匣播放器的 FFmpeg + libass 原生移植实录
华为·ffmpeg·harmonyos·鸿蒙
威哥爱编程3 小时前
模拟面试智能体开发实战 05:给面试官接上题库和检索,题目结构化、大纲可溯源,AI 不再凭印象出题
python·agent·harmonyos
威哥爱编程3 小时前
模拟面试智能体开发实战 06:答得好怎么追问、答得错怎么点破,追问引擎让面试官会深挖会纠错
python·agent·harmonyos
c2892480843s4 小时前
【鸿蒙心迹】深色模式适配实战:资源限定词、动态取色与一张图两个主题
移动开发·harmonyos·鸿蒙·arkui·深色模式
贾伟康5 小时前
HarmonyOS API 26 Navigation 连续栈操作:中间过程合并、最终状态与强制新实例
harmonyos·arkts·navigation·navpathstack·路由治理
贾伟康20 小时前
HarmonyOS API 26 Navigation 跨包路由:router_map、HSP 按需加载与失败回落
harmonyos·arkts·模块化·navigation·hsp
KevinChaos20 小时前
阳台小花园开发手记 04|HarmonyOS 7.0 互动卡片:倾斜手机时的卡片效果
华为·harmonyos
威哥爱编程1 天前
模拟面试智能体开发实战 04:面试聊到哪算哪?用状态机把整场面试编排起来
python·agent·harmonyos
威哥爱编程1 天前
模拟面试智能体开发实战 03:AI 面试官太客气?人设 Prompt 让它像个真考官
python·agent·harmonyos