快应用quickapp快速入门教程 by五个半柠檬2
2019独角兽企业重金招聘Python工程师标准>>>
一、更改文档目录
因为第一次写还不熟悉,我先不动官方自动生成的目录,修改后如下图:
新建了一个views文件夹,以后项目的文件我就放里面了
新建目录后当然是更改路由配置了,不然怎么访问呢。
1>首先打开manifest.json文件,配置应用基本信息
每个应用都要有专属的名称,图标等,这些信息都需要在manifest.json文件中配置.
2>修改应用名称(name)
应用名称,6个汉字以内,与应用商店保存的名称一致;框架提供保存到桌面的功能,桌面上显示的应用名即为此属性
示例如下:
{
"name": "便签薄"
}
3>应用图标(icon)
规则为正方形(不能是圆角),且务必无白边
{
"icon": "/Common/logo.png"
}
注意:
请使用绝对路径,其中/对应于路径<ProjectName>/src/
4>应用版本名称、版本号(versionName、versionCode)
应用版本名称、版本号为开发者的应用包维护的版本信息
应用版本名称为主版本.次版本格式
应用版本号为整数,从1开始,每次更新上架请自增1
示例如下:
{
"versionName": "1.0",
"versionCode": 1
}
5>配置接口列表(features)
在使用接口时,需要先在manifest中声明接口。在每个接口文档的顶部,都附有声明接口的配置代码
以prompt网络请求为例,示例如下:
{
"features": [
{ "name": "system.prompt" }
]
}
6>配置页面路由(router)
路由,用于定义页面的实际地址、跳转地址。如果ux页面没有配置路由,则不参与项目编译。一个目录下最多只能存在一个主页面文件(不包括组件文件)
首页名称(router.entry)
首页,即应用平台启动时默认打开的页面。首页需配置为应用中某页面的名称,即在<ProjectName>/src目录下,页面目录的相对路径
示例如下:
假设工程根目录如下所示
└── src
└── Views └── index └── index.ux // 页面文件,文件名不必与父文件夹相同(推荐index.ux)
假设首页为Views/index目录下的index.ux文件,则首页对应的页面名称为Views/index
{
"router": {
"entry": "Views/index"
}
}
7>页面路由对象(router.pages)
页面路由对象,key为页面名称(<ProjectName>/src目录下,页面目录的相对路径),value为页面具体路由配置,key不要重复
页面具体路由配置(router.pages的value)包括以下属性:
component:页面对应的ux文件名
path:页面路径,不填则默认为页面名称(<ProjectName>/src目录下,页面目录的相对路径)
示例如下:
假设工程根目录如下所示
└── src
└── Views└── index└── index.ux
当页面名称(router.pages的key)为Views/index时,对应的页面配置(router.pages的value)包括:
component:页面对应的ux文件名index
path:页面路径,默认为页面名称Views/index
{
"router": {
"pages": {"Views/index": {"component": "index"}
}
}
}
配置页面UI显示(display)
UI显示,用于定义与UI显示相关的配置。支持定义:页面公用的默认UI显示、页面私有的UI显示
页面公用的默认UI显示
页面公用的默认UI显示,即被所有页面共享
以标题栏文字的配置为例:
{
"display": {
"titleBarText": "页面公用的默认标题"
}
}
未配置私有标题的页面,标题栏文字均将显示为页面公用的默认标题
8>页面私有的UI显示,在display.pages对象下配置:key为页面名称(与路由中的页面名称保持一致),value为页面私有的UI显示
以标题栏文字的配置为例:
{
"display": {
"pages": {"Demo": {"titleBarText": "Demo页面的标题"}
}
}
}
9>需要对页面设计基准宽度,我设置是750;
"config": {
"logLevel": "off",
"designWidth": "750"
}
我这边修改后的页面代码如下:
3.npm run build后生效。
二、制作首页
样式设计
因为header右边还需要一个编辑按钮,所以需要将首页默认的title隐藏。修改后如图
在首页自己写个title。
填坑1:移除flex
看开发文档通用样式会发现display只要两种值:
display:flex | none
平常上下布局的话可以display:block;可是在这里并不支持;后来通过查询文档找到了解决方法,在根节点加上:
flex-direction:row-reverse; //设置 <div> 元素内弹性盒元素的方向为相反的顺序
好吧,还有这种操作~
填坑2:
文字必须用<text></text>有文本属性的标签包裹,直接在div里面写(容器组件)是读不出来的!如图:
填坑3:不支持before after这类的伪类样式,其它自行研究~
填坑4:如果要使用less,sass/scss,请先按安装对应的类库:
npm install XXXXXX
其它将后续更新~
转载于:https://my.oschina.net/lemonfive/blog/1814158
快应用quickapp快速入门教程 by五个半柠檬2相关推荐
- 快应用quickapp快速入门教程 by五个半柠檬
快应用 快应用是九大手机厂商基于硬件平台共同推出的新型应用生态.用户无需下载安装,即点即用,享受原生应用的性能体验. 2018年3月20日在北京推出"快应用"标准. 现在我们就来试 ...
- 新手必备pr 2021快速入门教程「五」素材预览与基本剪辑
PR2021快速入门教程,学完之后,制作抖音视频,vlog,电影混剪,日常记录等不在话下!零基础,欢迎入坑! 本节内容 我们在使用premiere软件进行视频素材剪辑的时候,如果不知道视频素材包含了什 ...
- MiniUI快速入门教程(五)主框架布局
下面实现一个最典型主框架布局. 效果图如下: 一:创建界面布局 <!--Layout--> <div id="layout1" class="mini- ...
- sklearn快速入门教程:(五)集成学习
sklearn快速入门教程–(五)集成学习 一.集成学习简述 集成学习是目前各类竞赛和工程中应用最广泛的模型提升方法.比如在kaggle中就有关于集成学习的介绍(Kaggle模型融合原文).这里所谓的 ...
- sklearn快速入门教程:(二)线性回归
文章目录 一.从本文起学会快速阅读和学习 二.线性回归的原理回顾及官方文档 三.官方文档的分析 四.举一反三 五.小结 一.从本文起学会快速阅读和学习 本来是想把关于快速阅读的说明写在前一节,但最后还 ...
- redis快速入门教程
原文链接:redis快速入门教程 redis是什么 redis的作者何许人也 谁在使用redis 学会安装redis 学会启动redis 使用redis客户端 redis数据结构 – 简介 redis ...
- Python3数据分析——NumPy快速入门教程(官网教程翻译)
目录 一.基础篇 1.创建数组 2.打印数组 3.基本运算 4.通用函数(ufunc) 5.索引,切片和迭代 二.形状操作 1.更改数组的形状 2.组合(stack)不同的数组 3.将一个数组分割(s ...
- 宏宇社:国外lead入门教程(五)如何开始操作lead任务
宏宇社:国外lead入门教程(五)如何开始操作lead任务 前面给大家介绍了操作国外lead项目的准备工作. 那么现在可以着手准备操作所选任务了. 这里我们分两种类型来讲解 一.需要刷流量的任务 这是 ...
- python3入门-终于懂得python3快速入门教程
跟Java语言一样,python语言也有类的概念,直接使用class关键字定义python类.在python类,定义类的方法.然后直接使用类的初始化调用自身,获取相应的属性.以下是小编为你整理的pyt ...
最新文章
- Bugku-CTF之flag在index里
- R语言as.Date函数将字符串转化为日期格式实战
- python英语-我们用程序整理出了一份Python英语高频词汇表,拿走不谢!
- Jfinal 对象列表返回前台json数据
- SAP Spartacus scss里的--cx-color-primary
- 三星Galaxy S20:如何开启黑暗模式
- vba 数组赋值_VBA数组与字典解决方案第31讲:VBA数组声明及赋值后的回填方法
- Linux搭建虚拟专用,Ubuntu的发行版如何搭建虚拟专用网
- Qt DLL总结【二】-创建及调用QT的 DLL
- 软件随想--写牛B的代码
- Android 模拟机键盘不可用的问题 !!
- 分辨率测试靶-标定显微镜、相机等光学系统的分辨率
- python随机生成字符串_python 怎样随机生成中文字符?
- 02组团队项目-Alpha冲刺-4/6
- QCY T3 蓝牙耳机连接电脑 声音断续卡顿
- 标签类目体系(面向业务的数据资产设计方法论)-读书笔记4
- PS网页设计教程XXI——在Photoshop中创建一个光质感网页设计
- [data engineering] (一)数据工程师的工作内容以及需要的软硬实力
- NS3 Tutorial 中文版:第三章 快速上手
- linux 文本方式怎么安装,Linux文本方式安装系统
热门文章
- 请选择JAVA中有效的标识_Java中有效的标识符是什么?
- linux防火墙常用控制协议,linux防火墙配置及管理.doc
- 所有配置_一张图看懂iPhone12的所有配置!
- soapui工具_基于开源的API测试工具!不再为web服务负载测试而发愁
- 软件测试nextdata程序,Nextdata测试用例及源程序.doc
- c 正则去除a以外的html,正则表达式:去除除SRC以外的HTML属性
- Java bitset转string_Java 二进制和十进制互转,二进制和BitSet互转
- Verilog设计实例(4)详解全类别加法器(一)
- 小程序页面跳转传参参数值为url时参数时 会出现丢失
- 在laravel视图中直接使用{{ csrf_token() }}被翻译成英文显示的处理方法