微信小程序开发与运营
2024-05-15 17:33:31 1 举报
AI智能生成
软件课程之微信小程序
作者其他创作
大纲/内容
一、微信小程序概述
1.1 小程序简介
微信(WeChat)小程序是腾讯公司于2011年1月21日退出的一款智能终端提供即时通信(Instant Messaging,IM)服务的应用程序,小程序是一种不需要下载安装级可使用的应用
1.2小程序的特征
(1)无需安装
(2)触手可及
(3)用完即走
(4)无需加载
1.3 小程序应用场景的特点
(1)简单的业务逻辑
(2)低频度的使用场景
1.4 微信小程序开发流程
第一步:在微信公众号平台上注册小程序账号
第二步:下载开发者工具进行编码
第三步:通过开发者工具提交代码,通过审核后便可发布
1.5 下载微信小程序开发中工具APP
微信开发者功能介绍
微信小程序界面划分于5大区域:。
工具栏、
模拟区、
目录文件区、
编辑区和调试区
(1)工具栏
(2)模拟区
(3)目录文件区
(4)编辑区
二、微信小程序开发基础
2.1 小程序的基本目录结构
2.1.1主页文件
(1)app.js:小程序逻辑页面,主要用来注册小程序全局实例。
(2)app.json:小程序公共配置文件,配置小程序全局设置。
(3)app.wxss:小程序主样式表文件,类似的HTML的.CSS文件。
2.1.2页面文件
(1).js文件:页面逻辑文件,在该文件中编写JavaScript代码控制页面的逻辑
(2).wxml:页面结构文件,用于设计页面的布局、数据绑定等
(3).wxss:页面样式表文件,用于定义本页面中用到的各类样式表。
(4).json:页面配置文件,该文件在页面中不可缺少。
2.2 小程序开发框架
2.2.1视图层
MINA框架的视图层由WXML与WXSS 编写,由组件来进行展示,
.wxml文件用于描述页面的结构;。
.wxss文件用于描述页面的样式
2.2.2 逻辑层
逻辑层用于处理事务逻辑。
2.2.3数据层
数据层在逻辑上包括页面临时数据或缓存文件存储(本地存储)和网络存储与调用。
三、页面布局
3.1 盒子模型
3.2 块元素与行内元素
3.2.1 块级元素
3.2.2 行内元素
3.2.3 行内块元素
3.3 浮动与定位
3.3.1 元素浮动与清除
none——默认值,表示元素不浮动;
left——元素向左浮动
right——元素向右浮动
3.3.2 元素定位
static———默认值, 该元素按照标准流进行布局;
relative———相对定位, 相对于它在原文档流的位置进行定位, 它后面的盒子仍以标准流方式对待它;
absoulute———绝对定位, 相对于其上一个已经定位的父元素进行定位, 绝对定位的盒子从标准流中脱离, 它对其后的兄弟盒子的定位没有影响;
fixed———固定定位, 相对于浏览器窗口进行定位。
3.4 flex布局
(1)display
(2)flex-direction
(3)flex-wrap
(4) flex-flow
(5)justify-content
(6)align-items
align-content 用来定义项目有多根轴线(出现换行后) 在交叉轴上的对齐方式, 如果只有一根轴线, 该属性不起作用。
四、页面组件
4.1 组件的定义及属性
4.2 容器视图组件
4.2.1 view
4.2.2 scroll-view
4.2.3 swiper
4.3 基础内容组件
4.3.1 icon
子主题
4.3.2 text
4.3.3 progress
4.4 表单组件
4.4.1 button
默认认点击(default)、建议点击(primary)、谨慎点击(warn)
4.4.2 radio
概念:单选框用来从一组选项中选取一个选项
4.4.3 checkbox
概念:复选框用于从一组选项中选取多个选项,小程序中复选框由 <checkbox -group/ >(多项选择器)和<checkbox/ >(多选项目)两个组件组合而成
4.4.4 switch
switch组件的作用类似开关选择器
4.4.5 slider
概念:slider组件为滑动选择器,可以通过滑动来设置相应的值
4.4.6 picker
概念:picker组件为滚动选择器,当用户点击picker组件时,系统从底部弹出选择器供用户选择。
picker组件目前支持5种选择器,分别是:
selector(普通选择器)
、
multiSelector(多列选择器)
、time(时间选择器)
、date(日期选择器
)、region(省市选择器)
4.4.7 picker-view
4.4.8 input
textarea
4.4.10 laber
4.4.11 form
4.5 多媒体组件
4.5.1 image
子主题
4.5.2audio
子主题
4.5.3 video
子主题
4.5.4 camera
子主题
4.6 其他组件
五、急速应用
六、API应用
七、案例秦邻山水
八、小程序后端开发
九、小程序运营
收藏
0 条评论
下一页