didi / hummer

一套移动端高性能高可用的动态化跨端开发框架

简介

Hummer 是一套高性能高可用的跨端开发框架，一套代码可以同时支持开发 Android 和 iOS 应用。现已经支持 Vue/React/TypeScript/JavaScript 四种语法，面向大前端开发人员，总有一款适合你。

技术优势

正如 Hummer（蜂鸟）的名字一样，具有小巧轻盈的体态，迅猛强健的翅膀，以及色彩艳丽的外表。

• 超轻量： 小于 1M 的编译产物，能以极低的包体积成本接入到 App 中，打造极致轻量优势；
• 易上手： Hummer API + Tenon Reactive Framework，兼顾客户端和前端的开发体验，造就极低的学习门槛；
• 高可用： 已在滴滴内部多个业务中得到完整验证，整体 Crash 率低于 0.01%；
• 高性能： 基于原生组件和模块，可以最大化利用原生渲染的性能优势以及平台能力；
• 跨平台： 一套代码可以编译并运行于 iOS 和 Android 平台，使用 Tenon 可以快速兼容基于 Vue 开发的 Web 应用；
• 动态化： 利用 JavaScript 解释执行的特性，可以快速部署动态页面，配合 Hummer Nest 平台可以实现云端发布；

开始使用

• 官方文档请访问 Hummer 官网，点击【快速开始】按钮。
• 想创建一个全新的 Hummer 跨端应用，请参考 创建一个全新应用。
• 想在现有客户端项目中集成 Hummer 跨端框架，请参考 Android 端接入文档 和 iOS 端接入文档。
• 想了解更多客户端集成 Hummer 时的高阶用法，请参考 Android 进阶 和 iOS 进阶。
• 想了解更多 Hummer 调试相关的使用说明，请参考 调试文档。
• 想了解更多 Hummer CLI 脚手架的使用说明，请参考 CLI 使用教程。
• 想了解更多 Hummer 相关的基准测试报告，请参考 Hummer Standard Benchmarks。

简单演示

简单感受一下分别使用 Hummer API 和 Tenon 开发的 HelloWorld 页面对应的代码，以及分别在 Android 和 iOS 设备上运行的最终效果。

Hummer	Tenon

Android	iOS

关联仓库

仓库	说明
Hummer CLI	Hummer CLI 工具库
Hummer CLI Template	Hummer CLI 的模板仓库
Tenon Loader	Tenon Vue Loader
Tenon Plugins	Tenon 的插件库
N-API	抽象 JS 引擎库

协议

Hummer 基于 Apache-2.0 协议进行分发和使用，更多信息参见 协议文件。

团队成员

• 负责人 小枫

• 内部核心成员 小枫, ChasonTang, yFeii, AdamCaoQAQ, fangyeqing123, 卡布达, peakerWd, maxiee

• 贡献者榜单 duanlikang, LinJZong, viwii, zhugeafanti, tailang, jsbsdbd1025, MePride, AbeDai, ruosongyan, Yanliang, fxhfwf, lb2019s, jianyuanzong, conanmy, xikou1314, 未小林, jtsky, jayconscious, 宏宇, litianhao3615, Leo, jueying-key, WorriesL, QiYa, XingJimmy, 符孙浪

QQ 交流群

欢迎加入我们的 QQ 交流群【Hummer&Tenon跨端交流群】(851327307)，有任何 Hummer 使用上的问题和建议，都可以在群里直接反馈，我们会第一时间跟进。

微信公众号

欢迎关注我们团队的官方技术公众号【滴滴OrangeLab】，我们会在这里持续输出团队内部比较有深度的技术沉淀和经验分享，欢迎一起交流。

友情链接

• DoKit DoraemonKit /'dɔ:ra:'emɔn/，简称 DoKit，中文名 哆啦A梦，意味着能够像哆啦A梦一样提供给他的主人各种各样的工具。Just Do Kit
• Mand Mobile 一款优秀的面向金融场景的移动端 UI 组件库。
• OrangeLab 我们团队的官方 GitHub 组织，我们团队所有对外开源的其他项目都可以在这里找到。

