@react-native-ohos/react-native-scrollable-tab-view 1.0.1-rc.1
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 +112 -0
- package/lib/commonjs/Button.android.js +17 -0
- package/lib/commonjs/Button.android.js.map +1 -0
- package/lib/commonjs/Button.ios.js +13 -0
- package/lib/commonjs/Button.ios.js.map +1 -0
- package/lib/commonjs/DefaultTabBar.js +113 -0
- package/lib/commonjs/DefaultTabBar.js.map +1 -0
- package/lib/commonjs/SceneComponent.js +23 -0
- package/lib/commonjs/SceneComponent.js.map +1 -0
- package/lib/commonjs/ScrollableTabBar.js +258 -0
- package/lib/commonjs/ScrollableTabBar.js.map +1 -0
- package/lib/commonjs/StaticContainer.js +17 -0
- package/lib/commonjs/StaticContainer.js.map +1 -0
- package/lib/commonjs/index.js +419 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/react-native-scrollable-tab-view.iml +11 -0
- package/lib/module/Button.android.js +15 -0
- package/lib/module/Button.android.js.map +1 -0
- package/lib/module/Button.ios.js +11 -0
- package/lib/module/Button.ios.js.map +1 -0
- package/lib/module/DefaultTabBar.js +111 -0
- package/lib/module/DefaultTabBar.js.map +1 -0
- package/lib/module/SceneComponent.js +21 -0
- package/lib/module/SceneComponent.js.map +1 -0
- package/lib/module/ScrollableTabBar.js +256 -0
- package/lib/module/ScrollableTabBar.js.map +1 -0
- package/lib/module/StaticContainer.js +15 -0
- package/lib/module/StaticContainer.js.map +1 -0
- package/lib/module/index.js +417 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/react-native-scrollable-tab-view.iml +11 -0
- package/package.json +69 -0
- package/src/Button.android.js +18 -0
- package/src/Button.ios.js +14 -0
- package/src/DefaultTabBar.js +117 -0
- package/src/SceneComponent.js +17 -0
- package/src/ScrollableTabBar.js +252 -0
- package/src/StaticContainer.js +19 -0
- package/src/index.js +417 -0
- package/src/react-native-scrollable-tab-view.iml +11 -0
|
@@ -0,0 +1,417 @@
|
|
|
1
|
+
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
+
import ViewPager from "react-native-pager-view";
|
|
3
|
+
import ViewPagerAndroid from "react-native-pager-view";
|
|
4
|
+
const React = require('react');
|
|
5
|
+
const ReactNative = require('react-native');
|
|
6
|
+
const DeprecatedPropTypes = require('deprecated-react-native-prop-types');
|
|
7
|
+
const createReactClass = require('create-react-class');
|
|
8
|
+
const PropTypes = require('prop-types');
|
|
9
|
+
const {
|
|
10
|
+
Dimensions,
|
|
11
|
+
View,
|
|
12
|
+
Animated,
|
|
13
|
+
ScrollView,
|
|
14
|
+
Platform,
|
|
15
|
+
StyleSheet,
|
|
16
|
+
InteractionManager
|
|
17
|
+
} = ReactNative;
|
|
18
|
+
const TimerMixin = require('react-timer-mixin');
|
|
19
|
+
const SceneComponent = require('./SceneComponent');
|
|
20
|
+
const DefaultTabBar = require('./DefaultTabBar');
|
|
21
|
+
const ScrollableTabBar = require('./ScrollableTabBar');
|
|
22
|
+
const AnimatedViewPagerAndroid = Platform.OS === 'ios' ? undefined : Animated.createAnimatedComponent(ViewPager);
|
|
23
|
+
const ScrollableTabView = createReactClass({
|
|
24
|
+
displayName: "ScrollableTabView",
|
|
25
|
+
mixins: [TimerMixin],
|
|
26
|
+
statics: {
|
|
27
|
+
DefaultTabBar,
|
|
28
|
+
ScrollableTabBar
|
|
29
|
+
},
|
|
30
|
+
scrollOnMountCalled: false,
|
|
31
|
+
tabWillChangeWithoutGesture: false,
|
|
32
|
+
propTypes: {
|
|
33
|
+
tabBarPosition: PropTypes.oneOf(['top', 'bottom', 'overlayTop', 'overlayBottom']),
|
|
34
|
+
initialPage: PropTypes.number,
|
|
35
|
+
page: PropTypes.number,
|
|
36
|
+
onChangeTab: PropTypes.func,
|
|
37
|
+
onScroll: PropTypes.func,
|
|
38
|
+
renderTabBar: PropTypes.any,
|
|
39
|
+
tabBarUnderlineStyle: DeprecatedPropTypes.ViewPropTypes.style,
|
|
40
|
+
tabBarBackgroundColor: PropTypes.string,
|
|
41
|
+
tabBarActiveTextColor: PropTypes.string,
|
|
42
|
+
tabBarInactiveTextColor: PropTypes.string,
|
|
43
|
+
tabBarTextStyle: PropTypes.object,
|
|
44
|
+
style: DeprecatedPropTypes.ViewPropTypes.style,
|
|
45
|
+
contentProps: PropTypes.object,
|
|
46
|
+
scrollWithoutAnimation: PropTypes.bool,
|
|
47
|
+
locked: PropTypes.bool,
|
|
48
|
+
prerenderingSiblingsNumber: PropTypes.number
|
|
49
|
+
},
|
|
50
|
+
getDefaultProps() {
|
|
51
|
+
return {
|
|
52
|
+
tabBarPosition: 'top',
|
|
53
|
+
initialPage: 0,
|
|
54
|
+
page: -1,
|
|
55
|
+
onChangeTab: () => {},
|
|
56
|
+
onScroll: () => {},
|
|
57
|
+
contentProps: {},
|
|
58
|
+
scrollWithoutAnimation: false,
|
|
59
|
+
locked: false,
|
|
60
|
+
prerenderingSiblingsNumber: 0
|
|
61
|
+
};
|
|
62
|
+
},
|
|
63
|
+
getInitialState() {
|
|
64
|
+
const containerWidth = Dimensions.get('window').width;
|
|
65
|
+
let scrollValue;
|
|
66
|
+
let scrollXIOS;
|
|
67
|
+
let positionAndroid;
|
|
68
|
+
let offsetAndroid;
|
|
69
|
+
if (Platform.OS === 'ios') {
|
|
70
|
+
scrollXIOS = new Animated.Value(this.props.initialPage * containerWidth);
|
|
71
|
+
const containerWidthAnimatedValue = new Animated.Value(containerWidth);
|
|
72
|
+
// Need to call __makeNative manually to avoid a native animated bug. See
|
|
73
|
+
// https://github.com/facebook/react-native/pull/14435
|
|
74
|
+
containerWidthAnimatedValue.__makeNative();
|
|
75
|
+
scrollValue = Animated.divide(scrollXIOS, containerWidthAnimatedValue);
|
|
76
|
+
const callListeners = this._polyfillAnimatedValue(scrollValue);
|
|
77
|
+
scrollXIOS.addListener(({
|
|
78
|
+
value
|
|
79
|
+
}) => callListeners(value / this.state.containerWidth));
|
|
80
|
+
} else {
|
|
81
|
+
positionAndroid = new Animated.Value(this.props.initialPage);
|
|
82
|
+
offsetAndroid = new Animated.Value(0);
|
|
83
|
+
scrollValue = Animated.add(positionAndroid, offsetAndroid);
|
|
84
|
+
const callListeners = this._polyfillAnimatedValue(scrollValue);
|
|
85
|
+
let positionAndroidValue = this.props.initialPage;
|
|
86
|
+
let offsetAndroidValue = 0;
|
|
87
|
+
positionAndroid.addListener(({
|
|
88
|
+
value
|
|
89
|
+
}) => {
|
|
90
|
+
positionAndroidValue = value;
|
|
91
|
+
callListeners(positionAndroidValue + offsetAndroidValue);
|
|
92
|
+
});
|
|
93
|
+
offsetAndroid.addListener(({
|
|
94
|
+
value
|
|
95
|
+
}) => {
|
|
96
|
+
offsetAndroidValue = value;
|
|
97
|
+
callListeners(positionAndroidValue + offsetAndroidValue);
|
|
98
|
+
});
|
|
99
|
+
}
|
|
100
|
+
return {
|
|
101
|
+
currentPage: this.props.initialPage,
|
|
102
|
+
scrollValue,
|
|
103
|
+
scrollXIOS,
|
|
104
|
+
positionAndroid,
|
|
105
|
+
offsetAndroid,
|
|
106
|
+
containerWidth,
|
|
107
|
+
sceneKeys: this.newSceneKeys({
|
|
108
|
+
currentPage: this.props.initialPage
|
|
109
|
+
})
|
|
110
|
+
};
|
|
111
|
+
},
|
|
112
|
+
componentDidUpdate(prevProps) {
|
|
113
|
+
if (this.props.children !== prevProps.children) {
|
|
114
|
+
this.updateSceneKeys({
|
|
115
|
+
page: this.state.currentPage,
|
|
116
|
+
children: this.props.children
|
|
117
|
+
});
|
|
118
|
+
}
|
|
119
|
+
if (this.props.page >= 0 && this.props.page !== this.state.currentPage) {
|
|
120
|
+
this.goToPage(this.props.page);
|
|
121
|
+
}
|
|
122
|
+
},
|
|
123
|
+
componentWillUnmount() {
|
|
124
|
+
if (Platform.OS === 'ios') {
|
|
125
|
+
this.state.scrollXIOS.removeAllListeners();
|
|
126
|
+
} else {
|
|
127
|
+
this.state.positionAndroid.removeAllListeners();
|
|
128
|
+
this.state.offsetAndroid.removeAllListeners();
|
|
129
|
+
}
|
|
130
|
+
},
|
|
131
|
+
goToPage(pageNumber) {
|
|
132
|
+
if (Platform.OS === 'ios') {
|
|
133
|
+
const offset = pageNumber * this.state.containerWidth;
|
|
134
|
+
if (this.scrollView) {
|
|
135
|
+
this.scrollView.scrollTo({
|
|
136
|
+
x: offset,
|
|
137
|
+
y: 0,
|
|
138
|
+
animated: !this.props.scrollWithoutAnimation
|
|
139
|
+
});
|
|
140
|
+
}
|
|
141
|
+
} else {
|
|
142
|
+
if (this.scrollView) {
|
|
143
|
+
this.tabWillChangeWithoutGesture = true;
|
|
144
|
+
if (this.props.scrollWithoutAnimation) {
|
|
145
|
+
this.scrollView.setPageWithoutAnimation(pageNumber);
|
|
146
|
+
} else {
|
|
147
|
+
this.scrollView.setPage(pageNumber);
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
const currentPage = this.state.currentPage;
|
|
152
|
+
this.updateSceneKeys({
|
|
153
|
+
page: pageNumber,
|
|
154
|
+
callback: this._onChangeTab.bind(this, currentPage, pageNumber)
|
|
155
|
+
});
|
|
156
|
+
},
|
|
157
|
+
renderTabBar(props) {
|
|
158
|
+
if (this.props.renderTabBar === false) {
|
|
159
|
+
return null;
|
|
160
|
+
} else if (this.props.renderTabBar) {
|
|
161
|
+
return React.cloneElement(this.props.renderTabBar(props), props);
|
|
162
|
+
} else {
|
|
163
|
+
return /*#__PURE__*/React.createElement(DefaultTabBar, props);
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
|
+
updateSceneKeys({
|
|
167
|
+
page,
|
|
168
|
+
children = this.props.children,
|
|
169
|
+
callback = () => {}
|
|
170
|
+
}) {
|
|
171
|
+
let newKeys = this.newSceneKeys({
|
|
172
|
+
previousKeys: this.state.sceneKeys,
|
|
173
|
+
currentPage: page,
|
|
174
|
+
children
|
|
175
|
+
});
|
|
176
|
+
this.setState({
|
|
177
|
+
currentPage: page,
|
|
178
|
+
sceneKeys: newKeys
|
|
179
|
+
});
|
|
180
|
+
// fixed: 修复切换tab会闪烁的问题,callback中不依赖于最新的state,因此可以不用放在setState回调中
|
|
181
|
+
callback === null || callback === void 0 || callback();
|
|
182
|
+
},
|
|
183
|
+
newSceneKeys({
|
|
184
|
+
previousKeys = [],
|
|
185
|
+
currentPage = 0,
|
|
186
|
+
children = this.props.children
|
|
187
|
+
}) {
|
|
188
|
+
let newKeys = [];
|
|
189
|
+
this._children(children).forEach((child, idx) => {
|
|
190
|
+
let key = this._makeSceneKey(child, idx);
|
|
191
|
+
if (this._keyExists(previousKeys, key) || this._shouldRenderSceneKey(idx, currentPage)) {
|
|
192
|
+
newKeys.push(key);
|
|
193
|
+
}
|
|
194
|
+
});
|
|
195
|
+
return newKeys;
|
|
196
|
+
},
|
|
197
|
+
// Animated.add and Animated.divide do not currently support listeners so
|
|
198
|
+
// we have to polyfill it here since a lot of code depends on being able
|
|
199
|
+
// to add a listener to `scrollValue`. See https://github.com/facebook/react-native/pull/12620.
|
|
200
|
+
_polyfillAnimatedValue(animatedValue) {
|
|
201
|
+
const listeners = new Set();
|
|
202
|
+
const addListener = listener => {
|
|
203
|
+
listeners.add(listener);
|
|
204
|
+
};
|
|
205
|
+
const removeListener = listener => {
|
|
206
|
+
listeners.delete(listener);
|
|
207
|
+
};
|
|
208
|
+
const removeAllListeners = () => {
|
|
209
|
+
listeners.clear();
|
|
210
|
+
};
|
|
211
|
+
animatedValue.addListener = addListener;
|
|
212
|
+
animatedValue.removeListener = removeListener;
|
|
213
|
+
animatedValue.removeAllListeners = removeAllListeners;
|
|
214
|
+
return value => listeners.forEach(listener => listener({
|
|
215
|
+
value
|
|
216
|
+
}));
|
|
217
|
+
},
|
|
218
|
+
_shouldRenderSceneKey(idx, currentPageKey) {
|
|
219
|
+
let numOfSibling = this.props.prerenderingSiblingsNumber;
|
|
220
|
+
return idx < currentPageKey + numOfSibling + 1 && idx > currentPageKey - numOfSibling - 1;
|
|
221
|
+
},
|
|
222
|
+
_keyExists(sceneKeys, key) {
|
|
223
|
+
return sceneKeys.find(sceneKey => key === sceneKey);
|
|
224
|
+
},
|
|
225
|
+
_makeSceneKey(child, idx) {
|
|
226
|
+
return child.props.tabLabel + '_' + idx;
|
|
227
|
+
},
|
|
228
|
+
renderScrollableContent() {
|
|
229
|
+
if (Platform.OS === 'ios') {
|
|
230
|
+
const scenes = this._composeScenes();
|
|
231
|
+
return /*#__PURE__*/React.createElement(Animated.ScrollView, _extends({
|
|
232
|
+
horizontal: true,
|
|
233
|
+
pagingEnabled: true,
|
|
234
|
+
automaticallyAdjustContentInsets: false,
|
|
235
|
+
contentOffset: {
|
|
236
|
+
x: this.props.initialPage * this.state.containerWidth
|
|
237
|
+
},
|
|
238
|
+
ref: scrollView => {
|
|
239
|
+
this.scrollView = scrollView;
|
|
240
|
+
},
|
|
241
|
+
onScroll: Animated.event([{
|
|
242
|
+
nativeEvent: {
|
|
243
|
+
contentOffset: {
|
|
244
|
+
x: this.state.scrollXIOS
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
}], {
|
|
248
|
+
useNativeDriver: false,
|
|
249
|
+
listener: this._onScroll
|
|
250
|
+
}),
|
|
251
|
+
onMomentumScrollBegin: this._onMomentumScrollBeginAndEnd,
|
|
252
|
+
onMomentumScrollEnd: this._onMomentumScrollBeginAndEnd,
|
|
253
|
+
scrollEventThrottle: 16,
|
|
254
|
+
scrollsToTop: false,
|
|
255
|
+
showsHorizontalScrollIndicator: false,
|
|
256
|
+
scrollEnabled: !this.props.locked,
|
|
257
|
+
directionalLockEnabled: true,
|
|
258
|
+
alwaysBounceVertical: false,
|
|
259
|
+
keyboardDismissMode: "on-drag"
|
|
260
|
+
}, this.props.contentProps), scenes);
|
|
261
|
+
} else {
|
|
262
|
+
const scenes = this._composeScenes();
|
|
263
|
+
return /*#__PURE__*/React.createElement(AnimatedViewPagerAndroid, _extends({
|
|
264
|
+
key: this._children().length,
|
|
265
|
+
style: styles.scrollableContentAndroid,
|
|
266
|
+
initialPage: this.props.initialPage,
|
|
267
|
+
onPageSelected: this._updateSelectedPage,
|
|
268
|
+
keyboardDismissMode: "on-drag",
|
|
269
|
+
scrollEnabled: !this.props.locked,
|
|
270
|
+
onPageScroll: Animated.event([{
|
|
271
|
+
nativeEvent: {
|
|
272
|
+
position: this.state.positionAndroid,
|
|
273
|
+
offset: this.state.offsetAndroid
|
|
274
|
+
}
|
|
275
|
+
}], {
|
|
276
|
+
useNativeDriver: false,
|
|
277
|
+
listener: this._onScroll
|
|
278
|
+
}),
|
|
279
|
+
ref: scrollView => {
|
|
280
|
+
this.scrollView = scrollView;
|
|
281
|
+
}
|
|
282
|
+
}, this.props.contentProps), scenes);
|
|
283
|
+
}
|
|
284
|
+
},
|
|
285
|
+
_composeScenes() {
|
|
286
|
+
return this._children().map((child, idx) => {
|
|
287
|
+
let key = this._makeSceneKey(child, idx);
|
|
288
|
+
return /*#__PURE__*/React.createElement(SceneComponent, {
|
|
289
|
+
key: child.key,
|
|
290
|
+
shouldUpdated: this._shouldRenderSceneKey(idx, this.state.currentPage),
|
|
291
|
+
style: {
|
|
292
|
+
width: this.state.containerWidth
|
|
293
|
+
}
|
|
294
|
+
}, this._keyExists(this.state.sceneKeys, key) ? child : /*#__PURE__*/React.createElement(View, {
|
|
295
|
+
tabLabel: child.props.tabLabel
|
|
296
|
+
}));
|
|
297
|
+
});
|
|
298
|
+
},
|
|
299
|
+
_onMomentumScrollBeginAndEnd(e) {
|
|
300
|
+
const offsetX = e.nativeEvent.contentOffset.x;
|
|
301
|
+
const page = Math.round(offsetX / this.state.containerWidth);
|
|
302
|
+
if (this.state.currentPage !== page) {
|
|
303
|
+
this._updateSelectedPage(page);
|
|
304
|
+
}
|
|
305
|
+
},
|
|
306
|
+
_updateSelectedPage(nextPage) {
|
|
307
|
+
let localNextPage = nextPage;
|
|
308
|
+
if (typeof localNextPage === 'object') {
|
|
309
|
+
localNextPage = nextPage.nativeEvent.position;
|
|
310
|
+
}
|
|
311
|
+
const currentPage = this.state.currentPage;
|
|
312
|
+
!this.tabWillChangeWithoutGesture && this.updateSceneKeys({
|
|
313
|
+
page: localNextPage,
|
|
314
|
+
callback: this._onChangeTab.bind(this, currentPage, localNextPage)
|
|
315
|
+
});
|
|
316
|
+
this.tabWillChangeWithoutGesture = false;
|
|
317
|
+
},
|
|
318
|
+
_onChangeTab(prevPage, currentPage) {
|
|
319
|
+
this.props.onChangeTab({
|
|
320
|
+
i: currentPage,
|
|
321
|
+
ref: this._children()[currentPage],
|
|
322
|
+
from: prevPage
|
|
323
|
+
});
|
|
324
|
+
},
|
|
325
|
+
_onScroll(e) {
|
|
326
|
+
if (Platform.OS === 'ios') {
|
|
327
|
+
const offsetX = e.nativeEvent.contentOffset.x;
|
|
328
|
+
if (offsetX === 0 && !this.scrollOnMountCalled) {
|
|
329
|
+
this.scrollOnMountCalled = true;
|
|
330
|
+
} else {
|
|
331
|
+
this.props.onScroll(offsetX / this.state.containerWidth);
|
|
332
|
+
}
|
|
333
|
+
} else {
|
|
334
|
+
const {
|
|
335
|
+
position,
|
|
336
|
+
offset
|
|
337
|
+
} = e.nativeEvent;
|
|
338
|
+
this.props.onScroll(position + offset);
|
|
339
|
+
}
|
|
340
|
+
},
|
|
341
|
+
_handleLayout(e) {
|
|
342
|
+
const {
|
|
343
|
+
width
|
|
344
|
+
} = e.nativeEvent.layout;
|
|
345
|
+
if (!width || width <= 0 || Math.round(width) === Math.round(this.state.containerWidth)) {
|
|
346
|
+
return;
|
|
347
|
+
}
|
|
348
|
+
if (Platform.OS === 'ios') {
|
|
349
|
+
const containerWidthAnimatedValue = new Animated.Value(width);
|
|
350
|
+
// Need to call __makeNative manually to avoid a native animated bug. See
|
|
351
|
+
// https://github.com/facebook/react-native/pull/14435
|
|
352
|
+
containerWidthAnimatedValue.__makeNative();
|
|
353
|
+
scrollValue = Animated.divide(this.state.scrollXIOS, containerWidthAnimatedValue);
|
|
354
|
+
this.setState({
|
|
355
|
+
containerWidth: width,
|
|
356
|
+
scrollValue
|
|
357
|
+
});
|
|
358
|
+
} else {
|
|
359
|
+
this.setState({
|
|
360
|
+
containerWidth: width
|
|
361
|
+
});
|
|
362
|
+
}
|
|
363
|
+
this.requestAnimationFrame(() => {
|
|
364
|
+
this.goToPage(this.state.currentPage);
|
|
365
|
+
});
|
|
366
|
+
},
|
|
367
|
+
_children(children = this.props.children) {
|
|
368
|
+
return React.Children.map(children, child => child);
|
|
369
|
+
},
|
|
370
|
+
render() {
|
|
371
|
+
let overlayTabs = this.props.tabBarPosition === 'overlayTop' || this.props.tabBarPosition === 'overlayBottom';
|
|
372
|
+
let tabBarProps = {
|
|
373
|
+
goToPage: this.goToPage,
|
|
374
|
+
tabs: this._children().map(child => child.props.tabLabel),
|
|
375
|
+
activeTab: this.state.currentPage,
|
|
376
|
+
scrollValue: this.state.scrollValue,
|
|
377
|
+
containerWidth: this.state.containerWidth
|
|
378
|
+
};
|
|
379
|
+
if (this.props.tabBarBackgroundColor) {
|
|
380
|
+
tabBarProps.backgroundColor = this.props.tabBarBackgroundColor;
|
|
381
|
+
}
|
|
382
|
+
if (this.props.tabBarActiveTextColor) {
|
|
383
|
+
tabBarProps.activeTextColor = this.props.tabBarActiveTextColor;
|
|
384
|
+
}
|
|
385
|
+
if (this.props.tabBarInactiveTextColor) {
|
|
386
|
+
tabBarProps.inactiveTextColor = this.props.tabBarInactiveTextColor;
|
|
387
|
+
}
|
|
388
|
+
if (this.props.tabBarTextStyle) {
|
|
389
|
+
tabBarProps.textStyle = this.props.tabBarTextStyle;
|
|
390
|
+
}
|
|
391
|
+
if (this.props.tabBarUnderlineStyle) {
|
|
392
|
+
tabBarProps.underlineStyle = this.props.tabBarUnderlineStyle;
|
|
393
|
+
}
|
|
394
|
+
if (overlayTabs) {
|
|
395
|
+
tabBarProps.style = {
|
|
396
|
+
position: 'absolute',
|
|
397
|
+
left: 0,
|
|
398
|
+
right: 0,
|
|
399
|
+
[this.props.tabBarPosition === 'overlayTop' ? 'top' : 'bottom']: 0
|
|
400
|
+
};
|
|
401
|
+
}
|
|
402
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
403
|
+
style: [styles.container, this.props.style],
|
|
404
|
+
onLayout: this._handleLayout
|
|
405
|
+
}, this.props.tabBarPosition === 'top' && this.renderTabBar(tabBarProps), this.renderScrollableContent(), (this.props.tabBarPosition === 'bottom' || overlayTabs) && this.renderTabBar(tabBarProps));
|
|
406
|
+
}
|
|
407
|
+
});
|
|
408
|
+
module.exports = ScrollableTabView;
|
|
409
|
+
const styles = StyleSheet.create({
|
|
410
|
+
container: {
|
|
411
|
+
flex: 1
|
|
412
|
+
},
|
|
413
|
+
scrollableContentAndroid: {
|
|
414
|
+
flex: 1
|
|
415
|
+
}
|
|
416
|
+
});
|
|
417
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["ViewPager","ViewPagerAndroid","React","require","ReactNative","DeprecatedPropTypes","createReactClass","PropTypes","Dimensions","View","Animated","ScrollView","Platform","StyleSheet","InteractionManager","TimerMixin","SceneComponent","DefaultTabBar","ScrollableTabBar","AnimatedViewPagerAndroid","OS","undefined","createAnimatedComponent","ScrollableTabView","displayName","mixins","statics","scrollOnMountCalled","tabWillChangeWithoutGesture","propTypes","tabBarPosition","oneOf","initialPage","number","page","onChangeTab","func","onScroll","renderTabBar","any","tabBarUnderlineStyle","ViewPropTypes","style","tabBarBackgroundColor","string","tabBarActiveTextColor","tabBarInactiveTextColor","tabBarTextStyle","object","contentProps","scrollWithoutAnimation","bool","locked","prerenderingSiblingsNumber","getDefaultProps","getInitialState","containerWidth","get","width","scrollValue","scrollXIOS","positionAndroid","offsetAndroid","Value","props","containerWidthAnimatedValue","__makeNative","divide","callListeners","_polyfillAnimatedValue","addListener","value","state","add","positionAndroidValue","offsetAndroidValue","currentPage","sceneKeys","newSceneKeys","componentDidUpdate","prevProps","children","updateSceneKeys","goToPage","componentWillUnmount","removeAllListeners","pageNumber","offset","scrollView","scrollTo","x","y","animated","setPageWithoutAnimation","setPage","callback","_onChangeTab","bind","cloneElement","createElement","newKeys","previousKeys","setState","_children","forEach","child","idx","key","_makeSceneKey","_keyExists","_shouldRenderSceneKey","push","animatedValue","listeners","Set","listener","removeListener","delete","clear","currentPageKey","numOfSibling","find","sceneKey","tabLabel","renderScrollableContent","scenes","_composeScenes","_extends","horizontal","pagingEnabled","automaticallyAdjustContentInsets","contentOffset","ref","event","nativeEvent","useNativeDriver","_onScroll","onMomentumScrollBegin","_onMomentumScrollBeginAndEnd","onMomentumScrollEnd","scrollEventThrottle","scrollsToTop","showsHorizontalScrollIndicator","scrollEnabled","directionalLockEnabled","alwaysBounceVertical","keyboardDismissMode","length","styles","scrollableContentAndroid","onPageSelected","_updateSelectedPage","onPageScroll","position","map","shouldUpdated","e","offsetX","Math","round","nextPage","localNextPage","prevPage","i","from","_handleLayout","layout","requestAnimationFrame","Children","render","overlayTabs","tabBarProps","tabs","activeTab","backgroundColor","activeTextColor","inactiveTextColor","textStyle","underlineStyle","left","right","container","onLayout","module","exports","create","flex"],"sourceRoot":"..\\..\\src","sources":["index.js"],"mappings":";AAAA,OAAOA,SAAS,MAAM,yBAAyB;AAC/C,OAAOC,gBAAgB,MAAM,yBAAyB;AAEtD,MAAMC,KAAK,GAAGC,OAAO,CAAC,OAAO,CAAC;AAC9B,MAAMC,WAAW,GAAGD,OAAO,CAAC,cAAc,CAAC;AAC3C,MAAME,mBAAmB,GAAGF,OAAO,CAAC,oCAAoC,CAAC;AACzE,MAAMG,gBAAgB,GAAGH,OAAO,CAAC,oBAAoB,CAAC;AACtD,MAAMI,SAAS,GAAGJ,OAAO,CAAC,YAAY,CAAC;AACvC,MAAM;EACJK,UAAU;EACVC,IAAI;EACJC,QAAQ;EACRC,UAAU;EACVC,QAAQ;EACRC,UAAU;EACVC;AACF,CAAC,GAAGV,WAAW;AAEf,MAAMW,UAAU,GAAGZ,OAAO,CAAC,mBAAmB,CAAC;AAE/C,MAAMa,cAAc,GAAGb,OAAO,CAAC,kBAAkB,CAAC;AAClD,MAAMc,aAAa,GAAGd,OAAO,CAAC,iBAAiB,CAAC;AAChD,MAAMe,gBAAgB,GAAGf,OAAO,CAAC,oBAAoB,CAAC;AAEtD,MAAMgB,wBAAwB,GAAGP,QAAQ,CAACQ,EAAE,KAAK,KAAK,GAAGC,SAAS,GAAGX,QAAQ,CAACY,uBAAuB,CAACtB,SAAS,CAAC;AAEhH,MAAMuB,iBAAiB,GAAGjB,gBAAgB,CAAC;EAAAkB,WAAA;EACzCC,MAAM,EAAE,CAACV,UAAU,CAAG;EACtBW,OAAO,EAAE;IACPT,aAAa;IACbC;EACF,CAAC;EACDS,mBAAmB,EAAE,KAAK;EAC1BC,2BAA2B,EAAE,KAAK;EAElCC,SAAS,EAAE;IACTC,cAAc,EAAEvB,SAAS,CAACwB,KAAK,CAAC,CAAC,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,eAAe,CAAG,CAAC;IACnFC,WAAW,EAAEzB,SAAS,CAAC0B,MAAM;IAC7BC,IAAI,EAAE3B,SAAS,CAAC0B,MAAM;IACtBE,WAAW,EAAE5B,SAAS,CAAC6B,IAAI;IAC3BC,QAAQ,EAAE9B,SAAS,CAAC6B,IAAI;IACxBE,YAAY,EAAE/B,SAAS,CAACgC,GAAG;IAC3BC,oBAAoB,EAAEnC,mBAAmB,CAACoC,aAAa,CAACC,KAAK;IAC7DC,qBAAqB,EAAEpC,SAAS,CAACqC,MAAM;IACvCC,qBAAqB,EAAEtC,SAAS,CAACqC,MAAM;IACvCE,uBAAuB,EAAEvC,SAAS,CAACqC,MAAM;IACzCG,eAAe,EAAExC,SAAS,CAACyC,MAAM;IACjCN,KAAK,EAAErC,mBAAmB,CAACoC,aAAa,CAACC,KAAK;IAC9CO,YAAY,EAAE1C,SAAS,CAACyC,MAAM;IAC9BE,sBAAsB,EAAE3C,SAAS,CAAC4C,IAAI;IACtCC,MAAM,EAAE7C,SAAS,CAAC4C,IAAI;IACtBE,0BAA0B,EAAE9C,SAAS,CAAC0B;EACxC,CAAC;EAEDqB,eAAeA,CAAA,EAAG;IAChB,OAAO;MACLxB,cAAc,EAAE,KAAK;MACrBE,WAAW,EAAE,CAAC;MACdE,IAAI,EAAE,CAAC,CAAC;MACRC,WAAW,EAAEA,CAAA,KAAM,CAAC,CAAC;MACrBE,QAAQ,EAAEA,CAAA,KAAM,CAAC,CAAC;MAClBY,YAAY,EAAE,CAAC,CAAC;MAChBC,sBAAsB,EAAE,KAAK;MAC7BE,MAAM,EAAE,KAAK;MACbC,0BAA0B,EAAE;IAC9B,CAAC;EACH,CAAC;EAEDE,eAAeA,CAAA,EAAG;IAChB,MAAMC,cAAc,GAAGhD,UAAU,CAACiD,GAAG,CAAC,QAAQ,CAAC,CAACC,KAAK;IACrD,IAAIC,WAAW;IACf,IAAIC,UAAU;IACd,IAAIC,eAAe;IACnB,IAAIC,aAAa;IAEjB,IAAIlD,QAAQ,CAACQ,EAAE,KAAK,KAAK,EAAE;MACzBwC,UAAU,GAAG,IAAIlD,QAAQ,CAACqD,KAAK,CAAC,IAAI,CAACC,KAAK,CAAChC,WAAW,GAAGwB,cAAc,CAAC;MACxE,MAAMS,2BAA2B,GAAG,IAAIvD,QAAQ,CAACqD,KAAK,CAACP,cAAc,CAAC;MACtE;MACA;MACAS,2BAA2B,CAACC,YAAY,CAAC,CAAC;MAC1CP,WAAW,GAAGjD,QAAQ,CAACyD,MAAM,CAACP,UAAU,EAAEK,2BAA2B,CAAC;MAEtE,MAAMG,aAAa,GAAG,IAAI,CAACC,sBAAsB,CAACV,WAAW,CAAC;MAC9DC,UAAU,CAACU,WAAW,CACpB,CAAC;QAAEC;MAAO,CAAC,KAAKH,aAAa,CAACG,KAAK,GAAG,IAAI,CAACC,KAAK,CAAChB,cAAc,CACjE,CAAC;IACH,CAAC,MAAM;MACLK,eAAe,GAAG,IAAInD,QAAQ,CAACqD,KAAK,CAAC,IAAI,CAACC,KAAK,CAAChC,WAAW,CAAC;MAC5D8B,aAAa,GAAG,IAAIpD,QAAQ,CAACqD,KAAK,CAAC,CAAC,CAAC;MACrCJ,WAAW,GAAGjD,QAAQ,CAAC+D,GAAG,CAACZ,eAAe,EAAEC,aAAa,CAAC;MAE1D,MAAMM,aAAa,GAAG,IAAI,CAACC,sBAAsB,CAACV,WAAW,CAAC;MAC9D,IAAIe,oBAAoB,GAAG,IAAI,CAACV,KAAK,CAAChC,WAAW;MACjD,IAAI2C,kBAAkB,GAAG,CAAC;MAC1Bd,eAAe,CAACS,WAAW,CAAC,CAAC;QAAEC;MAAO,CAAC,KAAK;QAC1CG,oBAAoB,GAAGH,KAAK;QAC5BH,aAAa,CAACM,oBAAoB,GAAGC,kBAAkB,CAAC;MAC1D,CAAC,CAAC;MACFb,aAAa,CAACQ,WAAW,CAAC,CAAC;QAAEC;MAAO,CAAC,KAAK;QACxCI,kBAAkB,GAAGJ,KAAK;QAC1BH,aAAa,CAACM,oBAAoB,GAAGC,kBAAkB,CAAC;MAC1D,CAAC,CAAC;IACJ;IAEA,OAAO;MACLC,WAAW,EAAE,IAAI,CAACZ,KAAK,CAAChC,WAAW;MACnC2B,WAAW;MACXC,UAAU;MACVC,eAAe;MACfC,aAAa;MACbN,cAAc;MACdqB,SAAS,EAAE,IAAI,CAACC,YAAY,CAAC;QAAEF,WAAW,EAAE,IAAI,CAACZ,KAAK,CAAChC;MAAa,CAAC;IACvE,CAAC;EACH,CAAC;EAED+C,kBAAkBA,CAACC,SAAS,EAAE;IAC5B,IAAI,IAAI,CAAChB,KAAK,CAACiB,QAAQ,KAAKD,SAAS,CAACC,QAAQ,EAAE;MAC9C,IAAI,CAACC,eAAe,CAAC;QAAEhD,IAAI,EAAE,IAAI,CAACsC,KAAK,CAACI,WAAW;QAAEK,QAAQ,EAAE,IAAI,CAACjB,KAAK,CAACiB;MAAU,CAAC,CAAC;IACxF;IAEA,IAAI,IAAI,CAACjB,KAAK,CAAC9B,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC8B,KAAK,CAAC9B,IAAI,KAAK,IAAI,CAACsC,KAAK,CAACI,WAAW,EAAE;MACtE,IAAI,CAACO,QAAQ,CAAC,IAAI,CAACnB,KAAK,CAAC9B,IAAI,CAAC;IAChC;EACF,CAAC;EAEDkD,oBAAoBA,CAAA,EAAG;IACrB,IAAIxE,QAAQ,CAACQ,EAAE,KAAK,KAAK,EAAE;MACzB,IAAI,CAACoD,KAAK,CAACZ,UAAU,CAACyB,kBAAkB,CAAC,CAAC;IAC5C,CAAC,MAAM;MACL,IAAI,CAACb,KAAK,CAACX,eAAe,CAACwB,kBAAkB,CAAC,CAAC;MAC/C,IAAI,CAACb,KAAK,CAACV,aAAa,CAACuB,kBAAkB,CAAC,CAAC;IAC/C;EACF,CAAC;EAEDF,QAAQA,CAACG,UAAU,EAAE;IACnB,IAAI1E,QAAQ,CAACQ,EAAE,KAAK,KAAK,EAAE;MACzB,MAAMmE,MAAM,GAAGD,UAAU,GAAG,IAAI,CAACd,KAAK,CAAChB,cAAc;MACrD,IAAI,IAAI,CAACgC,UAAU,EAAE;QACnB,IAAI,CAACA,UAAU,CAACC,QAAQ,CAAC;UAACC,CAAC,EAAEH,MAAM;UAAEI,CAAC,EAAE,CAAC;UAAEC,QAAQ,EAAE,CAAC,IAAI,CAAC5B,KAAK,CAACd;QAAwB,CAAC,CAAC;MAC7F;IACF,CAAC,MAAM;MACL,IAAI,IAAI,CAACsC,UAAU,EAAE;QACnB,IAAI,CAAC5D,2BAA2B,GAAG,IAAI;QACvC,IAAI,IAAI,CAACoC,KAAK,CAACd,sBAAsB,EAAE;UACrC,IAAI,CAACsC,UAAU,CAACK,uBAAuB,CAACP,UAAU,CAAC;QACrD,CAAC,MAAM;UACL,IAAI,CAACE,UAAU,CAACM,OAAO,CAACR,UAAU,CAAC;QACrC;MACF;IACF;IAEA,MAAMV,WAAW,GAAG,IAAI,CAACJ,KAAK,CAACI,WAAW;IAC1C,IAAI,CAACM,eAAe,CAAC;MACnBhD,IAAI,EAAEoD,UAAU;MAChBS,QAAQ,EAAE,IAAI,CAACC,YAAY,CAACC,IAAI,CAAC,IAAI,EAAErB,WAAW,EAAEU,UAAU;IAChE,CAAC,CAAC;EACJ,CAAC;EAEDhD,YAAYA,CAAC0B,KAAK,EAAE;IAClB,IAAI,IAAI,CAACA,KAAK,CAAC1B,YAAY,KAAK,KAAK,EAAE;MACrC,OAAO,IAAI;IACb,CAAC,MAAM,IAAI,IAAI,CAAC0B,KAAK,CAAC1B,YAAY,EAAE;MAClC,OAAOpC,KAAK,CAACgG,YAAY,CAAC,IAAI,CAAClC,KAAK,CAAC1B,YAAY,CAAC0B,KAAK,CAAC,EAAEA,KAAK,CAAC;IAClE,CAAC,MAAM;MACL,oBAAO9D,KAAA,CAAAiG,aAAA,CAAClF,aAAa,EAAK+C,KAAQ,CAAC;IACrC;EACF,CAAC;EAEDkB,eAAeA,CAAC;IAAEhD,IAAI;IAAE+C,QAAQ,GAAG,IAAI,CAACjB,KAAK,CAACiB,QAAQ;IAAEc,QAAQ,GAAGA,CAAA,KAAM,CAAC;EAAG,CAAC,EAAE;IAC9E,IAAIK,OAAO,GAAG,IAAI,CAACtB,YAAY,CAAC;MAAEuB,YAAY,EAAE,IAAI,CAAC7B,KAAK,CAACK,SAAS;MAAED,WAAW,EAAE1C,IAAI;MAAE+C;IAAU,CAAC,CAAC;IACrG,IAAI,CAACqB,QAAQ,CAAC;MAAC1B,WAAW,EAAE1C,IAAI;MAAE2C,SAAS,EAAEuB;IAAQ,CAAC,CAAC;IACvD;IACAL,QAAQ,aAARA,QAAQ,eAARA,QAAQ,CAAG,CAAC;EACd,CAAC;EAEDjB,YAAYA,CAAC;IAAEuB,YAAY,GAAG,EAAE;IAAEzB,WAAW,GAAG,CAAC;IAAEK,QAAQ,GAAG,IAAI,CAACjB,KAAK,CAACiB;EAAU,CAAC,EAAE;IACpF,IAAImB,OAAO,GAAG,EAAE;IAChB,IAAI,CAACG,SAAS,CAACtB,QAAQ,CAAC,CAACuB,OAAO,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAK;MAC/C,IAAIC,GAAG,GAAG,IAAI,CAACC,aAAa,CAACH,KAAK,EAAEC,GAAG,CAAC;MACxC,IAAI,IAAI,CAACG,UAAU,CAACR,YAAY,EAAEM,GAAG,CAAC,IACpC,IAAI,CAACG,qBAAqB,CAACJ,GAAG,EAAE9B,WAAW,CAAC,EAAE;QAC9CwB,OAAO,CAACW,IAAI,CAACJ,GAAG,CAAC;MACnB;IACF,CAAC,CAAC;IACF,OAAOP,OAAO;EAChB,CAAC;EAED;EACA;EACA;EACA/B,sBAAsBA,CAAC2C,aAAa,EAAE;IAEpC,MAAMC,SAAS,GAAG,IAAIC,GAAG,CAAC,CAAC;IAC3B,MAAM5C,WAAW,GAAI6C,QAAQ,IAAK;MAChCF,SAAS,CAACxC,GAAG,CAAC0C,QAAQ,CAAC;IACzB,CAAC;IAED,MAAMC,cAAc,GAAID,QAAQ,IAAK;MACnCF,SAAS,CAACI,MAAM,CAACF,QAAQ,CAAC;IAC5B,CAAC;IAED,MAAM9B,kBAAkB,GAAGA,CAAA,KAAM;MAC/B4B,SAAS,CAACK,KAAK,CAAC,CAAC;IACnB,CAAC;IAEDN,aAAa,CAAC1C,WAAW,GAAGA,WAAW;IACvC0C,aAAa,CAACI,cAAc,GAAGA,cAAc;IAC7CJ,aAAa,CAAC3B,kBAAkB,GAAGA,kBAAkB;IAErD,OAAQd,KAAK,IAAK0C,SAAS,CAACT,OAAO,CAACW,QAAQ,IAAIA,QAAQ,CAAC;MAAE5C;IAAO,CAAC,CAAC,CAAC;EACvE,CAAC;EAEDuC,qBAAqBA,CAACJ,GAAG,EAAEa,cAAc,EAAE;IACzC,IAAIC,YAAY,GAAG,IAAI,CAACxD,KAAK,CAACX,0BAA0B;IACxD,OAAQqD,GAAG,GAAIa,cAAc,GAAGC,YAAY,GAAG,CAAE,IAC/Cd,GAAG,GAAIa,cAAc,GAAGC,YAAY,GAAG,CAAE;EAC7C,CAAC;EAEDX,UAAUA,CAAChC,SAAS,EAAE8B,GAAG,EAAE;IACzB,OAAO9B,SAAS,CAAC4C,IAAI,CAAEC,QAAQ,IAAKf,GAAG,KAAKe,QAAQ,CAAC;EACvD,CAAC;EAEDd,aAAaA,CAACH,KAAK,EAAEC,GAAG,EAAE;IACxB,OAAOD,KAAK,CAACzC,KAAK,CAAC2D,QAAQ,GAAG,GAAG,GAAGjB,GAAG;EACzC,CAAC;EAEDkB,uBAAuBA,CAAA,EAAG;IACxB,IAAIhH,QAAQ,CAACQ,EAAE,KAAK,KAAK,EAAE;MACzB,MAAMyG,MAAM,GAAG,IAAI,CAACC,cAAc,CAAC,CAAC;MACpC,oBAAO5H,KAAA,CAAAiG,aAAA,CAACzF,QAAQ,CAACC,UAAU,EAAAoH,QAAA;QACzBC,UAAU;QACVC,aAAa;QACbC,gCAAgC,EAAE,KAAM;QACxCC,aAAa,EAAE;UAAEzC,CAAC,EAAE,IAAI,CAAC1B,KAAK,CAAChC,WAAW,GAAG,IAAI,CAACwC,KAAK,CAAChB;QAAgB,CAAE;QAC1E4E,GAAG,EAAG5C,UAAU,IAAK;UAAE,IAAI,CAACA,UAAU,GAAGA,UAAU;QAAE,CAAE;QACvDnD,QAAQ,EAAE3B,QAAQ,CAAC2H,KAAK,CACtB,CAAC;UAAEC,WAAW,EAAE;YAAEH,aAAa,EAAE;cAAEzC,CAAC,EAAE,IAAI,CAAClB,KAAK,CAACZ;YAAY;UAAG;QAAG,CAAC,CAAG,EACvE;UAAE2E,eAAe,EAAE,KAAK;UAAEpB,QAAQ,EAAE,IAAI,CAACqB;QAAW,CACtD,CAAE;QACFC,qBAAqB,EAAE,IAAI,CAACC,4BAA6B;QACzDC,mBAAmB,EAAE,IAAI,CAACD,4BAA6B;QACvDE,mBAAmB,EAAE,EAAG;QACxBC,YAAY,EAAE,KAAM;QACpBC,8BAA8B,EAAE,KAAM;QACtCC,aAAa,EAAE,CAAC,IAAI,CAAC/E,KAAK,CAACZ,MAAO;QAClC4F,sBAAsB;QACtBC,oBAAoB,EAAE,KAAM;QAC5BC,mBAAmB,EAAC;MAAS,GACzB,IAAI,CAAClF,KAAK,CAACf,YAAY,GAExB4E,MACgB,CAAC;IACxB,CAAC,MAAM;MACL,MAAMA,MAAM,GAAG,IAAI,CAACC,cAAc,CAAC,CAAC;MACpC,oBAAO5H,KAAA,CAAAiG,aAAA,CAAChF,wBAAwB,EAAA4G,QAAA;QAC9BpB,GAAG,EAAE,IAAI,CAACJ,SAAS,CAAC,CAAC,CAAC4C,MAAO;QAC7BzG,KAAK,EAAE0G,MAAM,CAACC,wBAAyB;QACvCrH,WAAW,EAAE,IAAI,CAACgC,KAAK,CAAChC,WAAY;QACpCsH,cAAc,EAAE,IAAI,CAACC,mBAAoB;QACzCL,mBAAmB,EAAC,SAAS;QAC7BH,aAAa,EAAE,CAAC,IAAI,CAAC/E,KAAK,CAACZ,MAAO;QAClCoG,YAAY,EAAE9I,QAAQ,CAAC2H,KAAK,CAC1B,CAAC;UACCC,WAAW,EAAE;YACXmB,QAAQ,EAAE,IAAI,CAACjF,KAAK,CAACX,eAAe;YACpC0B,MAAM,EAAE,IAAI,CAACf,KAAK,CAACV;UACrB;QACF,CAAC,CAAG,EACJ;UACEyE,eAAe,EAAE,KAAK;UACtBpB,QAAQ,EAAE,IAAI,CAACqB;QACjB,CACF,CAAE;QACFJ,GAAG,EAAG5C,UAAU,IAAK;UAAE,IAAI,CAACA,UAAU,GAAGA,UAAU;QAAE;MAAE,GACnD,IAAI,CAACxB,KAAK,CAACf,YAAY,GAE1B4E,MACuB,CAAC;IAC7B;EACF,CAAC;EAEDC,cAAcA,CAAA,EAAG;IACf,OAAO,IAAI,CAACvB,SAAS,CAAC,CAAC,CAACmD,GAAG,CAAC,CAACjD,KAAK,EAAEC,GAAG,KAAK;MAC1C,IAAIC,GAAG,GAAG,IAAI,CAACC,aAAa,CAACH,KAAK,EAAEC,GAAG,CAAC;MACxC,oBAAOxG,KAAA,CAAAiG,aAAA,CAACnF,cAAc;QACpB2F,GAAG,EAAEF,KAAK,CAACE,GAAI;QACfgD,aAAa,EAAE,IAAI,CAAC7C,qBAAqB,CAACJ,GAAG,EAAE,IAAI,CAAClC,KAAK,CAACI,WAAW,CAAE;QACvElC,KAAK,EAAE;UAACgB,KAAK,EAAE,IAAI,CAACc,KAAK,CAAChB;QAAgB;MAAE,GAE3C,IAAI,CAACqD,UAAU,CAAC,IAAI,CAACrC,KAAK,CAACK,SAAS,EAAE8B,GAAG,CAAC,GAAGF,KAAK,gBAAGvG,KAAA,CAAAiG,aAAA,CAAC1F,IAAI;QAACkH,QAAQ,EAAElB,KAAK,CAACzC,KAAK,CAAC2D;MAAS,CAAC,CAC9E,CAAC;IACnB,CAAC,CAAC;EACJ,CAAC;EAEDe,4BAA4BA,CAACkB,CAAC,EAAE;IAC9B,MAAMC,OAAO,GAAGD,CAAC,CAACtB,WAAW,CAACH,aAAa,CAACzC,CAAC;IAC7C,MAAMxD,IAAI,GAAG4H,IAAI,CAACC,KAAK,CAACF,OAAO,GAAG,IAAI,CAACrF,KAAK,CAAChB,cAAc,CAAC;IAC5D,IAAI,IAAI,CAACgB,KAAK,CAACI,WAAW,KAAK1C,IAAI,EAAE;MACnC,IAAI,CAACqH,mBAAmB,CAACrH,IAAI,CAAC;IAChC;EACF,CAAC;EAEDqH,mBAAmBA,CAACS,QAAQ,EAAE;IAC5B,IAAIC,aAAa,GAAGD,QAAQ;IAC5B,IAAI,OAAOC,aAAa,KAAK,QAAQ,EAAE;MACrCA,aAAa,GAAGD,QAAQ,CAAC1B,WAAW,CAACmB,QAAQ;IAC/C;IAEA,MAAM7E,WAAW,GAAG,IAAI,CAACJ,KAAK,CAACI,WAAW;IAC1C,CAAC,IAAI,CAAChD,2BAA2B,IAAI,IAAI,CAACsD,eAAe,CAAC;MACxDhD,IAAI,EAAE+H,aAAa;MACnBlE,QAAQ,EAAE,IAAI,CAACC,YAAY,CAACC,IAAI,CAAC,IAAI,EAAErB,WAAW,EAAEqF,aAAa;IACnE,CAAC,CAAC;IACF,IAAI,CAACrI,2BAA2B,GAAG,KAAK;EAC1C,CAAC;EAEDoE,YAAYA,CAACkE,QAAQ,EAAEtF,WAAW,EAAE;IAClC,IAAI,CAACZ,KAAK,CAAC7B,WAAW,CAAC;MACrBgI,CAAC,EAAEvF,WAAW;MACdwD,GAAG,EAAE,IAAI,CAAC7B,SAAS,CAAC,CAAC,CAAC3B,WAAW,CAAC;MAClCwF,IAAI,EAAEF;IACR,CAAC,CAAC;EACJ,CAAC;EAED1B,SAASA,CAACoB,CAAC,EAAE;IACX,IAAIhJ,QAAQ,CAACQ,EAAE,KAAK,KAAK,EAAE;MACzB,MAAMyI,OAAO,GAAGD,CAAC,CAACtB,WAAW,CAACH,aAAa,CAACzC,CAAC;MAC7C,IAAImE,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAClI,mBAAmB,EAAE;QAC9C,IAAI,CAACA,mBAAmB,GAAG,IAAI;MACjC,CAAC,MAAM;QACL,IAAI,CAACqC,KAAK,CAAC3B,QAAQ,CAACwH,OAAO,GAAG,IAAI,CAACrF,KAAK,CAAChB,cAAc,CAAC;MAC1D;IACF,CAAC,MAAM;MACL,MAAM;QAAEiG,QAAQ;QAAElE;MAAQ,CAAC,GAAGqE,CAAC,CAACtB,WAAW;MAC3C,IAAI,CAACtE,KAAK,CAAC3B,QAAQ,CAACoH,QAAQ,GAAGlE,MAAM,CAAC;IACxC;EACF,CAAC;EAED8E,aAAaA,CAACT,CAAC,EAAE;IACf,MAAM;MAAElG;IAAO,CAAC,GAAGkG,CAAC,CAACtB,WAAW,CAACgC,MAAM;IAEvC,IAAI,CAAC5G,KAAK,IAAIA,KAAK,IAAI,CAAC,IAAIoG,IAAI,CAACC,KAAK,CAACrG,KAAK,CAAC,KAAKoG,IAAI,CAACC,KAAK,CAAC,IAAI,CAACvF,KAAK,CAAChB,cAAc,CAAC,EAAE;MACvF;IACF;IAEA,IAAI5C,QAAQ,CAACQ,EAAE,KAAK,KAAK,EAAE;MACzB,MAAM6C,2BAA2B,GAAG,IAAIvD,QAAQ,CAACqD,KAAK,CAACL,KAAK,CAAC;MAC7D;MACA;MACAO,2BAA2B,CAACC,YAAY,CAAC,CAAC;MAC1CP,WAAW,GAAGjD,QAAQ,CAACyD,MAAM,CAAC,IAAI,CAACK,KAAK,CAACZ,UAAU,EAAEK,2BAA2B,CAAC;MACjF,IAAI,CAACqC,QAAQ,CAAC;QAAE9C,cAAc,EAAEE,KAAK;QAAEC;MAAa,CAAC,CAAC;IACxD,CAAC,MAAM;MACL,IAAI,CAAC2C,QAAQ,CAAC;QAAE9C,cAAc,EAAEE;MAAO,CAAC,CAAC;IAC3C;IACA,IAAI,CAAC6G,qBAAqB,CAAC,MAAM;MAC/B,IAAI,CAACpF,QAAQ,CAAC,IAAI,CAACX,KAAK,CAACI,WAAW,CAAC;IACvC,CAAC,CAAC;EACJ,CAAC;EAED2B,SAASA,CAACtB,QAAQ,GAAG,IAAI,CAACjB,KAAK,CAACiB,QAAQ,EAAE;IACxC,OAAO/E,KAAK,CAACsK,QAAQ,CAACd,GAAG,CAACzE,QAAQ,EAAGwB,KAAK,IAAKA,KAAK,CAAC;EACvD,CAAC;EAEDgE,MAAMA,CAAA,EAAG;IACP,IAAIC,WAAW,GAAI,IAAI,CAAC1G,KAAK,CAAClC,cAAc,KAAK,YAAY,IAAI,IAAI,CAACkC,KAAK,CAAClC,cAAc,KAAK,eAAgB;IAC/G,IAAI6I,WAAW,GAAG;MAChBxF,QAAQ,EAAE,IAAI,CAACA,QAAQ;MACvByF,IAAI,EAAE,IAAI,CAACrE,SAAS,CAAC,CAAC,CAACmD,GAAG,CAAEjD,KAAK,IAAKA,KAAK,CAACzC,KAAK,CAAC2D,QAAQ,CAAC;MAC3DkD,SAAS,EAAE,IAAI,CAACrG,KAAK,CAACI,WAAW;MACjCjB,WAAW,EAAE,IAAI,CAACa,KAAK,CAACb,WAAW;MACnCH,cAAc,EAAE,IAAI,CAACgB,KAAK,CAAChB;IAC7B,CAAC;IAED,IAAI,IAAI,CAACQ,KAAK,CAACrB,qBAAqB,EAAE;MACpCgI,WAAW,CAACG,eAAe,GAAG,IAAI,CAAC9G,KAAK,CAACrB,qBAAqB;IAChE;IACA,IAAI,IAAI,CAACqB,KAAK,CAACnB,qBAAqB,EAAE;MACpC8H,WAAW,CAACI,eAAe,GAAG,IAAI,CAAC/G,KAAK,CAACnB,qBAAqB;IAChE;IACA,IAAI,IAAI,CAACmB,KAAK,CAAClB,uBAAuB,EAAE;MACtC6H,WAAW,CAACK,iBAAiB,GAAG,IAAI,CAAChH,KAAK,CAAClB,uBAAuB;IACpE;IACA,IAAI,IAAI,CAACkB,KAAK,CAACjB,eAAe,EAAE;MAC9B4H,WAAW,CAACM,SAAS,GAAG,IAAI,CAACjH,KAAK,CAACjB,eAAe;IACpD;IACA,IAAI,IAAI,CAACiB,KAAK,CAACxB,oBAAoB,EAAE;MACnCmI,WAAW,CAACO,cAAc,GAAG,IAAI,CAAClH,KAAK,CAACxB,oBAAoB;IAC9D;IACA,IAAIkI,WAAW,EAAE;MACfC,WAAW,CAACjI,KAAK,GAAG;QAClB+G,QAAQ,EAAE,UAAU;QACpB0B,IAAI,EAAE,CAAC;QACPC,KAAK,EAAE,CAAC;QACR,CAAC,IAAI,CAACpH,KAAK,CAAClC,cAAc,KAAK,YAAY,GAAG,KAAK,GAAG,QAAQ,GAAG;MACnE,CAAC;IACH;IAEA,oBAAO5B,KAAA,CAAAiG,aAAA,CAAC1F,IAAI;MAACiC,KAAK,EAAE,CAAC0G,MAAM,CAACiC,SAAS,EAAE,IAAI,CAACrH,KAAK,CAACtB,KAAK,CAAI;MAAC4I,QAAQ,EAAE,IAAI,CAACjB;IAAc,GACtF,IAAI,CAACrG,KAAK,CAAClC,cAAc,KAAK,KAAK,IAAI,IAAI,CAACQ,YAAY,CAACqI,WAAW,CAAC,EACrE,IAAI,CAAC/C,uBAAuB,CAAC,CAAC,EAC9B,CAAC,IAAI,CAAC5D,KAAK,CAAClC,cAAc,KAAK,QAAQ,IAAI4I,WAAW,KAAK,IAAI,CAACpI,YAAY,CAACqI,WAAW,CACrF,CAAC;EACT;AACF,CAAC,CAAC;AAEFY,MAAM,CAACC,OAAO,GAAGjK,iBAAiB;AAElC,MAAM6H,MAAM,GAAGvI,UAAU,CAAC4K,MAAM,CAAC;EAC/BJ,SAAS,EAAE;IACTK,IAAI,EAAE;EACR,CAAC;EACDrC,wBAAwB,EAAE;IACxBqC,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<module type="JAVA_MODULE" version="4">
|
|
3
|
+
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
|
4
|
+
<exclude-output />
|
|
5
|
+
<content url="file://$MODULE_DIR$">
|
|
6
|
+
<sourceFolder url="file://$MODULE_DIR$/Example/android/app/src/main/java" isTestSource="false" />
|
|
7
|
+
</content>
|
|
8
|
+
<orderEntry type="inheritedJdk" />
|
|
9
|
+
<orderEntry type="sourceFolder" forTests="false" />
|
|
10
|
+
</component>
|
|
11
|
+
</module>
|
package/package.json
ADDED
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@react-native-ohos/react-native-scrollable-tab-view",
|
|
3
|
+
"version": "1.0.1-rc.1",
|
|
4
|
+
"description": "",
|
|
5
|
+
"main": "lib/commonjs/index",
|
|
6
|
+
"module":"lib/module/index",
|
|
7
|
+
"typings":"lib/typescript/index.d.ts",
|
|
8
|
+
"react-native":"src/index",
|
|
9
|
+
"source":"src/index",
|
|
10
|
+
"scripts": {
|
|
11
|
+
"lint": "eslint -c .eslintrc . --ignore-path .gitignore",
|
|
12
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
|
13
|
+
"bob":"bob build",
|
|
14
|
+
"prepare":"npm run bob"
|
|
15
|
+
},
|
|
16
|
+
"repository": {
|
|
17
|
+
"type": "git",
|
|
18
|
+
"url": "https://github.com/react-native-oh-library/react-native-scrollable-tab-view.git"
|
|
19
|
+
},
|
|
20
|
+
"publishConfig": {
|
|
21
|
+
"registry": "https://npm.pkg.github.com"
|
|
22
|
+
},
|
|
23
|
+
"files":[
|
|
24
|
+
"harmony",
|
|
25
|
+
"lib",
|
|
26
|
+
"src"
|
|
27
|
+
],
|
|
28
|
+
"keywords": [
|
|
29
|
+
"react-native-component",
|
|
30
|
+
"react-component",
|
|
31
|
+
"react-native",
|
|
32
|
+
"ios",
|
|
33
|
+
"tab",
|
|
34
|
+
"scrollable",
|
|
35
|
+
"harmony"
|
|
36
|
+
],
|
|
37
|
+
"author": "Brent Vatne",
|
|
38
|
+
"license": "MIT",
|
|
39
|
+
"harmony": {
|
|
40
|
+
"alias": "react-native-scrollable-tab-view"
|
|
41
|
+
},
|
|
42
|
+
"bugs": {
|
|
43
|
+
"url": "https://github.com/brentvatne/react-native-scrollable-tab-view/issues"
|
|
44
|
+
},
|
|
45
|
+
"peerDependencies": {
|
|
46
|
+
"react-native": ">=0.20.0"
|
|
47
|
+
},
|
|
48
|
+
"homepage": "https://github.com/brentvatne/react-native-scrollable-tab-view#readme",
|
|
49
|
+
"dependencies": {
|
|
50
|
+
"react-native-pager-view": "^6.2.3" ,
|
|
51
|
+
"create-react-class": "^15.6.2",
|
|
52
|
+
"deprecated-react-native-prop-types": "^2.3.0",
|
|
53
|
+
"prop-types": "^15.6.0",
|
|
54
|
+
"react-timer-mixin": "^0.13.3"
|
|
55
|
+
},
|
|
56
|
+
"devDependencies": {
|
|
57
|
+
"babel-eslint": "^6.1.2",
|
|
58
|
+
"eslint": "^3.1.1",
|
|
59
|
+
"react-native-builder-bob":"^0.20.4"
|
|
60
|
+
},
|
|
61
|
+
"react-native-builder-bob":{
|
|
62
|
+
"source":"src",
|
|
63
|
+
"output":"lib",
|
|
64
|
+
"targets":[
|
|
65
|
+
"commonjs",
|
|
66
|
+
"module"
|
|
67
|
+
]
|
|
68
|
+
}
|
|
69
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
const React = require('react');
|
|
2
|
+
const ReactNative = require('react-native');
|
|
3
|
+
const {
|
|
4
|
+
TouchableNativeFeedback,
|
|
5
|
+
View,
|
|
6
|
+
} = ReactNative;
|
|
7
|
+
|
|
8
|
+
const Button = (props) => {
|
|
9
|
+
return <TouchableNativeFeedback
|
|
10
|
+
delayPressIn={0}
|
|
11
|
+
background={TouchableNativeFeedback.SelectableBackground()} // eslint-disable-line new-cap
|
|
12
|
+
{...props}
|
|
13
|
+
>
|
|
14
|
+
{props.children}
|
|
15
|
+
</TouchableNativeFeedback>;
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
module.exports = Button;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
const React = require('react');
|
|
2
|
+
const ReactNative = require('react-native');
|
|
3
|
+
const {
|
|
4
|
+
TouchableOpacity,
|
|
5
|
+
View,
|
|
6
|
+
} = ReactNative;
|
|
7
|
+
|
|
8
|
+
const Button = (props) => {
|
|
9
|
+
return <TouchableOpacity {...props}>
|
|
10
|
+
{props.children}
|
|
11
|
+
</TouchableOpacity>;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
module.exports = Button;
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
const React = require('react');
|
|
2
|
+
const ReactNative = require('react-native');
|
|
3
|
+
const DeprecatedPropTypes = require('deprecated-react-native-prop-types');
|
|
4
|
+
const PropTypes = require('prop-types');
|
|
5
|
+
const createReactClass = require('create-react-class');
|
|
6
|
+
const {
|
|
7
|
+
StyleSheet,
|
|
8
|
+
Text,
|
|
9
|
+
View,
|
|
10
|
+
Animated,
|
|
11
|
+
} = ReactNative;
|
|
12
|
+
const Button = Platform.OS === 'ios' ? require('./Button.ios.js') : require('./Button.android.js');
|
|
13
|
+
|
|
14
|
+
const DefaultTabBar = createReactClass({
|
|
15
|
+
propTypes: {
|
|
16
|
+
goToPage: PropTypes.func,
|
|
17
|
+
activeTab: PropTypes.number,
|
|
18
|
+
tabs: PropTypes.array,
|
|
19
|
+
backgroundColor: PropTypes.string,
|
|
20
|
+
activeTextColor: PropTypes.string,
|
|
21
|
+
inactiveTextColor: PropTypes.string,
|
|
22
|
+
textStyle: DeprecatedPropTypes.TextPropTypes.style,
|
|
23
|
+
tabStyle: DeprecatedPropTypes.ViewPropTypes.style,
|
|
24
|
+
renderTab: PropTypes.func,
|
|
25
|
+
underlineStyle: DeprecatedPropTypes.ViewPropTypes.style,
|
|
26
|
+
},
|
|
27
|
+
|
|
28
|
+
getDefaultProps() {
|
|
29
|
+
return {
|
|
30
|
+
activeTextColor: 'navy',
|
|
31
|
+
inactiveTextColor: 'black',
|
|
32
|
+
backgroundColor: null,
|
|
33
|
+
};
|
|
34
|
+
},
|
|
35
|
+
|
|
36
|
+
renderTabOption(name, page) {
|
|
37
|
+
},
|
|
38
|
+
|
|
39
|
+
renderTab(name, page, isTabActive, onPressHandler) {
|
|
40
|
+
const { activeTextColor, inactiveTextColor, textStyle, } = this.props;
|
|
41
|
+
const textColor = isTabActive ? activeTextColor : inactiveTextColor;
|
|
42
|
+
const fontWeight = isTabActive ? 'bold' : 'normal';
|
|
43
|
+
|
|
44
|
+
return <Button
|
|
45
|
+
style={{flex: 1, }}
|
|
46
|
+
key={name}
|
|
47
|
+
accessible={true}
|
|
48
|
+
accessibilityLabel={name}
|
|
49
|
+
accessibilityTraits='button'
|
|
50
|
+
onPress={() => onPressHandler(page)}
|
|
51
|
+
>
|
|
52
|
+
<View style={[styles.tab, this.props.tabStyle, ]}>
|
|
53
|
+
<Text style={[{color: textColor, fontWeight, }, textStyle, ]}>
|
|
54
|
+
{name}
|
|
55
|
+
</Text>
|
|
56
|
+
</View>
|
|
57
|
+
</Button>;
|
|
58
|
+
},
|
|
59
|
+
|
|
60
|
+
render() {
|
|
61
|
+
const containerWidth = this.props.containerWidth;
|
|
62
|
+
const numberOfTabs = this.props.tabs.length;
|
|
63
|
+
const tabUnderlineStyle = {
|
|
64
|
+
position: 'absolute',
|
|
65
|
+
width: containerWidth / numberOfTabs,
|
|
66
|
+
height: 4,
|
|
67
|
+
backgroundColor: 'navy',
|
|
68
|
+
bottom: 0,
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
const translateX = this.props.scrollValue.interpolate({
|
|
72
|
+
inputRange: [0, 1],
|
|
73
|
+
outputRange: [0, containerWidth / numberOfTabs],
|
|
74
|
+
});
|
|
75
|
+
return (
|
|
76
|
+
<View style={[styles.tabs, {backgroundColor: this.props.backgroundColor, }, this.props.style, ]}>
|
|
77
|
+
{this.props.tabs.map((name, page) => {
|
|
78
|
+
const isTabActive = this.props.activeTab === page;
|
|
79
|
+
const renderTab = this.props.renderTab || this.renderTab;
|
|
80
|
+
return renderTab(name, page, isTabActive, this.props.goToPage);
|
|
81
|
+
})}
|
|
82
|
+
<Animated.View
|
|
83
|
+
style={[
|
|
84
|
+
tabUnderlineStyle,
|
|
85
|
+
{
|
|
86
|
+
transform: [
|
|
87
|
+
{ translateX },
|
|
88
|
+
]
|
|
89
|
+
},
|
|
90
|
+
this.props.tabBarUnderlineStyle,
|
|
91
|
+
]}
|
|
92
|
+
/>
|
|
93
|
+
</View>
|
|
94
|
+
);
|
|
95
|
+
},
|
|
96
|
+
});
|
|
97
|
+
|
|
98
|
+
const styles = StyleSheet.create({
|
|
99
|
+
tab: {
|
|
100
|
+
flex: 1,
|
|
101
|
+
alignItems: 'center',
|
|
102
|
+
justifyContent: 'center',
|
|
103
|
+
paddingBottom: 10,
|
|
104
|
+
},
|
|
105
|
+
tabs: {
|
|
106
|
+
height: 50,
|
|
107
|
+
flexDirection: 'row',
|
|
108
|
+
justifyContent: 'space-between',
|
|
109
|
+
borderWidth: 1,
|
|
110
|
+
borderTopWidth: 0,
|
|
111
|
+
borderLeftWidth: 0,
|
|
112
|
+
borderRightWidth: 0,
|
|
113
|
+
borderColor: '#ccc',
|
|
114
|
+
},
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
module.exports = DefaultTabBar;
|