Skip to content

Commit

Permalink
init, upload iOS
Browse files Browse the repository at this point in the history
  • Loading branch information
ronghui.zrh committed Mar 8, 2022
1 parent 9ed0d3d commit dbf4d1f
Show file tree
Hide file tree
Showing 50 changed files with 4,100 additions and 0 deletions.
15 changes: 15 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
*.mode1
*.mode1v3
*.mode2v3
*.perspective
*.perspectivev3
*.pbxuser
*.xcworkspace
*.framework/
xcuserdata
examples/iOS/Pods/
src/iOS/Pods/
src/Android/build/
examples/Android/build/
**/.idea
**/.vscode
96 changes: 96 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
# 动效曲线

> [en-US](./README_en.md)
动效曲线SDK 由一系列的动效曲线函数构成,为了解决开发动效的成本高、效果和设计的预期不一致的问题,每个动效曲线函数可应用于任意一个可动效的属性上,通过改变动效过程中的速率和方向给用户带来更好的体验,目前包括线性曲线、加速曲线、减速曲线、余弦曲线、过度曲线、预期曲线、标准曲线(三次贝塞尔曲线)、弹跳曲线、弹性曲线等,目前支持 iOS 和 Android;

[语雀知识库地址](https://www.yuque.com/youku-gaia/gaia-motion-curve)

`iOS``Android`均用同一套动效曲线的算法实现,保证双端的动效的一致性,iOS 上层封装使用的是`Core Animation`,Android 则是使用的`插值器`

## iOS

#### 安装

```ruby
pod 'GaiaMotionCurve', '0.1.0'
```

#### 头文件

```objc
#import <GaiaMotionCurve/CALayer+GaiaMotionCurve.h>
```

#### 例子

```objc

#import <GaiaMotionCurve/CALayer+GaiaMotionCurve.h>

NSMutableArray *animationModels = [[NSMutableArray alloc] init];
GMCModel *model1 =[GMCModel modelWithKeyPath:@"opacity"
duration:0.2
delay:0
curveType:MCXCurveTypeStandard
fromValue:[NSValue gmc_valueWithCGFloat:0]
toValue:[NSValue gmc_valueWithCGFloat:0.9]];
[animationModels addObject:model1];
[_tipsImageView.layer gmc_animateWithAnimationModels:animationModels completion:^(BOOL finished) {}];

```
#### [完整iOS Demo 工程](./examples/iOS)
## Android
#### 安装
引入编译的aar文件
> 目录:src/Android/build/outputs
#### 包名
```java
import com.gaia.MotionCurve.*;
```

#### 例子

```java

TranslateAnimation animation = new TranslateAnimation(0, displaySize.x - maxTextWidth - 2 * margin, 0, 0);
animation.setFillAfter(true);
animation.setDuration(ANIMATION_DURATION);
animation.setInterpolator(new MotionCurveXStandardInterpolator());
view.startAnimation(animation);

```

#### [完整Android Demo 工程](./examples/Android)

## 曲线分类

* [线性曲线](./docs/zh-CN/linear.md)
* [加速曲线](./docs/zh-CN/accelerate.md)
* [减速曲线](./docs/zh-CN/decelerate.md)
* [标准曲线](./docs/zh-CN/standard.md)
* [预期曲线](./docs/zh-CN/anticipate.md)
* [过度曲线](./docs/zh-CN/overshoot.md)
* [弹性曲线](./docs/zh-CN/spring.md)
* [弹跳曲线](./docs/zh-CN/bounce.md)
* [余弦曲线](./docs/zh-CN/cosine.md)

# 行为准则

请参考[Alibaba Open Source Code of Conduct](https://github.com/AlibabaDR/community/blob/master/CODE_OF_CONDUCT.md) ([中文版](https://github.com/AlibabaDR/community/blob/master/CODE_OF_CONDUCT_zh.md)).


# 开源协议

gaia-motion-curve is licensed under the Apache License, Version 2.0. See LICENSE for the full license text.

90 changes: 90 additions & 0 deletions README_en.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
# Motion Curve

The Motion Curve SDK consists of a series of dynamic curve functions. In order to solve the problems of high cost of developing dynamic effects and inconsistent effects and design expectations, each dynamic curve function can be applied to any dynamic attribute. Bring a better experience to users by changing the speed and direction in the animation process, currently including linear curve, acceleration curve, deceleration curve, cosine curve, transition curve, expected curve, standard curve (cubic Bezier curve), bounce Curves, elastic curves, etc., currently support iOS and Android;

[YuQue](https://www.yuque.com/youku-gaia/gaia-motion-curve)

Both `iOS` and `Android` are implemented with the same set of motion curve algorithms to ensure the consistency of motion effects at both ends. The upper layer package of iOS uses `Core Animation`, and Android uses `Interpolator`.

## iOS

#### Install

```ruby
pod 'GaiaMotionCurve', '0.1.0'
```

#### Header

```objc
#import <GaiaMotionCurve/CALayer+GaiaMotionCurve.h>
```

#### Example

```objc
#import <GaiaMotionCurve/CALayer+GaiaMotionCurve.h>

NSMutableArray *animationModels = [[NSMutableArray alloc] init];
GMCModel *model1 =[GMCModel modelWithKeyPath:@"opacity"
duration:0.2
delay:0
curveType:MCXCurveTypeStandard
fromValue:[NSValue gmc_valueWithCGFloat:0]
toValue:[NSValue gmc_valueWithCGFloat:0.9]];
[animationModels addObject:model1];
[_tipsImageView.layer gmc_animateWithAnimationModels:animationModels completion:^(BOOL finished) {}];

```
#### [Full iOS Demo Project](./examples/iOS)
## Android
#### Install
import compiled aar file
> Directory:src/Android/build/outputs
#### Package
```java
import com.gaia.MotionCurve.*;
```

#### Example

```java
TranslateAnimation animation = new TranslateAnimation(0, displaySize.x - maxTextWidth - 2 * margin, 0, 0);
animation.setFillAfter(true);
animation.setDuration(ANIMATION_DURATION);
animation.setInterpolator(new MotionCurveXStandardInterpolator());
view.startAnimation(animation);

```

#### [Full Android Demo Project](./examples/Android)

## Motion Curve Categories

* [Linear](./docs/en-US/linear.md)
* [Accelerate](./docs/en-US/accelerate.md)
* [Decelerate](./docs/en-US/decelerate.md)
* [Standard](./docs/en-US/standard.md)
* [Anticipate](./docs/en-US/anticipate.md)
* [Overshoot](./docs/en-US/overshoot.md)
* [Spring](./docs/en-US/spring.md)
* [Bounce](./docs/en-US/bounce.md)
* [Cosine](./docs/en-US/cosine.md)

# Code of Conduct

Please refer to [Alibaba Open Source Code of Conduct](https://github.com/AlibabaDR/community/blob/master/CODE_OF_CONDUCT.md).


# LICENCE

gaia-motion-curve is licensed under the Apache License, Version 2.0. See LICENSE for the full license text.

Binary file added docs/assets/accelerate.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/anticipate.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/bounce.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/cosine.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/decelerate.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/linear.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/overshoot.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/spring.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/assets/standard.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
93 changes: 93 additions & 0 deletions docs/en-US/accelerate.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
# Accelerate

## Demo

<img src="./assets/accelerate.gif" height="30%" width="30%">

## iOS

Enumerate:GMCCurveTypeAccelerate

```objc
#import <GaiaMotionCurve/CALayer+GaiaMotionCurve.h>

CGFloat right = [[UIScreen mainScreen] bounds].size.width - 80 - 20;
GMCModel *model = [GMCModel modelWithKeyPath:@"position.x"
duration:0.75
delay:0
curveType:GMCCurveTypeAccelerate
fromValue:[NSValue gmc_valueWithCGFloat:_animationView.center.x]
toValue:[NSValue gmc_valueWithCGFloat:right]];
__weak typeof(self) weakSelf = self;
[_animationView.layer gmc_animateWithAnimationModels:@[model] completion:^(BOOL finished) {
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
weakSelf.animationView.layer.frame = CGRectMake(80, 200, 40, 40);
});
}];
```
## Android
Interpolator:GaiaMotionCurveAccelerateInterpolator
```java
import com.gaia.MotionCurve.*;
View animationView = findViewById(R.id.animation_view);
TranslateAnimation animation = new TranslateAnimation(0, 700, 0, 0);
animation.setFillAfter(true);
animation.setDuration(700);
animation.setInterpolator(new GaiaMotionCurveAccelerateInterpolator());
animationView.startAnimation(animation);
```

## Customizable Parameters

Configurable Parameters:

```
x1: x coordinate of control point x1
y1: y coordinate of control point y1
x2: x coordinate of control point x2
y2: y coordinate of control point y2
```

Default:

```
x1 = 0.4
y1 = 0.0
x2 = 1.0
y2 = 1.0
```

iOS

```objective-c
CGFloat right = [[UIScreen mainScreen] bounds].size.width - 80 - 20;
GMCModel *model = [GMCModel modelWithKeyPath:@"position.x"
duration:0.75
delay:0
curveType:GMCCurveTypeAccelerate
customArgs:@{@"x1":@0.4,@"y1":@0.0,@"x2":@1.0,@"y2":@1.0}
fromValue:[NSValue gmc_valueWithCGFloat:_animationView.center.x]
toValue:[NSValue gmc_valueWithCGFloat:right]];
__weak typeof(self) weakSelf = self;
[_animationView.layer gmc_animateWithAnimationModels:@[model] completion:^(BOOL finished) {
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
weakSelf.animationView.layer.frame = CGRectMake(80, 200, 40, 40);
});
}];
```
Android
```java
View animationView = findViewById(R.id.animation_view);
TranslateAnimation animation = new TranslateAnimation(0, 700, 0, 0);
animation.setFillAfter(true);
animation.setDuration(700);
animation.setInterpolator(new GaiaMotionCurveAccelerateInterpolator(0.4, 0.0, 1.0, 1.0));
animationView.startAnimation(animation);
```

Loading

0 comments on commit dbf4d1f

Please sign in to comment.