hummer's Issues

议题模板

请提供所要求的所有资料。不遵循此格式的问题可能会停滞。

描述

请提供一个明确和简洁的描述什么是错误。如果需要，包括屏幕截图。
请使用最新的 Hummer 版本（master/main 分支）进行测试，以确保您的问题尚未修复。

Hummer version:

提供出现问题的 Hummer 版本号

Steps To Reproduce

提供重现问题的详细步骤列表。

预期结果

描述你期望发生的事情。

样例代码、屏幕截图或者仓库链接

请提供一个 GitHub 仓库链接或者提供一段最小复现代码。
如果您认为该应用程序与您的错误报告相关，则可以提供该应用程序的屏幕截图。
以下是一些提示，可以提供一个简单的示例：https://stackoverflow.com/help/mcve

【store】数据取值丢失

描述

store初始化的字段，如果字段初始值为null或undefined，页面跳转时，store内初始化字段对应的属性丢失

Hummer version:

1.2.2

复现步骤

1.在state.js里初始化一个 {orderDetail: null}
2.在页面中，声明...store.mapState({orderDetail => state.orderDetail})
取值：console.log(this.orderDetail) // 显示为undefined
console.log(Object.keys(store.state)) // 里面没有orderDetail

预期结果

object.keys(store.state) 中应该有orderDetail

hummer-cli无法安装

toString 等接口表现保持于 JSC 一致，或提供新的 API

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？
JSC 的 toString toNumber 会强转为目标类型，而 Hummer 存在类型判断

描述您希望的解决方案
提供新的于 JSC 的 toString 行为一致的方法

描述您考虑过的备选方案.
无

文档、适配、迁移策略
无

More than one file was found with OS independent path 'lib/x86/libc++_shared.so'

描述

Hummer version:

0.3.15

复现步骤

build构建项目的时候会报错

问题原因

因为自己项目也使用了c++的标准库libc++_shared.so, hummer也引入了该库所以导致了冲突

解决方案

在app的build.gradle作如下配置
android{
packagingOptions {
//只选择一个libc++_shared.so
pickFirst '**/libc++_shared.so'
}
}

list的点击事件当cell复用的时候,一次点击会执行多次

Hummer version:

0.3.15

复现步骤

在list的onUpdate中addEvent(),一次点击当cell复用的时候会执行多次

预期结果

addEvent()之前可以先调一下removeEvent()

Example

iOS端Image背景属性在Playground App中预览显示错误

Image背景属性在Playground App中预览显示错误

复现步骤

iOS 14.4 ,Hummer Playground 1.0 from TestFlight
1.预览 Image 视图组件，https://hummer.didi.cn/doc#/zh-CN/image
2.切换背景遮盖了Image

预期结果

显示正确

屏幕截图

iOS 可替换的 JavaScript 引擎

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？

None

描述您希望的解决方案
抽象 JSValue JSContext，并提供强弱指针

• 抽象 JSContext、JSValue、JSManagedValue 和实现 ExceptionModel
• 实现 JSValue 操作 JSContext 的部分
• 移植 JavaScriptCore C 代码

描述您考虑过的备选方案.
None

文档、适配、迁移策略

None

[iOS] -[UIView(HMDom) hm_layoutSubviews] UIView+HMDom.m:809

内部崩溃手机平台上有个崩溃，链接：http://mas.intra.xiaojukeji.com/application/qualitydetail/100841/ios/3?appId=100841&majorVersion=3.1.2&version=3.1.2.5040&calType=1&errTagTitle=-[UIView(HMDom)%20hm_layoutSubviews]%09UIView%2BHMDom.m:809&funcEnum=1&beginTime=1612839840000&endTime=1612926240000&msgId=C19D6AA5-4087-4C79-95C0-5A11C5E05E44&handler=待分配&status=待处理&statusCode=1&parentId=bea0344ab9986444f56eab0f744ee3aa

