阅读 661

iOS混合开发库(GICXMLLayout)一、介绍

功能介绍

GICXMLLayout(以下简称GIC)是iOS上的一个全新的混合开发库,项目地址:github.com/ghwghw4/GIC…

在线文档地址:gicxmllayout.gonghaiwei.cn

GICXMLLayout能干什么?有什么特点?

  1. 使用XML来描述UI、动画、事件绑定、数据绑定。

    是的,你可以直接使用XML来写动画、甚至直接调用CGContext来画线、图形甚至报表。

  2. 数据绑定

    GIC提供了优秀的数据绑定能力,绑定语法类似于前端的VUE,当然也支持JS表达式。目前支持三种绑定模式,分别是:once:一次性、 one way:单向绑定、two way:双向绑定

  3. 支持MVVM模式。

    UI是使用XML来描述的,而业务逻辑你可以使用Native代码或者直接JavaScript来写。并且得益于数据绑定功能,做到了UI和业务逻辑的完全分离。开发体验上接近前端的开发。

  4. 优秀的布局系统。

    相比较于iOS原生的自动布局,GIC的布局系统将会更加的灵活方便、也更简单、布局性能也更高,更是提供了完整的类似前端FlexBox布局的布局面板。使得在实际的开发过程中,使用极少的代码就能写出复杂的布局。整个布局体验类似前端的HTML+CSS,但是GIC更加简单。事实上,但凡使用过flex布局系统的同学都知道这套布局系统是多么的好用。

  5. 模板系统

    类似于前端的template技术,你可以将部分UI封装成模板(事实上任何能够使用XML描述的都可以封装成模板),然后在任意地方使用已封装的模板。甚至支持模板嵌套占位模板,使得在实际的开发过程中,进一步的简化UI的开发流程。

  6. 简单、优秀的自定义扩展能力。

    GIC在自定义扩展方面做到了尽可能的简化。你甚至可以直接一行代码就将原来写的UIViewUIViewController变成自定义元素,然后在XML中调用。可以参考文档中的自定义一章,

  7. 支持JavaScript

    最新版本支持大多数的ES6特性,包括但不限于promiseyieldarrow functionclass等,也支持ES8asyncawait等特性。最低适配iOS8.0。(注:iOS9.0及以下版本是不支持ES6、ES8的,但是GIC支持)

  8. 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了。然后通过将XMLJavaScriptImages等静态资源打包更新的方式来实现整个APP的Hot Update功能。

其实您可能会说,这个库相较于RN、Weex等有什么优势?GIC的开发初衷可不是用来替代RNWeex的,而是对现有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-CSwift等语言拜拜了,GIC只是对现有iOS开发方式的一种扩充,但是自定义元素、自定义behavior等其他自定义功能,仍然需要你自己使用OCSwift进行开发。

事实上在基于GIC的基础上,你可以自己扩展出属于自己的一套自定义元素、behavior,然后开发出类似小程序那样的功能。

关注下面的标签,发现更多相似文章
评论