功能介绍
GICXMLLayout
(以下简称GIC
)是iOS上的一个全新的混合开发库,项目地址:github.com/ghwghw4/GIC…
在线文档地址:gicxmllayout.gonghaiwei.cn
GICXMLLayout
能干什么?有什么特点?
-
使用XML来描述UI、动画、事件绑定、数据绑定。
是的,你可以直接使用XML来写动画、甚至直接调用CGContext来画线、图形甚至报表。
-
数据绑定。
GIC
提供了优秀的数据绑定能力,绑定语法类似于前端的VUE
,当然也支持JS表达式。目前支持三种绑定模式,分别是:once
:一次性、one way
:单向绑定、two way
:双向绑定 -
支持MVVM模式。
UI是使用XML来描述的,而业务逻辑你可以使用Native代码或者直接
JavaScript
来写。并且得益于数据绑定功能,做到了UI和业务逻辑的完全分离。开发体验上接近前端的开发。 -
优秀的布局系统。
相比较于iOS原生的自动布局,
GIC
的布局系统将会更加的灵活方便、也更简单、布局性能也更高,更是提供了完整的类似前端FlexBox
布局的布局面板。使得在实际的开发过程中,使用极少的代码就能写出复杂的布局。整个布局体验类似前端的HTML+CSS,但是GIC
更加简单。事实上,但凡使用过flex布局系统的同学都知道这套布局系统是多么的好用。 -
模板系统。
类似于前端的template技术,你可以将部分UI封装成
模板
(事实上任何能够使用XML描述的都可以封装成模板),然后在任意地方使用已封装的模板。甚至支持模板嵌套
、占位模板
,使得在实际的开发过程中,进一步的简化UI的开发流程。 -
简单、优秀的自定义扩展能力。
GIC
在自定义扩展方面做到了尽可能的简化。你甚至可以直接一行代码就将原来写的UIView
、UIViewController
变成自定义元素,然后在XML中调用。可以参考文档中的自定义一章, -
支持
JavaScript
。最新版本支持大多数的
ES6
特性,包括但不限于promise
、yield
、arrow function
、class
等,也支持ES8
的async
、await
等特性。最低适配iOS8.0。(注:iOS9.0及以下版本是不支持ES6、ES8的,但是GIC支持) -
HotRload
&HotUpdate
。HotRload
适用于开发调试,HotUpdate
适用于生产环境。当然前提是你的业务逻辑是用JavaScript
来写的。
开发初衷
作为一个iOS开发者,开发过大大小小差不多10多个APP,对于iOS的UI布局可以说是深有体会。在iOS上开发UI布局,有两种途径。1.storyboard(xib) 2.纯coding的形式。这里不比较哪种开发方式更好,我自己选择的是第二种方式。其实不管使用哪种方式,在开发效率上其实是很低的,尤其是列表类的页面开发,更甚者是非固定高度的列表类页面的开发,开发流程复杂、低效,还要考虑性能优化等问题。
举个例子:Feeds类的页面,这样的页面的特点是布局复杂,Cell的高度是不固定的,尤其是里面的lable显示,有的最多显示两行、有的不限行数等等,我们在实现这样功能的时候,一般是如下流程:自定义UITableViewCell
->创建布局UI->计算每个Cell的高度->显示Cell,这里面最复杂的并不是创建布局UI,而是需要你手动的计算Cell的高度,哪怕你使用了autolayout,但是计算Cell的高度这一步你还是逃不掉,因为UITableView
在显示的时候就需要你提供cell的高度,除了这些更不要说为UITableView
进行的各种性能优化的过程了。
而现在有了GIC
以后,你无需自定义UITableViewCell
,也无需手动去计算cell的高度,你只需要使用XML编写UI的布局代码即可,非常的方便。比如:
<!-- list 等同于UITableView -->
<list background-color="white" separator-style="1">
<section>
<!--使用for指令来将数据源中的数组循环生成list-item-->
<for>
<!-- list-item 等同于UITableViewCell -->
<list-item selection-style="2">
<inset-panel background-color="white" inset="15">
<lable text="{{ name }}" font-size="15"></lable>
</inset-panel>
</list-item>
</for>
</section>
</list>
复制代码
从XML的布局代码来看,你可以很容易的从中看到UITableView
的影子,有section
,有list-item(UITableViewCell)
,有每个Cell的布局代码,非常的简单,复杂的例子,您可以直接从项目自带的例子中查看。
随着GIC
开发的深入,后来发现如果业务逻辑仅仅是通过Native的ViewModel
来实现的话还是有局限性的,因此在最新版本中,基于JavaScriptCore
这个官方库实现了可以直接执行JavaScript
代码的功能。使用最新的版本,已经可以结合XML
+JavaScript
来开发一个完整的APP了。然后通过将XML
、JavaScript
、Images
等静态资源打包更新的方式来实现整个APP的Hot Update
功能。
其实您可能会说,这个库相较于RN、Weex等有什么优势?GIC
的开发初衷可不是用来替代RN
、Weex
的,而是对现有iOS开发方式的一种改进。
将原来native使用coding或者storybord、xib等方式来写UI的方式替换成完全使用XML来描述,并且将原来native需要对每个UI做frame计算或者使用autolayout布局的方式替换成另外一种自动布局方式,你无需去计算UI的frame,
GIC
会自动将每个元素的布局计算好。
GIC
目前只有iOS的版本,并不具备跨平台的能力。但除了这个以外,GIC
已经能满足大多数的开发需求,哪怕有些功能是不具备的,但您也可以通过自定义扩展的途径来实现特殊的需求,比如:有些页面的导航栏在滑动的时候需要渐变功能,这样的功能你完全可以通过自己扩展来实现,之后照样能使用XML来加载。RN、Weex等除了需要会JavaScript
以外,还需要你会HTML
+CSS
等技能,而GIC
在最简单的情况下,你只需要会XML
就行了。
有了GIC
以后并不意味着你能够直接跟Objective-C
、Swift
等语言拜拜了,GIC
只是对现有iOS开发方式的一种扩充,但是自定义元素、自定义behavior
等其他自定义功能,仍然需要你自己使用OC
、Swift
进行开发。
事实上在基于GIC
的基础上,你可以自己扩展出属于自己的一套自定义元素、behavior,然后开发出类似小程序
那样的功能。