1.安装配置
2.应用开发简介
3.文件使用规则
应用资源可通过绝对路径或相对路径的方式进行访问,对开发框架中绝对路径以"/“开头,相对路径以“./”或”…/",具体访问规则如下:
引用代码文件,需使用相对路径,比如:…/common/utils.js
引用资源文件,推荐使用绝对路径。比如:/common/xxx.png
公共代码文件和资源文件推荐放在common下,通过以上两条规则进行访问
css样式文件中通过 url()函数 创建数据类型,如:url(/common/xxx.png)。
如果代码文件A和文件B位于同一目录,则代码文件B引用资源文件时可使用相对路径,也可使用绝对路径。
如果代码文件A和代码文件B位于不同目录,则代码文件B引用资源文件时必须使用绝对路径。因为Webpack打包时,代码文件B的目录会发生变化
4.笔记(p6-p7Todolist页面样式布局及多终端运行)
弹性布局:自动居中样式
在Phone P40设备上,1px = 3物理像素(记得*3即可)
在TV设备上1px = 2物理像素,在穿戴设备上1px = 2物理像素
5.todolist应用构建
页面结构设计注意事项:
页面结构使用 HTML 相同的标签进行嵌套,最外层是 div 容器。文本内容放在<text>标签中才能呈现,否则不会呈现文本内容。可以直接调用 鸿蒙 JS 封装好的 组件,这里我们使用的是 switch 组件。
页面样式设计注意事项:
页面 CSS 支持 id、class、tag 选择器,建议使用 class 选择器。页面样式系统基于 flex 弹性布局进行设置,默认就是 flex 弹性布局,需要注意,弹性布局会自动的拉升和压缩内部元素模块宽度、高度。鸿蒙封装的 JS 组件,有一个专门的样式说明,这个和我们传统的 CSS 写法有很大的差异,这个尤其需要注意。