builtin isOfType bug

描述

0.2.3

复现步骤

1. var func = globalThis.hummer.render
2. func()
   此时函数上下文(this) 为undefine。导致执行出错

预期结果

bug fix

样例代码、屏幕截图或者仓库链接

Image组件在未设置宽高的时加载远程图片，无法自适应图片宽高

描述

Image组件在未设置宽或高时，加载远程图片，无法自适应图片宽高。

Hummer version:

复现步骤

1. 创建一个Image组件，只设置宽或者只设置高；
2. 加载一张远程图片；
3. Image组件的宽或者高，没有按远程图片的宽高自适应撑开；

预期结果

Image组件的宽或者高，可以按远程图片的宽高自适应撑开。

样例代码、屏幕截图或者仓库链接

实现 <script> 类似功能。

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？

使 tenon(或上层)，有能力提取公共js模块。
描述您希望的解决方案
实现 <script> 类似功能。
描述您考虑过的备选方案.
无
文档、适配、迁移策略

Object.assgin({},导出原生对象的js对象),会被覆盖原型链，导致所有原生方法无法调用。

PanEvent 无效

Hummer version:

0.2.3

复现步骤

1. tenon2 添加 PanEvent。
2. 触发手势，构建 PanEvent ，builtin中的 hummerCreateObject,使用 Object.create(globalThis[jsClassName].prototype)，
3. tenon2 触发 eventcallback 时，会使用object.assgin({},event); 之后 event 的原型链被覆盖。
4. 所有导出方法，属性无效

预期结果

期望 能够正常调用 naive 方法

样例代码、屏幕截图或者仓库链接

ViewPager setCurrentItem bug

请提供所要求的所有资料。不遵循此格式的问题可能会停滞。

描述

ViewPager setCurrentItem 某些场景下无效或异常

Hummer version:

iOS 0.2.3

复现步骤

提供重现问题的详细步骤列表。

1. 创建 ViewPager canLoop = false。
2. setCurrentItem 增加有效，减少无效。

预期结果

setCurrentItem 表现正常

样例代码、屏幕截图或者仓库链接

let pager = new ViewPager();
     pager.style = {
      width: '100%',
      height: '80',
      canLoop: false,
      autoPlay: true,
      loopInterval: 2000,
};
 pager.data =[
      'https://pics7.baidu.com/feed/2934349b033b5bb5face6fe9f6263c3eb700bc8d.jpeg?token=5b566a95be41397671b7c6e45d97e64f&s=E8CABC444223071DEA84B49803008091',
      'https://pt-starimg.didistatic.com/static/starimg/img/jEv0wHEGSj1607860825566.png',
      'https://pt-starimg.didistatic.com/static/starimg/img/5IR0XHVxGa1607861443454.png',
    ];
this.appendChild(pager)

let v1 = new View()
    v1.style = {
      position:"absolute",
      width:100,
      height:100,
      backgroundColor: '#333333',
      top:200
    }
    this.appendChild(v1)

    let v2 = new View()
    v2.style = {
      position: "absolute",
      width: 100,
      height: 100,
      backgroundColor: '#ff0000',
      top: 200,
      left: 150
    }
    this.appendChild(v2)

    let v3 = new View()
    v3.style = {
      position: "absolute",
      width: 100,
      height: 100,
      backgroundColor: '#ff0000',
      top: 200,
      left: 300
    }
    this.appendChild(v3)

    var idx = 0
    v1.addEventListener("tap", event => {
      pager.setCurrentItem(--idx);
    });

    v2.addEventListener("tap", event => {
      pager.setCurrentItem(++idx);
    });

    v3.addEventListener("tap", event => {
      idx = 0;
      pager.setCurrentItem(0);
    });

