微信小程序开发 | 从设计效果图到程序开发上线全过程学习

2-1

新项目的创建在创建一个新的项目之前呢，我们首先要有自己的AppID，它的获取方法呢我们在前面也有讲过，在这呢再给大家演示一下。我们打开浏览器，找到微信公众号平台，在公众平台中可以获取到AppID，然后就可以新建项目了

2-2

开发工具的介绍微信开发者工具，主要包括：菜单栏、工具栏、模拟器、资源管理器、代码区、调试区

2-3

项目的主要组成文件一个小程序主体，包含三个文件，分别是： app.js 小程序逻辑 app.json 小程序公共配置 app.wxss 小程序公共样式表 app.js这个文件是我们整个小程序的入口文件，里面只包含一个注册函数App()，而这个函数接受一个对象类型的参数。

3-1

wxss样式表介绍小程序中的wxss样式表文件，用于描述 WXML 页面及组件的样式，它决定了小程序的外观长什么样子，小程序中的样式表属性也是为了适应大多数的开发者，所以延续了大量的css样式，只要有一定css基础，很快就可以掌握小程序的样式表。样式表中常用的一些属性呢，大概有42个属性，分为五个大类。已经给大家做成了表格，这个文件会给大家提供，方便大家以后的学习和查阅，其实我们日常开发中使用频率比较高的部分大概能占到70%左右。

3-2

wxss样式表中常用属性介绍（一）wxss样式表中常用属性：文字类属性，font-size字体大小，color字体颜色，font-weight字体加粗，font-style字体风格，text-align字体对齐方式，text-decoration字体装饰线风格

3-3

wxss样式表中常用属性介绍（二）wxss样式表中常用属性：容器类属性，width宽度，min-width最小宽度，max-width最大宽度，height高度，min-height最小高度，max-height最大高度，padding内边距，margin外边距，margin-top上外边距，margin-right右外边距，margin-bottom下外边距，margin-left左外边距，border四周边框，display显示形式，overflow内容溢出，box-sizing盒子模型组成方式

3-4

wxss样式表中常用属性介绍（三）wxss样式表中常用属性：定位类属性，position组件定位方式，left距离参考对象的左端的距离，right距离参考对象的右端的距离，top距离参考对象的顶端的距离，bottom距离参考对象的底端的距离，z-index组件的堆叠顺序

4-1

变量、数组、对象、函数的定义和使用变量、数组、对象、函数的定义和使用， 变量：1, 变量的定义方法，2, 变量的赋值、修改值，3, 变量的访问； 数组：1, 数组的创建方法，2, 一维数组（二维数组）的赋值、修改值，3, 往数组中追加元素，删除元素，4, 数组的访问，5, 数组转为字符串toString()、join()； 对象：1, 对象的创建方法，2, 对象的赋值、修改值，3, 属性的添加、删除，4, 对象属性的访问，5, 对象和字符串的互转方法。

4-2

数据绑定：简单绑定数据绑定：简单绑定， 1, 绑定内容，2, 绑定组件属性，3, 绑定控制属性，控制属性值必须为布尔类型，4, 绑定关键字

4-3

数据绑定：运算数据绑定：运算，主要包括：1, 三元运算，2, 算数运算，3, 字符串运算，4, 数据路径运算，5, 逻辑判断

4-4

数据绑定：组合数据绑定：组合，包括：1, 给合对象，2, 给合数组