了解一些ArkUI概念并熟悉应用的结构 原创 精华
$\begin{array}{|rrr|}\hline
\
& \color{#FF724C}{【本文正在参与优质创作者激励】} & \
\
\hline
\end{array}$
$\color{#1F6CC0}{方舟开发框架(ArkUI框架)}$
$\color{#2A2C41}{针对不同目的和技术背景的开发者提供了两种开发范式:}$
$\color{#2A2C41}{①基于JS扩展的类Web开发范式(简称“类Web开发范式”)}$
$\color{#2A2C41}{②基于TS扩展的声明式开发范式(简称“声明式开发范式”)。}$
$\color{#1F6CC0}{声明式开发范式}$
是为HarmonyOS平台开发极简、高性能、跨设备应用设计的UI开发框架,支持开发者高效快速构建跨设备应用UI界面。声明式开发告诉编辑器做什么,不关注其怎么做,即按照设定的规则进行组装就能达到实用的效果。
声明式开发范式可以写出更简洁、更具有表现力的代码,代码量越少,出现错误的几率越小。
Text('Hello World').fontSize(50)
$\color{#1F6CC0}{创建项目}$
$\color{#1F6CC0}{应用目录结构}$
$\color{#2A2C41}{开始我们只需要关注ets
、config.json
、resources
}$
ets
:存放ets
代码的文件夹;config.json
:配置文件,一般情况下不用修改,创建页面时一般会自动把页面路由引入;resources
:存放资源文件。
$\color{#1F6CC0}{
ets
目录详解}$
app.ets
文件用于全局应用逻辑和应用生命周期管理,提供onCreate
和onDestroy
方法,用于创建和销毁。pages
目录用于存放所有组件页面,即根据实际需求产出的UI界面。common
目录用于存放公共代码文件,可选。
$\color{#1F6CC0}{资源引用}$
- 引用应用资源:通过
$r('app.type.name')
的形式引用resources
目录中base
目录下的资源,其中app
代表resources
目录中定义的资源,type
代表资源类型或存放位置,如base->element
目录下的string
,name
为资源名称。
$\color{#2A2C41}{注:引入rawfile
下资源时使用\$rawfile('filename')
的形式,暂仅支持Image
控件引入图片资源。}$
- 引入系统资源:可以通过
$r('sys.type.resource_id')
的形式引入系统资源,可以开发出具有相同视觉风格的应用,其中sys
代表系统资源,type
代表资源类型(可取color|float|string|media
),resource_id
代表资源id
,参见系统资源附录。
$\color{#1F6CC0}{总结}$
在开始“荟萃”之前,对ArkUI有一些简单的了解,接下来我将通过实例应用带大家一起领略声明式开发范式的开箱即用的组件、丰富的动效接口、状态与数据管理、系统能力接口。