Skip to content
使用XML布局UI
Objective-C JavaScript Other
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
Example
GICXMLLayout 将触摸事件的初始化放在独立线程 Jan 3, 2019
doc
tools 1.将style 和 dock-panle的属性修改成 附加属性。 Jan 2, 2019
.gitignore
.travis.yml
GICXMLLayout.podspec 修改附加属性以及文档 Jan 2, 2019
LICENSE
README.md 修改文档 Jan 3, 2019
_Pods.xcodeproj Initial commit Jul 2, 2018

README.md

GICXMLLayout

CI Status Version License Platform

介绍

GICXMLLayout以下简称gic,是一个以XML来描述UI的一个库,同时兼有MVVM的功能。gic能够做什么?

  1. 以XML来描述UI、动画等。
  2. 纯粹的MVVM
  3. 支持数据绑定,类似h5中Vue提供的数据绑定能力
  4. 支持模板功能类似于h5中的模板功能。
  5. 支持JS直接操作元素,支持使用JS来写业务逻辑(支持ES6规范)。
  6. 强大的布局系统,甚至提供flex等复杂高效的布局
  7. 强大的自定义能力,能够使得开发者按照自己的意愿扩展出能够直接使用XML来描述的任意功能。
  8. 具有局部替换能力,可以对现有项目进行局部替换,使得局部功能具备MVVM+XML的能力。
  9. 由于是直接采用XML来描述,因此天生具备实时更新的能力
  10. gic的布局系统以及UI系统是基于Texture开发的,因此天生具有强大的性能优势

在线文档

在线文档链接

Installation

GICXMLLayout is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'GICXMLLayout', '~> 0.5.0'

IDE & 脚手架支持

GICXMLLayout已经有了配套的IDE开发工具以及脚手架的支持,以便你更快的创建项目以及进行开发。

IDE

目前GICXMLLayoutVSCode中开发了一款插件,名字叫GICVSCodeExtension,你可以直接在VSCode的插件市场中搜索安装,支持XML的智能提示、JavaScript编译、HotReloadingHotUpdate测试等功能。

脚手架

  1. 执行如下命令安装脚手架。(请确保已经安装了nodejs和npm)

    sudo npm install gicxmllayout-cli -g
  2. 执行如下命令,创建GIC工程。

    gic init YourProject
  3. 根据提示进行模板选择以及安装。

安装完成后搭配VSCode进行开发将会极大的提升开发效率。

Swift支持

0.2.1版本开始,GICXMLLayout可以支持swift语言。但是由于GICXMLLayout本身是基于OC开发的,因此在Swift中使用的时候需要使用桥接。步骤如下:

  1. 创建一个头文件。比如:Bridging-Header.h

  2. 在头文件中添加如下头文件引用。

    #ifndef Bridging_Header_h
    #define Bridging_Header_h
    #import <GICXMLLayout/GICXMLLayout.h>
    #endif /* Bridging_Header_h */
  3. 进入项目的build settings。然后找到Objective-C Bridging Header选项,将头文件的路劲添加上去。比如:

    18

这样就可以在Swift中使用GICXMLLayout

另外一个需要注意点:

  1. 所有的ViewModel都必须继承自NSObject

  2. 由于在Swfit4中, 继承自NSObject的Swift class 不再默认 BRIDGE 到 OC了,因此需要在class前面加上@objcMembers 这么一个关键字。比如

    @objcMembers class ViewModel: NSObject {
        ...
    }
  3. 不支持对Int? Float?等值类型的可空解析。因此在定义swift class 的时候避免使用 值类型的可空类型。但是String、Array、Dictionary是可以定义成可空类型的。

事实上,不只是ViewModel需要遵循以上的规则,所有在ViewModel中使用到的class,都必须遵循上述规则。

更新日志

0.1.1

  1. 新增样式(style)功能。文档

    您现在可以为您的UI元素添加样式了,您也可以将样式定义在单独的XML文件中,这样您可以为你的APP添加类似主题(theme)的功能了

