BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案 - 文章教程

BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案

发布于 2020-01-02 字数 4978 浏览 2247 评论 0

BindingX 是阿里巴巴开源的一套基于 weex / React Native 的富交互解决方案,它提供了一种称之为 表达式绑定(Expression Binding) 的机制可以在 weex 上让手势等复杂交互操作以 60fps 的帧率流畅执行,而不会导致卡顿,因而带来了更优秀的用户体验。

BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案

简要介绍

由于 weex/RN框架底层使用的 JS-Native Bridge 具有天然的异步特性,这使得 JSNative 之间的通信会有固定的性能损耗,因此在一些复杂的实时交互场景中(如手势),JS 代码很难以高帧率运行,这极大地限制了框架的能力。目前官方并没有很好的方式解决。

而我们通过探索,提出了一种全新的方式用来解决这个问题,方案称之为 Expression Binding 。它的核心思想是将”交互行为”以表达式的方式描述,并提前预置到 Native 中从而避免 Native 与 JS 频繁通信。

示例展示

下面展示了一部分使用bindingx的示例。您可以下载或者编译我们的playground app来获取更多的示例。同时,您也可以在我们的在线playground上编写您自己的demo。

BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案 BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案 BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案 BindingX 阿里巴巴开源基于 weex / React Native 的富交互解决方案

特性

  • 复杂但流畅的交互效果
  • 强大的表达式解析引擎
  • 丰富的缓动函数

Weex 接入

前置条件

确保你已经集成了weex_sdk

Android

有两种集成方式可供选择。

  1. 手动集成。(推荐)
  • 在您项目中的build.gradle中添加依赖:
    implementation 'com.alibaba.android:bindingx-core:1.0.1'
    implementation 'com.alibaba.android:bindingx_weex_plugin:1.0.1'
  • 在工程的合适位置(如Application#onCreate)注入BindingX模块。
    BindingX.register()
  1. 使用weex plugin loader自动注入bindingx。
  • 在您项目中的build.gradle中添加依赖:
    implementation 'com.alibaba.android:bindingx-core:1.0.1'
    implementation 'com.alibaba.android:bindingx_weex_plugin:1.0.1'
    implementation 'org.weex.plugin:plugin-loader:1.0.0'
  • 在工程的合适位置(如Application#onCreate)加载插件。
    WeexPluginContainer.loadAll(getApplicationContext());

iOS

CocoaPods

在您项目中的 Podfile 中添加依赖:

pod 'BindingX', '~> 1.0.1'

自动注册 module,无需手动注册。

React Native 接入

前置条件

确保你已经集成了react native。

注:目前我们还没有把插件代码上传到 npm,所以您现在需要通过源码依赖我们的 RN 插件。 我们近期会将插件上传到 npm,届时您可以通过 npm 安装插件。

相关链接

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

目前还没有任何评论,快来抢沙发吧!

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

2891 文章
评论
84935 人气
更多

推荐作者

时光倒影

文章 0 评论

qq_YyjhCs

文章 0 评论

三人与歌

文章 0 评论

┼──瘾||

文章 1 评论