feat(ios): rewrite animation module (Tencent#3436)

check pick from master 9899875

docs/en-us/hippy-react/modules.md

@@ -15,6 +15,8 @@
 - Start the animation through the start interface of Animation, or stop and destroy the animation through destroy.
 
 > Note that when switching to the web, you need to use the setRef method to manually pass in the ref to run the animation normally. hippy-react-web does not support color gradient animation.
+>
+> Note that version 2.17.1 greatly upgraded iOS animation, fixing the inconsistency between the historical version and the Android animation performance. Please pay attention to compatibility when upgrading.
 
 ## Construction Attributes
 
@@ -33,7 +35,7 @@
 
   - `rad`: Indicates that the starting and ending values of the animation parameters are in radians, `this is default unit of rotate`.
   - `deg`: Indicates that the starting and ending values of the animation parameters are in degrees.
-  - `color`: Indicates that the starting and ending values of the animation parameters are color values, which can modify the background color `backgroundColor` and text color `color` (only supported by Android), refer to [examples.](//github.com/Tencent/Hippy/blob/master/examples/hippy-react-demo/src/modules/Animation/index.jsx) `Minimum supported version 2.6.0`
+  - `color`: Indicates that the starting and ending values of the animation parameters are color values, which can modify the background color `backgroundColor` and text color `color` (Supported by iOS since version 2.17.1), refer to [examples.](//github.com/Tencent/Hippy/blob/master/examples/hippy-react-demo/src/modules/Animation/index.jsx) `Minimum supported version 2.6.0`
 
 - Other options for timingFunction:
   - `linear`: With a linear interpolator, the animation will proceed at a constant speed.
@@ -74,7 +76,7 @@
 
 `(callback: () => void) => void` Register an animation listener callback, which will be called back when the animation ends.
 
-### onAnimationRepeat (Android only)
+### onAnimationRepeat (Supported by iOS since version 2.17.1)
 
 `(callback: () => void) => void` Register an animation listener callback, which will be called back when the animation starts to repeat the next time.
 

docs/hippy-react/modules.md

@@ -15,6 +15,8 @@
 - 通过 Animation 的 start 接口启动动画，或是通过 destroy 停止并销毁动画。
 
 > 注意，转 Web 需要用 setRef 方法手动传入 ref 才可以正常运行动画，hippy-react-web 不支持颜色渐变动画。
+>
+> 注意，2.17.1版本对iOS动画进行了较大升级，修复了历史版本与Android端动画表现不一致的问题，升级时请关注兼容性。
 
 ## 构造参数
 
@@ -33,7 +35,7 @@
 
   - `rad`：代表动画参数的起止值为弧度， `这是 rotate 动画的默认单位`；
   - `deg`：代表动画参数的起止值为度数；
-  - `color`：代表动画参数的起止值为颜色值，可修饰背景色 `backgroundColor` 和文字颜色 `color`(仅 Android 支持)，参考 [例子](//github.com/Tencent/Hippy/blob/master/examples/hippy-react-demo/src/modules/Animation/index.jsx) `最低支持版本2.6.0`
+  - `color`：代表动画参数的起止值为颜色值，可修饰背景色 `backgroundColor` 和文字颜色 `color`(iOS 2.17.1版本开始支持)，参考 [例子](//github.com/Tencent/Hippy/blob/master/examples/hippy-react-demo/src/modules/Animation/index.jsx) `最低支持版本2.6.0`
 
 - timingFunction 的参数选项：
   - `linear`：使用线性插值器，动画将匀速进行；
@@ -74,7 +76,7 @@
 
 `(callback: () => void) => void` 注册一个动画的监听回调，在动画结束时将会回调 callback。
 
-### onAnimationRepeat（仅 Android 支持）
+### onAnimationRepeat（iOS 2.17.1版本开始支持）
 
 `(callback: () => void) => void` 注册一个动画的监听回调，当动画开始下一次重复播放时 callback 将被回调。
 

examples/hippy-react-demo/src/modules/Animation/index.jsx

@@ -230,7 +230,7 @@ export default class AnimationExample extends React.Component {
       ],
       repeatCount: 'loop',
     });
-    // TODO iOS暂不支持文字颜色渐变动画
+    // iOS support text color animation since 2.17.1
     this.txtColorAnimationSet = new AnimationSet({
       children: [
         {
@@ -561,7 +561,7 @@ export default class AnimationExample extends React.Component {
             }]}
           />
         </View>
-        <Text style={styles.title}>颜色渐变动画（文字渐变仅Android支持）</Text>
+        <Text style={styles.title}>颜色渐变动画</Text>
         <View style={styles.buttonContainer}>
           <View
               style={styles.button}
@@ -607,8 +607,8 @@ export default class AnimationExample extends React.Component {
           ><Text ref={(ref) => {
             this.textColorRef = ref;
           }} style={[styles.colorText, {
-            // TODO iOS暂不支持文字颜色渐变动画
-            color: Platform.OS === 'android' ? this.txtColorAnimationSet : 'white',
+            // iOS support text color animation since 2.17.1
+            color: this.txtColorAnimationSet,
           }]}>颜色渐变背景和文字</Text></View>
         </View>
 

ios/sdk/base/HippyBridge.h

@@ -37,7 +37,7 @@
 @class HippyEventDispatcher;
 @class HippyPerformanceLogger;
 @class HippyUIManager;
-@class HippyExtAnimationModule;
+@class HippyNextAnimationModule;
 @class HippyOCTurboModule;
 
 NS_ASSUME_NONNULL_BEGIN
@@ -206,7 +206,7 @@ HIPPY_EXTERN NSString *HippyBridgeModuleNameForClass(Class bridgeModuleClass);
  */
 @property (nonatomic, weak, readonly) id<HippyBridgeDelegate> delegate;
 
-@property (nonatomic, weak, readonly) HippyExtAnimationModule *animationModule;
+@property (nonatomic, weak, readonly) HippyNextAnimationModule *animationModule;
 
 @property (nonatomic, strong, readonly) id<HippyImageViewCustomLoader> imageLoader;
 @property (nonatomic, strong, readonly) id<HippyCustomTouchHandlerProtocol> customTouchHandler;

ios/sdk/base/HippyBridge.mm

@@ -31,7 +31,7 @@
 #import "HippyPerformanceLogger.h"
 #import "HippyUtils.h"
 #import "HippyUIManager.h"
-#import "HippyExtAnimationModule.h"
+#import "HippyNextAnimationModule.h"
 #import "HippyRedBox.h"
 #import "HippyTurboModule.h"
 
@@ -222,7 +222,7 @@ - (id)moduleForClass:(Class)moduleClass {
     return [self moduleForName:HippyBridgeModuleNameForClass(moduleClass)];
 }
 
-- (HippyExtAnimationModule *)animationModule {
+- (HippyNextAnimationModule *)animationModule {
     return [self moduleForName:@"AnimationModule"];
 }