react-native-reanimated-carousel 2.5.1 → 2.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +17 -62
- package/README.zh-CN.md +17 -63
- package/lib/commonjs/index.js +1 -1
- package/lib/commonjs/index.js.map +1 -1
- package/lib/module/index.js +6 -0
- package/lib/module/index.js.map +1 -1
- package/package.json +1 -1
- package/src/index.tsx +4 -0
package/README.md
CHANGED
|
@@ -23,68 +23,25 @@ English | [简体中文](./README.zh-CN.md)
|
|
|
23
23
|
|
|
24
24
|
> Click on the image to see the code snippets. [[Try it]](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
|
|
25
25
|
|
|
26
|
-
<
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
</a>
|
|
33
|
-
<a href="./example/src/parallax/index.tsx">
|
|
34
|
-
<img src="assets/parallax-horizontal.gif" width="300"/>
|
|
35
|
-
</a>
|
|
36
|
-
<a href="./example/src/parallax/index.tsx">
|
|
37
|
-
<img src="assets/parallax-vertical.gif" width="300"/>
|
|
38
|
-
</a>
|
|
39
|
-
<a href="./example/src/stack/index.tsx">
|
|
40
|
-
<img src="assets/stack-horizontal-left.gif" width="300"/>
|
|
41
|
-
</a>
|
|
42
|
-
<a href="./example/src/stack/index.tsx">
|
|
43
|
-
<img src="assets/stack-horizontal-right.gif" width="300"/>
|
|
44
|
-
</a>
|
|
45
|
-
<a href="./example/src/stack/index.tsx">
|
|
46
|
-
<img src="assets/stack-vertical-left.gif" width="300"/>
|
|
47
|
-
</a>
|
|
48
|
-
<a href="./example/src/stack/index.tsx">
|
|
49
|
-
<img src="assets/stack-vertical-right.gif" width="300"/>
|
|
50
|
-
</a>
|
|
51
|
-
</p>
|
|
26
|
+
| <img src="assets/normal-horizontal.gif"/> | <img src="assets/normal-vertical.gif"/> | <img src="assets/parallax-horizontal.gif"/> |
|
|
27
|
+
| :--------------------------------------------------------------: | :---------------------------------------------------------------: | :----------------------------------------------------------------: |
|
|
28
|
+
| <a href="./example/src/normal/index.tsx">normal-horizontal</a> | <a href="./example/src/normal/index.tsx">normal-vertical</a> | <a href="./example/src/parallax/index.tsx">parallax-horizontal</a> |
|
|
29
|
+
| <img src="assets/parallax-vertical.gif"/> | <img src="assets/stack-horizontal-left.gif"/> | <img src="assets/stack-horizontal-right.gif"/> |
|
|
30
|
+
| <a href="./example/src/parallax/index.tsx">parallax-vertical</a> | <a href="./example/src/stack/index.tsx">stack-horizontal-left</a> | <a href="./example/src/stack/index.tsx">stack-horizontal-right</a> |
|
|
31
|
+
| <img src="assets/stack-vertical-left.gif"/> | <img src="assets/stack-vertical-right.gif"/> | <img src="assets/stack-horizontal-right.gif"/> |
|
|
32
|
+
| <a href="./example/src/stack/index.tsx">stack-vertical-left</a> | <a href="./example/src/stack/index.tsx">stack-vertical-right</a> | <a href="./example/src/stack/index.tsx">stack-horizontal-right</a> |
|
|
52
33
|
|
|
53
34
|
> Now you can make cool animations with us! Very easy! [[Details]](./docs/custom-animation.md)
|
|
54
35
|
|
|
55
|
-
<
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
</a>
|
|
65
|
-
<a href="./example/src/rotate-scale-fade-in-out/index.tsx">
|
|
66
|
-
<img src="assets/rotate-scale-fade-in-out.gif" width="300"/>
|
|
67
|
-
</a>
|
|
68
|
-
<a href="./example/src/rotate-in-out/index.tsx">
|
|
69
|
-
<img src="assets/rotate-in-out.gif" width="300"/>
|
|
70
|
-
</a>
|
|
71
|
-
<a href="./example/src/anim-tab-bar/index.tsx">
|
|
72
|
-
<img src="assets/anim-tab-bar.gif" width="300"/>
|
|
73
|
-
</a>
|
|
74
|
-
<a href="./example/src/marquee/index.tsx">
|
|
75
|
-
<img src="assets/marquee.gif" width="300"/>
|
|
76
|
-
</a>
|
|
77
|
-
<a href="./example/src/multiple/index.tsx">
|
|
78
|
-
<img src="assets/multiple.gif" width="300"/>
|
|
79
|
-
</a>
|
|
80
|
-
<a href="./example/src/flow/index.tsx">
|
|
81
|
-
<img src="assets/flow.gif" width="300"/>
|
|
82
|
-
</a>
|
|
83
|
-
<br/>
|
|
84
|
-
<a href="./example/src/parallax-layers/index.tsx">
|
|
85
|
-
<img src="assets/parallax-layers.gif" width="300"/>
|
|
86
|
-
</a>
|
|
87
|
-
</p>
|
|
36
|
+
| <img src="assets/advanced-parallax.gif"/> | <img src="assets/pause-advanced-parallax.gif"/> | <img src="assets/scale-fade-in-out.gif"/> |
|
|
37
|
+
| :-------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------: | :-----------------------------------------------------------------------: |
|
|
38
|
+
| <a href="./example/src/advanced-parallax/index.tsx">advanced-parallax</a> | <a href="./example/src/pause-advanced-parallax/index.tsx">pause-advanced-parallax</a> | <a href="./example/src/scale-fade-in-out/index.tsx">scale-fade-in-out</a> |
|
|
39
|
+
| <img src="assets/rotate-scale-fade-in-out.gif"/> | <img src="assets/rotate-in-out.gif"/> | <img src="assets/anim-tab-bar.gif"/> |
|
|
40
|
+
| <a href="./example/src/rotate-scale-fade-in-out/index.tsx">rotate-scale-fade-in-out</a> | <a href="./example/src/rotate-in-out/index.tsx">rotate-in-out</a> | <a href="./example/src/anim-tab-bar/index.tsx">anim-tab-bar</a> |
|
|
41
|
+
| <img src="assets/marquee.gif"/> | <img src="assets/multiple.gif"/> | |
|
|
42
|
+
| <a href="./example/src/marquee/index.tsx">marquee</a> | <a href="./example/src/multiple/index.tsx">multiple</a> | |
|
|
43
|
+
| <img src="assets/parallax-layers.gif"/> | <img src="assets/flow.gif"/> | |
|
|
44
|
+
| <a href="./example/src/parallax-layers/index.tsx">parallax-layers</a> | <a href="./example/src/flow/index.tsx">flow</a> | |
|
|
88
45
|
|
|
89
46
|
## Table of contents
|
|
90
47
|
|
|
@@ -185,9 +142,7 @@ yarn web:pretty
|
|
|
185
142
|
## Sponsors
|
|
186
143
|
|
|
187
144
|
<p align="center">
|
|
188
|
-
<
|
|
189
|
-
<img src='./sponsorkit/sponsors.svg'/>
|
|
190
|
-
</a>
|
|
145
|
+
<img src='./sponsorkit/sponsors.svg'/>
|
|
191
146
|
</p>
|
|
192
147
|
|
|
193
148
|
## License
|
package/README.zh-CN.md
CHANGED
|
@@ -23,69 +23,25 @@
|
|
|
23
23
|
|
|
24
24
|
> 点击图片，查看代码 [[试一下]](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
|
|
25
25
|
|
|
26
|
-
<
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
</a>
|
|
33
|
-
<a href="./example/src/parallax/index.tsx">
|
|
34
|
-
<img src="assets/parallax-horizontal.gif" width="300"/>
|
|
35
|
-
</a>
|
|
36
|
-
<a href="./example/src/parallax/index.tsx">
|
|
37
|
-
<img src="assets/parallax-vertical.gif" width="300"/>
|
|
38
|
-
</a>
|
|
39
|
-
<a href="./example/src/stack/index.tsx">
|
|
40
|
-
<img src="assets/stack-horizontal-left.gif" width="300"/>
|
|
41
|
-
</a>
|
|
42
|
-
<a href="./example/src/stack/index.tsx">
|
|
43
|
-
<img src="assets/stack-horizontal-right.gif" width="300"/>
|
|
44
|
-
</a>
|
|
45
|
-
<a href="./example/src/stack/index.tsx">
|
|
46
|
-
<img src="assets/stack-vertical-left.gif" width="300"/>
|
|
47
|
-
</a>
|
|
48
|
-
<a href="./example/src/stack/index.tsx">
|
|
49
|
-
<img src="assets/stack-vertical-right.gif" width="300"/>
|
|
50
|
-
</a>
|
|
51
|
-
</p>
|
|
26
|
+
| <img src="assets/normal-horizontal.gif"/> | <img src="assets/normal-vertical.gif"/> | <img src="assets/parallax-horizontal.gif"/> |
|
|
27
|
+
| :--------------------------------------------------------------: | :---------------------------------------------------------------: | :----------------------------------------------------------------: |
|
|
28
|
+
| <a href="./example/src/normal/index.tsx">normal-horizontal</a> | <a href="./example/src/normal/index.tsx">normal-vertical</a> | <a href="./example/src/parallax/index.tsx">parallax-horizontal</a> |
|
|
29
|
+
| <img src="assets/parallax-vertical.gif"/> | <img src="assets/stack-horizontal-left.gif"/> | <img src="assets/stack-horizontal-right.gif"/> |
|
|
30
|
+
| <a href="./example/src/parallax/index.tsx">parallax-vertical</a> | <a href="./example/src/stack/index.tsx">stack-horizontal-left</a> | <a href="./example/src/stack/index.tsx">stack-horizontal-right</a> |
|
|
31
|
+
| <img src="assets/stack-vertical-left.gif"/> | <img src="assets/stack-vertical-right.gif"/> | <img src="assets/stack-horizontal-right.gif"/> |
|
|
32
|
+
| <a href="./example/src/stack/index.tsx">stack-vertical-left</a> | <a href="./example/src/stack/index.tsx">stack-vertical-right</a> | <a href="./example/src/stack/index.tsx">stack-horizontal-right</a> |
|
|
52
33
|
|
|
53
34
|
> 现在你可以和我们一起来制作酷炫的动画了！ 非常简单! [[详情]](./docs/custom-animation.zh-CN.md)
|
|
54
35
|
|
|
55
|
-
<
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
</a>
|
|
65
|
-
<a href="./example/src/rotate-scale-fade-in-out/index.tsx">
|
|
66
|
-
<img src="assets/rotate-scale-fade-in-out.gif" width="300"/>
|
|
67
|
-
</a>
|
|
68
|
-
<a href="./example/src/rotate-in-out/index.tsx">
|
|
69
|
-
<img src="assets/rotate-in-out.gif" width="300"/>
|
|
70
|
-
</a>
|
|
71
|
-
<a href="./example/src/anim-tab-bar/index.tsx">
|
|
72
|
-
<img src="assets/anim-tab-bar.gif" width="300"/>
|
|
73
|
-
</a>
|
|
74
|
-
<a href="./example/src/marquee/index.tsx">
|
|
75
|
-
<img src="assets/marquee.gif" width="300"/>
|
|
76
|
-
</a>
|
|
77
|
-
<a href="./example/src/multiple/index.tsx">
|
|
78
|
-
<img src="assets/multiple.gif" width="300"/>
|
|
79
|
-
</a>
|
|
80
|
-
<br/>
|
|
81
|
-
<a href="./example/src/flow/index.tsx">
|
|
82
|
-
<img src="assets/flow.gif" width="300"/>
|
|
83
|
-
</a>
|
|
84
|
-
<br/>
|
|
85
|
-
<a href="./example/src/parallax-layers/index.tsx">
|
|
86
|
-
<img src="assets/parallax-layers.gif" width="300"/>
|
|
87
|
-
</a>
|
|
88
|
-
</p>
|
|
36
|
+
| <img src="assets/advanced-parallax.gif"/> | <img src="assets/pause-advanced-parallax.gif"/> | <img src="assets/scale-fade-in-out.gif"/> |
|
|
37
|
+
| :-------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------: | :-----------------------------------------------------------------------: |
|
|
38
|
+
| <a href="./example/src/advanced-parallax/index.tsx">advanced-parallax</a> | <a href="./example/src/pause-advanced-parallax/index.tsx">pause-advanced-parallax</a> | <a href="./example/src/scale-fade-in-out/index.tsx">scale-fade-in-out</a> |
|
|
39
|
+
| <img src="assets/rotate-scale-fade-in-out.gif"/> | <img src="assets/rotate-in-out.gif"/> | <img src="assets/anim-tab-bar.gif"/> |
|
|
40
|
+
| <a href="./example/src/rotate-scale-fade-in-out/index.tsx">rotate-scale-fade-in-out</a> | <a href="./example/src/rotate-in-out/index.tsx">rotate-in-out</a> | <a href="./example/src/anim-tab-bar/index.tsx">anim-tab-bar</a> |
|
|
41
|
+
| <img src="assets/marquee.gif"/> | <img src="assets/multiple.gif"/> | |
|
|
42
|
+
| <a href="./example/src/marquee/index.tsx">marquee</a> | <a href="./example/src/multiple/index.tsx">multiple</a> | |
|
|
43
|
+
| <img src="assets/parallax-layers.gif"/> | <img src="assets/flow.gif"/> | |
|
|
44
|
+
| <a href="./example/src/parallax-layers/index.tsx">parallax-layers</a> | <a href="./example/src/flow/index.tsx">flow</a> | |
|
|
89
45
|
|
|
90
46
|
## 目录
|
|
91
47
|
|
|
@@ -186,9 +142,7 @@ yarn web:pretty
|
|
|
186
142
|
## 赞助商
|
|
187
143
|
|
|
188
144
|
<p align="center">
|
|
189
|
-
<
|
|
190
|
-
<img src='./sponsorkit/sponsors.svg'/>
|
|
191
|
-
</a>
|
|
145
|
+
<img src='./sponsorkit/sponsors.svg'/>
|
|
192
146
|
</p>
|
|
193
147
|
|
|
194
148
|
## 许可
|
package/lib/commonjs/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _Carousel=_interopRequireDefault(require("./Carousel"));var _default=_Carousel.default;exports.default=_default;
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _Carousel=_interopRequireDefault(require("./Carousel"));if(!('__reanimatedWorkletInit'in global)){(0,_extends2.default)(global,{__reanimatedWorkletInit:function __reanimatedWorkletInit(){}});}var _default=_Carousel.default;exports.default=_default;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["Carousel"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["global","__reanimatedWorkletInit","Carousel"],"mappings":"mPAKA,4DALA,GAAI,EAAE,2BAA6BA,CAAAA,MAA/B,CAAJ,CAA4C,CACxC,sBAAcA,MAAd,CAAsB,CAAEC,uBAAuB,CAAE,kCAAM,CAAE,CAAnC,CAAtB,EACH,C,aAKcC,iB","sourcesContent":["if (!('__reanimatedWorkletInit' in global)) {\n Object.assign(global, { __reanimatedWorkletInit: () => {} });\n}\n\nexport type { TCarouselProps, ICarouselInstance } from './types';\nimport Carousel from './Carousel';\n\nexport default Carousel;\n"]}
|
package/lib/module/index.js
CHANGED
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["Carousel"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["global","Object","assign","__reanimatedWorkletInit","Carousel"],"mappings":"AAAA,IAAI,EAAE,6BAA6BA,MAA/B,CAAJ,EAA4C;AACxCC,EAAAA,MAAM,CAACC,MAAP,CAAcF,MAAd,EAAsB;AAAEG,IAAAA,uBAAuB,EAAE,MAAM,CAAE;AAAnC,GAAtB;AACH;;AAGD,OAAOC,QAAP,MAAqB,YAArB;AAEA,eAAeA,QAAf","sourcesContent":["if (!('__reanimatedWorkletInit' in global)) {\n Object.assign(global, { __reanimatedWorkletInit: () => {} });\n}\n\nexport type { TCarouselProps, ICarouselInstance } from './types';\nimport Carousel from './Carousel';\n\nexport default Carousel;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-reanimated-carousel",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.6.0",
|
|
4
4
|
"description": "Simple carousel component.fully implemented using Reanimated 2.Infinitely scrolling, very smooth.",
|
|
5
5
|
"main": "lib/commonjs/index",
|
|
6
6
|
"types": "lib/typescript/index.d.ts",
|