一个 android 程序员的小程序入门实录（一）
2019-02-10 本文已影响0人
oven小区
小程序学习资料收集，开发者工具的下载及初览，代码结构与基本配置方法，及第一个 hello world
概况
微信小程序是腾讯推出的一种依托于微信，不用下载，通过扫码、公众号跳转，群聊点击就能使用的应用。由于项目需要，及出于对移动端另一种应用开发的好奇，带着老大的殷切希望，我也投入了小程序的学习。
微信小程序在一些不需要多次使用，不希望耗时下载的场景具有优势，同时对于开发者来说，全中文的文档和开发者社区也非常友好
小程序注册与开发工具安装
- 注册，参照官方教程申请小程序账号。官方指引非常清楚，按照步骤一步步做即可。
官方注册指引
2.进入官方文档页面，点击工具，下载开发者工具。 下载地址
开发者工具下载
3.下载完成后，安装登录即可
开发工具初览
微信小程序开发者工具的界面和大部分 IDE 一样，包含编辑器，调试器，上方有工具栏，左侧还有一个模拟器。
开发者工具界面
代码结构
代码结构
根目录下
- project.config.json 负责保存开发者个人对于编辑器的使用偏好
- app.js 适用于全局的逻辑交互
- app.json 适用于全局的设置，所有pages必须在此注册，tabBar，navigationStyle 在此设置，还可以设置适用于所有界面的窗体设置，如窗体颜色，背景色，navigationBar色等
- app.wxss 适用于全局的样式
pages下有
每一个界面各有一个文件夹，里面有四个文件
- *.js 文件存放页面中所需要的交互逻辑
- *.wxml 页面控件结构，和android中的 xml 功能上有些类似（都是编写控件的相对位置，大小，颜色等），但 wxml 的语法更类似于 HTML
- *. wxss 页面样式，具有css 大部分的特性
- *.json 仅适用于该界面的窗体设置，与app.json冲突，以页面设置为准
基本配置方法
在需要的时候可以更改配置，以获得想要的效果
-
全局配置：在 app.json 可以进行全局配置，查询文档可得配置项列表。
其中，除了必须的 pages 外，比较常用的有 window (窗口样式)， tabBar （底部tab栏）， networkTimeout (网络超时时间)
注意：首页必须放在 pages 项第一个
app.json部分配置项列表
-
页面配置：在各页面的 *.json 文件中可以设置部分 window 内容，包括 navigationBar 背景和字体颜色等
页面部分配置项列表（不全）
请查收您的 Hello World
创建一个新的小程序，选择快速开始模板，无需更改配置项，直接编译代码，就能得到第一个微信小程序的 Hello World 啦！一行代码没写就白得一个 hello world，这种感觉和当初初学 android 第一次编译时的感觉很相似呢。总之，搭建开发环境、编写第一个 hello world 的过程都比较简单而流畅。