希望能有一个现有项目集成hummer的demo，安卓和ios的

希望能有一个现有项目集成hummer的demo，安卓和ios的

fixed 可能或受布局时机影响。

请提供所要求的所有资料。不遵循此格式的问题可能会停滞。

描述

iOS fixed 可能或受布局时机影响。可能会出现 fixed 被挡住。进一步使用zindex。会导致视图显示正常，但无法点击

0.2.3

Hummer version:

提供出现问题的 Hummer 版本号

复现步骤

提供重现问题的详细步骤列表。

1. 使用fixed布局
2. 在fixed 布局结束后，给根容器添加 flex。

预期结果

fixed 与css 表现一致，切zindex有效

样例代码、屏幕截图或者仓库链接

无

iOS端需完善onBack生命周期

功能请求

• 我想要完成此功能
  Tenon-vue mixins onBack生命周期执行顺序优化
  hummer iOS sdk 原生支持onBack生命周期

文档、适配、迁移策略

Hummer 提供 fetch 请求库

功能请求

• 我想要完成此功能

为了便于迁移 Web 的页面到 Hummer 场景中， 需要实现浏览器中的 Fetch 请求，整体类似于 [node-fetch](https://github.com/node-fetch/node-fetch) 的实现。

fetch 标准文档

您的功能请求是否与一个问题有关？

我有一个问题，当我尝试迁移 Web 业务代码时，我引入的三方工具库，依赖于 window 的 fetch 实现，导致我不得不重新改造三方工具库，迁移成本较高。

描述您希望的解决方案
实现 hummer-fetch 库

描述您考虑过的备选方案.

文档、适配、迁移策略

DevTool

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？

无

描述您希望的解决方案

• WebSocket 对接 CLI
• 实现必需 console 方法
• exception 和 console 都发送

描述您考虑过的备选方案.
无

文档、适配、迁移策略

Android Glide SDK upgrade to 4.9.0

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？
None

描述您希望的解决方案

• 升级glide图片库的版本，从3.6.1升级到4.9.0，注意会存在 Breaking Change。

描述您考虑过的备选方案.
None

文档、适配、迁移策略
可以查看glide库最新版本的接入方式：https://github.com/bumptech/glide

hummer-cli无法安装

[Android] Scroller组件的子控件无法设置百分比和flexGrow等属性的问题

描述

Scroller组件的子控件，无法设置百分比属性，flexGrow等属性。

Hummer version:

0.3.16

复现步骤

预期结果

Scroller组件的子控件，可以设置百分比属性，flexGrow等属性。

样例代码、屏幕截图或者仓库链接

Tenon 提供 Tenon Router 生态包

功能请求

• 我想要完成此功能

为了对接 Vue 前端生态，路由层面，需要提供类似 Vue Router的包，对齐 Vue Router 的 Api，便于快速实现路由间的快速切换。

您的功能请求是否与一个问题有关？

现在 Tenon Vue 生态中，缺乏 Vue Router，缺少一个完善的路由管理工具。在迁移 Web 项目中， 路由模块需要完全重写，成本较大。

描述您希望的解决方案
实现 tenon-vue-router 库

描述您考虑过的备选方案.

文档、适配、迁移策略

hummer init失败

npm registry指向didi内部域名 无法拉取模版工程

单元测试完善

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？

否

描述您希望的解决方案
提供核心功能，组件的单元测试

描述您考虑过的备选方案.
无

文档、适配、迁移策略

无

@hummer/[email protected] 创建新工程后安装依赖失败

选择的工程类型为： vue

日志如下：

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.com/@didi%2ftenon-core - Not found
npm ERR! 404
npm ERR! 404 '@didi/tenon-core@^1.0.0' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache_logs\2021-01-11T03_48_29_632Z-debug.log

@didi/tenon-core 在npm、cnpm 上均未能找到

交流互动

欢迎留言~

test

请提供所要求的所有资料。不遵循此格式的问题可能会停滞。

描述

请提供一个明确和简洁的描述什么是错误。如果需要，包括屏幕截图。
请使用最新的 Hummer 版本（master/main 分支）进行测试，以确保您的问题尚未修复。

Hummer version:

提供出现问题的 Hummer 版本号

复现步骤

提供重现问题的详细步骤列表。

预期结果

描述你期望发生的事情。

样例代码、屏幕截图或者仓库链接

请提供一个 GitHub 仓库链接或者提供一段最小复现代码。
如果您认为该应用程序与您的错误报告相关，则可以提供该应用程序的屏幕截图。
以下是一些提示，可以提供一个简单的示例：https://stackoverflow.com/help/mcve

HMUIManager origin 处理错误

描述

HMUIManager 在 preserveOrigin 的时候，错误处理了老的 origin

Hummer version:

iOS 0.2.3

复现步骤

无

预期结果

新老 origin x 和 x 相加，y 和 y 相加

样例代码、屏幕截图或者仓库链接

frame = (CGRect) {
    .origin = {
            .x = (CGRectGetMinX(frame) + inlineView.frame.origin.x),
            .y = (CGRectGetMinY(frame) + inlineView.frame.origin.y),
    },
    .size = frame.size
};

DevTool 支持

有无对应的 DevTool 工具或者插件？

现在在 Playground 中扫码无法看到 console 及错误信息

Hummer 支持 Canvas

功能请求

Hummer 支持 Canvas 的相关 Api

• 我想要完成此功能

您的功能请求是否与一个问题有关？

我有一个问题，业务场景中需要通过 canvas 实现进度条，类似如下：

描述您希望的解决方案
Hummer 侧提供 Canvas 组件，暴露出 Canvas 的各种api，支持绘制；
Tenon 侧实现 Canvas 标签，通过 ref 的方式拿到实例，进行绘制。

动画组件增加repeatMode字段

功能请求

• 动画组件增加repeatMode字段，表明动画的重复模式。

您的功能请求是否与一个问题有关？

无

描述您希望的解决方案
动画组件增加repeatMode字段，表明动画的重复模式。
有两种重复模式：

1. 正常重新开始；
2. 反向重新开始；

描述您考虑过的备选方案.
无

文档、适配、迁移策略

无

热更新问题，更改背景颜色后，不生效

描述

热更新问题，更改背景颜色后，不生效，点击刷新也不生效，重新进入页面，页面恢复正常

修改代码，在注释，页面热更新不生效

复现步骤

1. 注释 background-color: blue;
2. 观察页面是否还是蓝色

预期结果

页面变为白色

样例代码、屏幕截图或者仓库链接

<template>
  <view class="page">
    <text class="slogan">{{ slogan }}</text>
  </view>
</template>

<script>
export default {
  pageConfig: {
    canScroll: false,
  },
  data() {
    return {
      slogan: "~ Hello Tenon ~",
    };
  },
  methods: {},
};
</script>

<style lang="less" scoped>
.page {
  width: 100%;
  display: flex;
  height: 2rem;
  justify-content: center;
  background-color: blue;
  color:#ccc;
}
.slogan {
  font-size: 0.42rem;
}
</style>

可滚动视图布局适配

背景

可滚动视图一般由 UIView 实现，通过修改 bounds.origin 做到视口的上下左右滑动，但是布局引擎判断一个视图是否为重新布局的视图，是通过

struct HMLayoutMetrics {
    CGRect frame;
    CGRect contentFrame;
    UIEdgeInsets borderWidth;
    HMDisplayType displayType;
    UIUserInterfaceLayoutDirection layoutDirection;
};

该结构体作为指标来判断的，如果一个滚动视图被限定了高度和宽度，那么这个视图永远不需要重新布局，但是实际上 contentSize 和 contentOffset 是需要被重新设置的，因此需要有个时机更新这些属性

解决方案

ScrollView 添加一个 contentView 作为唯一子视图，其他视图都被添加到 contentView，当高度发生变化的时候，contentView 会强制 ScrollView 更新属性

视图管理处理

1. addSubview:
2. insertSubview:atIndex:
3. insertSubview:aboveSubview:
4. insertSubview:belowSubview:

需要重定向到 contentView

contentSize 发生变化处理

1. contentView 的 hummerSetFrame 可以得知自身大小发生变化
2. 应当通知 ScrollView
3. ScrollView 需要根据 contentView.frame.size 的变化计算 offset 变化
4. 更新 offset 和 contentSize

视口本身发生变化

比如 ScrollView 本身的 height width 约束发生变化，而 contentView 没有任何变化，建议使用 setFrame 方法来感知，因为 hummerSetFrame: -> self.bounds = bounds; 会触发 setFrame

HMCompatibleRenderObject 关于 UIScrollView 问题修复

描述

HMCompatibleRenderObject 需要将 Scroller 性能优化限制在 HMScrollView 中

Hummer version:

0.2.3

复现步骤

None

预期结果

不影响 UIScrollView

样例代码、屏幕截图或者仓库链接

None

Feature: iOS平台支持transition语法动画

功能请求

• iOS平台支持transition语法动画

您的功能请求是否与一个问题有关？

无

描述您希望的解决方案
解析记录style中transition相关设置，当对应属性被修改时，生成对应HMCABasicAniamtion 动画对象并执行动画

描述您考虑过的备选方案.
无

文档、适配、迁移策略

// 设置transition
    this.transitionAnimationView.style = {
      width: 100,
      height: 100,
      backgroundColor: '#565656',
      transitionDelay: 0,
      transitionProperty: 'width, height, transform, backgroundColor, opacity',
      transitionDuration: '2',
      transitionTimingFunction: 'ease-in',
    }

// 修改对应动画属性执行动画
   this.transitionAnimationView.style = {
      width: 50,
      backgroundColor: '#956789',
      transform: ['scale(0.5)','translate(60,100)','rotateZ(60)'],
    }

Android 端无障碍功能在Android8.0及以下系统无法播报”已选中“的问题

请提供所要求的所有资料。不遵循此格式的问题可能会停滞。

描述

Android 端无障碍功能在Android8.0及以下系统无法播报”已选中“的问题。

Hummer version:

0.3.15

复现步骤

1. 打开手机的无障碍功能；
2. 选中一个设置了 accessibilityState = {selected: true} 属性的控件；
3. 无法正常播报“已选中”；

预期结果

正常播报“已选中”。

样例代码、屏幕截图或者仓库链接

None

请求加入sqlite组件

功能请求

• 我想要完成此功能

您的功能请求是否与一个问题有关？

我有一个问题，开发离线功能的app时需要操作本地sqlite，请问能否加入sqlite数据库的组件，谢谢🙏
描述您希望的解决方案
希望ios和Android都能加入sqlite数据库的组件。
描述您考虑过的备选方案.

文档、适配、迁移策略

iOS 中 Dialog 组件多个实例相互覆盖

描述

iOS 中 Dialog 组件多个实例会相互覆盖
比如，同时存在两个实例，前一个实例展示，后一个实例不展示，预期效果是展示前一个实例，但是iOS中无法展示，Android 中展示正常

Hummer version:

最新版本

复现步骤

1.创建两个 Dialog实例

预期结果

样例代码、屏幕截图或者仓库链接

hummer.env 某些情况下无法更新

描述

hummer.env 某些情况下无法更新

Hummer version:

0.2.3

复现步骤

1. native addGlobalEnviroment
2. env.copy 导致 crash

预期结果

功能正常使用

样例代码、屏幕截图或者仓库链接

是否支持文件缓存到用户侧本地

功能请求

需要开发完整离线的应用，需要缓存音乐以及视频到本地。
在Hummer文档中没有看到有相关缓存api以及缓存管理api。
不知是否有计划进行适配。

Tenon编辑的，多Input组件，只有第一个能获取焦点，其他无法获取焦点

描述

多Input组件，只有第一个能获取焦点，其他无法获取焦点

Hummer version:

android
implementation 'com.didi.hummer:hummer:0.3.15'
hummer

复现步骤

预期结果

样例代码、屏幕截图或者仓库链接

<template>
  <view
    style="
      flex-direction: column;
      justify-content: flex-start;
      width: 500hm;
      height: 88hm;
      padding: 20hm 40hm;
    "
  >
    <view
      style="
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        width: 500hm;
        height: 88hm;
      "
    >
      <text style="width: 150hm; height: 100%; font-size: 40hm">用户名</text>
      <input
        style="width: 100%; height: 100%; font-size: 40hm"
        placeholder="请输入用户名"
      />
    </view>
    <view
      style="
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        width: 500hm;
        height: 88hm;
      "
    >
      <text style="width: 150hm; height: 100%; font-size: 40hm">用户名</text>
      <input
        style="width: 100%; height: 100%; font-size: 40hm"
        placeholder="请输入用户名"
      />
    </view>
  </view>
</template>

hm_sizeThatFits: bug

描述

• hm_sizeThatFits: 提供确定大小会导致最外层容器直接使用这个大小

Hummer version:

iOS 0.2.3

复现步骤

1. Example 中运行提供的代码片段单元测试

预期结果

大小应当小于给出的 maxSize

样例代码、屏幕截图或者仓库链接

it("test - hm_sizeThatFits:") {
    let view = UIView()
    view.isHmLayoutEnabled = true
    let button = UIButton(type: .custom)
    button.isHmLayoutEnabled = true
    button.setTitle("Happy Coding, Hello world, Happy Script", for: .normal)
    view.addSubview(button)
    let size = view.hm_sizeThatFits(CGSize(width: 375, height: 667))
    print("\(size)");
}

Feature: iOS平台 倾斜（skew）动画支持

功能请求

• iOS平台 倾斜（skew）动画支持

您的功能请求是否与一个问题有关？

无

描述您希望的解决方案
BasicAnimation支持skew解析，对拿到的value(eg:{30,45})转换成对应的transform 矩阵，执行动画

描述您考虑过的备选方案.
无

文档、适配、迁移策略

    let anim = new BasicAnimation('skew')   
    anim.value = {x: 45, y:45}  
    anim.duration = 2  
    anim.delay = 0  
    anim.repeatCount = 1  
    anim.easing = 'linear'  
    this.animationView.addAnimation(anim, 'anim')  

Tenon Vue 支持自定义 Hook 机制

功能请求

需求背景：

现在需要侵入到 Tenon Vue 的各个生命周期中，比如：拦截所有的事件，进行埋点的上报；拓展标签的属性，用于快捷的添加埋点，从而做到业务代码无侵入的场景。

• 我想要完成此功能

描述您希望的解决方案
需要 Tenon Vue 提供 Hook 机制，支持自定义插件，侵入到运行时中。

pending exception java.lang.NoSuchMethodError: No virtual method load(Ljava/lang/String;)Lcom/bumptech/glide/DrawableTypeRequest;

Hummer version:

0.3.15

##报错截图

原因

我们的项目引入了glide版本是4.11.0该版本删除了一些老版本的类,hummer使用的glide版本较老,导致hummer的图片加载时有些类和方法找不到

复现步骤

js上加载一张网络图片会报错

解决方案

自定义ImageLoaderAdapter, 基本上都是复制hummer sdk自带的DefaultImageLoaderAdapter,只是改了一下加载gif、drawable的地方
package com.bokecc.hummer;

import android.graphics.drawable.Drawable;
import android.widget.ImageView;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.resource.gif.GifDrawable;
import com.bumptech.glide.request.target.SimpleTarget;
import com.bumptech.glide.request.transition.Transition;
import com.didi.hummer.HummerSDK;
import com.didi.hummer.adapter.imageloader.DrawableCallback;
import com.didi.hummer.adapter.imageloader.IImageLoaderAdapter;
/**

• @author [email protected]

• @Date 4/15/21

• @desc hummer图片加载适配器
  */
  public class HummerDefaultImageLoaderAdapter implements IImageLoaderAdapter {

  @OverRide
  public void setImage(String url, ImageView view) {
  try {
  Glide.with(view.getContext()).load(url).into(view);
  } catch (Exception e) {
  e.printStackTrace();
  }
  }

  @OverRide
  public void setGif(String url, int repeatCount, ImageView view) {
  // 设置为无限循环
  if (repeatCount == 0) {
  repeatCount = GifDrawable.LOOP_FOREVER;
  }
  try {
  int finalRepeatCount = repeatCount;
  Glide.with(view.getContext()).asGif().load(url).into(new SimpleTarget() {
  @OverRide
  public void onResourceReady(@nonnull GifDrawable resource, @nullable Transition<? super GifDrawable> transition) {
  resource.setLoopCount(finalRepeatCount);
  view.setImageDrawable(resource);
  resource.start();
  }
  });
  } catch (Exception e) {
  e.printStackTrace();
  }
  }

  @OverRide
  public void setImage(int resId, ImageView view) {
  try {
  Glide.with(view.getContext()).load(resId).into(view);
  } catch (Exception e) {
  e.printStackTrace();
  }
  }

  @OverRide
  public void setGif(int resId, int repeatCount, ImageView view) {
  // 设置为无限循环
  if (repeatCount == 0) {
  repeatCount = GifDrawable.LOOP_FOREVER;
  }
  try {
  int finalRepeatCount = repeatCount;
  Glide.with(view.getContext()).asGif().load(resId).into(new SimpleTarget() {
  @OverRide
  public void onResourceReady(@nonnull GifDrawable resource, @nullable Transition<? super GifDrawable> transition) {
  resource.setLoopCount(finalRepeatCount);
  view.setImageDrawable(resource);
  resource.start();
  }
  });
  } catch (Exception e) {
  e.printStackTrace();
  }
  }

  @OverRide
  public void loadDrawable(String url, DrawableCallback callback) {
  try {
  Glide.with(HummerSDK.appContext).load(url).into(new SimpleTarget() {
  @OverRide
  public void onResourceReady(@nonnull Drawable resource, @nullable Transition<? super Drawable> transition) {
  if (callback != null) {
  callback.onDrawableLoaded(resource);
  }
  }
  });
  } catch (Exception e) {
  e.printStackTrace();
  }
  }

  @OverRide
  public void loadDrawable(int resId, DrawableCallback callback) {
  try {
  Glide.with(HummerSDK.appContext).load(resId).into(new SimpleTarget() {
  @OverRide
  public void onResourceReady(@nonnull Drawable resource, @nullable Transition<? super Drawable> transition) {
  if (callback != null) {
  callback.onDrawableLoaded(resource);
  }
  }
  });
  } catch (Exception e) {
  e.printStackTrace();
  }
  }
  }

[Android] build失败

描述

android 源码点击构建时有以下错误：
A problem occurred configuring project ':hummer-core'.

java.lang.NullPointerException (no error message)

Hummer version:

android 0.3.16

复现步骤

1.打开项目
2.点击build构建

预期结果

样例代码、屏幕截图或者仓库链接

Tenon 中颜色值不支持 #eee 这种形式

描述

Tenon Vue 中开发页面时，设定颜色值为 color: #eee;这种三位形式时，并不会生效。

iOS repeatCount 无效

描述

iOS repeatCount 无效

Hummer version:

0.2.3

复现步骤

None

预期结果

api 使用正常

样例代码、屏幕截图或者仓库链接

None