微猪演示猪场（1）--小程序仿写

微信开发者工具

首先，想要开发一个微信小程序需要安装微信开发者工具，在微信公众平台下载即可。

其次是如何使用微信开发者工具。首先打开，使用微信扫一扫登陆，然后选择小程序，输入项目名，如果没有想好名字就用默认的，选择保存路径。

接下来了解一下微信项目工程结构：
pages:存储微信的页面。
utils:  公共方法(封装js代码). app. js:主程序入口。
app. json:主程序配置文件(小程序的所有页面路径、界面外观)。

app. WXSS :  主体样式(容器样式)。
project. config. json: 项目工程的配置文件(版本号, appid... )。
 

现在，正式开始小程序的开发。

我这次要模仿的界面是这个样子的：

右键点击pages，新建page文件，它就会出现这几个文件

注意，微信小程序的界面和普通的网页有所不同，这里使用view标签，如图，类似这样：

（不管写什么都要保持写注释的好习惯嘻嘻）

首先，在main.wxml里面写主界面的大容器。之后所有的容器都包括在之内。

 我将这个界面分为了四部分，分别命名为middle,stst,button,last。

然后仿照原界面写样式，样式部分的语法与普通网页差不多，这里就不做说明啦啦啦啦。

需要注意的有微信有自己的单位rpx，不过我并没有使用；还有一点需要说明的是要考虑微信小程序在不同设备上的呈现效果，大家懂的。

最后，这是成果图，第一个界面就完成啦！