0.2.0

  1. 增加canvas元素,当前处于beta阶段,但已经可以使用。canvas文档

    你现在可以直接使用xml来实现类似Core Graphics那样的功能了。你甚至可以直接使用canvas来实现一个报表,还支持动画哦。

  2. inpute元素增加keyboard-type 的支持。文档

  3. 增加control元素。文档

    control的功能类似UIControl,提供enablehighlightselected等状态管理。

  4. 增加data-context元素。文档

    现在可以直接将一大段json 字符串作为数据源添加到data-context中了。

  5. 增加router模块。文档

0.2.1

增加对Swift的支持

0.2.2

  1. lable元素增加对font属性的支持,现在可以为lable指定字体了。文档

  2. canvas元素中的path新增dash属性,现在可以为线条添加虚线的设置了。文档

  3. 调整事件分发机制。增加double-taptouch-begintouch-movetouch-end事件。文档

    目前已经将touch事件优化成直接使用系统本身提供的的事件分发机制。

0.3.0

这个版本因为涉及到对js的支持,在所有的版本中开发时间是最长的也是最艰难的一个版本。

  1. list添加对header和footer的支持。文档

  2. list添加对section的支持。文档

    支持多个section。当然也支持数据绑定。现在的list的功能已经很接近UITableView提供的功能了。

    注意:在使用方式上跟原来大体上无差别,但是需要把原来的list-item放入某个section元素中。不再支持裸的list-item

  3. 新增collection-view文档

    功能上类似UICollectionView,list支持的功能collection-view 同样支持。

  4. 新增script 元素,提供对js的支持。文档

    现在您可以直接使用js来操作UI元素的属性,甚至使用JS来实现业务逻辑。

0.3.1

  1. 新增grid-panel布局。文档

    布局效果类似collecttion-view,只是grid-panel没有滚动条,适合在list、collection-view等列表的list-item中使用。会自动计算内容高度。

  2. Script新增对setInterval 、clearInterval 的支持。

0.3.2

  1. Script增加JSAPI注册器。以便扩展JSAPI文档

    现在你可以通过GICJSAPIManager 来为动态添加JSAPI,以便形成你自己的一套独有的JSAPI集合。

  2. listcollection-view所有的section都支持添加header、footer。文档

  3. 动画触发条件支持任意事件。文档

0.4.0

  1. 增加JSRouter相关API,专门用来支持JS 导航相关。文档

  2. Router模块中的nav-bar元素增加title子元素

    现在你可以通过nav-bartitle节点自定义page 的 title-view

  3. image元素新增path属性。文档

    现在可以直接加载根目录下的图片

  4. JS API修改.文档

    1. 获取事件参数。可以通过$eventInfo 获取事件参数
    2. 增加require函数。现在可以在任意JS 脚本的任意位置动态加载js 文件
  5. list 元素增加显示索引功能。并且进一步的优化了显示性能。文档

0.4.2

  1. for指令增加对数组的insert 支持。

    1. NSMutableArray 增加对方法insertObjects:atIndexes:的支持。
    2. JS数组目前对splice 方法的已经得到完整支持。
  2. bug 修复。

0.4.3

  1. 新增JS 调用Toast 提示的API
  2. 增加了对Spring动画的支持。

0.4.4

  1. 新增transforms形变元素。文档

0.4.5

  1. JSRouter增加返回层级的参数。文档

    你现在可以选择返回的页面层级了。

0.4.6

  1. Router中的页面返回按钮隐藏文字。

  2. scroll-view元素增加水平滚动功能。文档

  3. lable元素增加如下功能。文档

    1. 提供对link的支持。
    2. 提供下划线、删除线的支持。

0.4.8

  1. for指令支持遍历JS对象。

  2. 完善require函数。用法相当于node.js中的用法

  3. 内置PromiseAPI

  4. 支持yield以及generator

    现在GIC已经可以支持ES8中的asyncawait了。

0.5.0

  1. 新增附加属性系统。文档

  2. grid-panelcollection-view 增加column-span附加属性。

  3. 触摸事件的eventInfo增加touch point 。文档

    代码中使用$eventInfo 来访问

Author

海伟, 693963124@qq.com

License

GICXMLLayout is available under the MIT license. See the LICENSE file for more info.

You can’t perform that action at this time.