微信小程序开发入门精要 - (EPUB全文下载)

文件大小:0.22 mb。
文件格式:epub 格式。
书籍内容:

微信小程序开发入门精要
第1章 微信小程序入门
第2章 布局
第3章 视图容器
第4章 视图层技术
第5章 基础组件
第6章 表单组件
第7章 多媒体组件
第8章 其他组件
第9章 网络
第10章 多媒体
第11章 数据存取
第12章 位置
第13章 设备
第14章 界面
第15章 开放接口
第16章 徽章(Badge)
第17章 基础组件
第18章 高仿计算器
第19章 快递查询
第20章 电影订票
第21章 图表
欢迎来到异步社区!
第1章 微信小程序入门
微信小程序是腾讯在2016年9月推出的一种新型的微信扩展。尽管目前还没有正式开发,但依然受到了非常多的关注。这主要是由于腾讯的影响力,以及微信在国内拥有的庞大的用户群体。在2017年1月9日,腾讯已经正式上线了小程序,这意味着任何人都可以在手机微信中使用小程序。由于目前小程序的数量还不多,所以现在进入小程序开发领域,可能会赶上小程序的第一拨红利。OK,废话少说,从本章开始,让我们深入了解微信小程序的原理以及详细的开发过程。
本章要点
什么是微信小程序
注册小程序账号
获取小程序的AppID
设置小程序信息
配置微信小程序的开发环境
微信小程序的结构
开发第一个微信小程序:猜拳游戏
1.1 什么是微信小程序
微信小程序刚一公布,朋友圈就被微信小程序刷爆了!“微信之父”张小龙说:“小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。这也体现了‘用完即走’的理念,用户不关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载”。
我也看了网上的一些关于微信小程序的文章,但内容质量良莠不齐。好吧,我就通过本节让大家了解一下什么是微信小程序,以及微信小程序到底能为我们带来什么。
由于之前有微信公众号,而公众号里面的程序其实就是将移动Web(主要是HTML5、CSS、JavaScript等技术)嵌入到微信中,当然,会调用一些微信提供的API。所以很多人自然而然会想到微信小程序用的也是HTML5。但事实是,微信小程序和HTML5,甚至和Web,没有任何关系。因为Web的性能低下,尤其对于那些追求完美的人,在手机上使用Web简直不能忍受。千万别说,等以后手机性能发展到和现在的PC一样就好了,估计等到那时候,会出现比手机更小巧,当然,性能也更差的设备。如果手机成为了PC,那么这些新出现的设备将会取代现在手机的位置。就像人们永远等待新产品降价再买,但等到这些产品真降价了,又会有更好的产品问世,很难等到既享受新产品,同时又享受低价的时候。
既然说微信小程序和Web一点关系都没有,那么有什么证据呢?这一点从微信小程序官方文档的描述中就可以看出。感兴趣的读者可以通过下面的地址查看微信小程序官方文档。
https://mp.weixin.qq.com/debug/wxadoc/dev/
微信小程序主要由3个全局的文件和一些与页面有关的文件组成,全局文件包括app.js、app.json和app.wxss。其中,app.js是JavaScript文件,用于编写全局的事件,例如微信小程序启动时要执行的代码,类似于iOS工程中AppDelegate.m文件的作用;app.json用于配置微信小程序,例如由哪些页面组成,类似于Android工程中AndroidManifest.xml文件的作用;app.wxss是公共样式表,用于设置整个工程都可以使用的样式,类似于Android中的theme或style资源,全局都可以使用。
可能有人会问,微信小程序不是使用了JavaScript吗?难道和Web没有关系?这里需要明确,JavaScript只是一种语言,未必用在Web上,JavaScript同样可以用在服务端,如Node.js,当然也可以用在移动端,作为独立的语言运行。
微信小程序的页面部分由4个文件组成,这里的页面实际上就是窗口。假设页面名字为index,那么该页面由index.js、index.wxml、index.wxss和index.json组成。index.js用于编写页面的逻辑代码;index.wxml是腾讯自己设计的一种标记语言,可以称为微信标记语言,用于描述UI;index.wxss是针对该页面的样式表,是私有的;index.json是针对页面的配置文件。
这里关键点是index.wxss,用过React Native的读者应该很熟悉JSX,它是一种描述UI的类XML语言。其基本原理是通过XML文件描述UI,并动态创建原生的UI。例如,React Native用View来描述顶层视图,用Text来描述文本输出控件,那么我们可以使用下面的代码来模拟这一动态创建过程。
Android:
View component = null;
if(tag == "View")
{
component = new ViewGroup(…);
}
else if(tag == "Text")
{
component = new TextView(…);
}
iOS:
UIView *component;
if(tag == "View")
{
component = [UIView new];
}
else if(tag == "Text")
{
component = [UILabel new];
}
上面描述的是基本的动态创建组件的过程,当然,实际的实现过程要比这个复杂得多,这里只做了原理上的描述。很显然,系统会根据不同平台,以及在JSX中的描述,生成不同的原生组件。
React Native使用的是JSX,类似地,微信小程序使用的是wxml(微信标记语言),它是一种腾讯自己设计的类JSX的语言,下面是wxml的代码示例。

以上为书籍内容预览,如需阅读全文内容请下载EPUB源文件,祝您阅读愉快。

版权声明:书云(openelib.org)是世界上最大的在线非盈利图书馆之一,致力于让每个人都能便捷地了解我们的文明。我们尊重著作者的知识产权,如您认为书云侵犯了您的合法权益,请参考版权保护声明,通过邮件openelib@outlook.com联系我们,我们将及时处理您的合理请求。 数研咨询 流芳阁 研报之家 AI应用导航 研报之家
书云 Open E-Library » 微信小程序开发入门精要 - (EPUB全文下载)