Skip to content

Commit

Permalink
feat(ios): rewrite animation module (#3436)
Browse files Browse the repository at this point in the history
* feat(ios): rewrite animation module

BREAKING CHANGE: this commit is a breaking change! Animation related code needs to be checked!

* docs(ios): animation demo and doc update

* chore(ios): add license to all pop files, remove some animation support
  • Loading branch information
wwwcg authored Aug 10, 2023
1 parent 593a11d commit 9899875
Show file tree
Hide file tree
Showing 86 changed files with 12,976 additions and 1,411 deletions.
6 changes: 4 additions & 2 deletions docs/en-us/hippy-react/modules.md
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand All @@ -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.
Expand Down Expand Up @@ -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.

Expand Down
6 changes: 4 additions & 2 deletions docs/hippy-react/modules.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@
- 通过 Animation 的 start 接口启动动画,或是通过 destroy 停止并销毁动画。

> 注意,转 Web 需要用 setRef 方法手动传入 ref 才可以正常运行动画,hippy-react-web 不支持颜色渐变动画。
>
> 注意,2.17.1版本对iOS动画进行了较大升级,修复了历史版本与Android端动画表现不一致的问题,升级时请关注兼容性。
## 构造参数

Expand All @@ -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`:使用线性插值器,动画将匀速进行;
Expand Down Expand Up @@ -74,7 +76,7 @@

`(callback: () => void) => void` 注册一个动画的监听回调,在动画结束时将会回调 callback。

### onAnimationRepeat(仅 Android 支持
### onAnimationRepeat(iOS 2.17.1版本开始支持

`(callback: () => void) => void` 注册一个动画的监听回调,当动画开始下一次重复播放时 callback 将被回调。

Expand Down
4 changes: 2 additions & 2 deletions examples/android-demo/res/index.android.js

Large diffs are not rendered by default.

14 changes: 7 additions & 7 deletions examples/android-demo/res/vendor.android.js

Large diffs are not rendered by default.

8 changes: 4 additions & 4 deletions examples/hippy-react-demo/src/modules/Animation/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -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: [
{
Expand Down Expand Up @@ -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}
Expand Down Expand Up @@ -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>

Expand Down
6 changes: 3 additions & 3 deletions examples/ios-demo/res/index.ios.js

Large diffs are not rendered by default.

10 changes: 5 additions & 5 deletions examples/ios-demo/res/vendor.ios.js

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions ios/sdk/base/HippyBridge.h
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@
@class HippyEventDispatcher;
@class HippyPerformanceLogger;
@class HippyUIManager;
@class HippyExtAnimationModule;
@class HippyNextAnimationModule;
@class HippyOCTurboModule;

NS_ASSUME_NONNULL_BEGIN
Expand Down Expand Up @@ -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;
Expand Down
4 changes: 2 additions & 2 deletions ios/sdk/base/HippyBridge.mm
Original file line number Diff line number Diff line change
Expand Up @@ -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"

Expand Down Expand Up @@ -222,7 +222,7 @@ - (id)moduleForClass:(Class)moduleClass {
return [self moduleForName:HippyBridgeModuleNameForClass(moduleClass)];
}

- (HippyExtAnimationModule *)animationModule {
- (HippyNextAnimationModule *)animationModule {
return [self moduleForName:@"AnimationModule"];
}

Expand Down
32 changes: 0 additions & 32 deletions ios/sdk/component/view/HippyView+HippyViewAnimation.h

This file was deleted.

67 changes: 0 additions & 67 deletions ios/sdk/component/view/HippyView+HippyViewAnimation.m

This file was deleted.

32 changes: 0 additions & 32 deletions ios/sdk/component/view/UIView+HippyAnimationProtocol.m

This file was deleted.

58 changes: 0 additions & 58 deletions ios/sdk/module/animation/CALayer+HippyAnimation.m

This file was deleted.

29 changes: 0 additions & 29 deletions ios/sdk/module/animation/HippyExtAnimation+Group.h

This file was deleted.

34 changes: 0 additions & 34 deletions ios/sdk/module/animation/HippyExtAnimation+Value.h

This file was deleted.

Loading

0 comments on commit 9899875

Please sign in to comment.