Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move ViewPagerAndroid JS code to FB Internal

Browse Source 
Summary:
This module is being removed from React Native via Lean Core. This diff moves all the related JS files to FB internal.

Note: I removed two references to previously removed modules from some files in this diff. I hope you don't mind.

Reviewed By: TheSavior

Differential Revision: D15714919

fbshipit-source-id: 88ea406396b31f5c255e06d9c92b67127c81db4a
This commit is contained in:
Christoph Nakazawa
2019-06-11 00:29:27 -07:00
committed by Facebook Github Bot
parent 1f8e08a4fa
commit f8a400a53f
6 changed files with 13 additions and 716 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Libraries/Components/ViewPager/AndroidViewPagerNativeComponent.js
-112
View File
@@ -1,112 +0,0 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow
*/
'use strict';
const requireNativeComponent = require('../../ReactNative/requireNativeComponent');
import type {SyntheticEvent} from '../../Types/CoreEventTypes';
import type {NativeComponent} from '../../Renderer/shims/ReactNative';
import type {Node} from 'react';
import type {ViewStyleProp} from '../../StyleSheet/StyleSheet';
type PageScrollState = 'idle' | 'dragging' | 'settling';
type PageScrollEvent = SyntheticEvent<
$ReadOnly<{|
position: number,
offset: number,
|}>,
>;
type PageScrollStateChangedEvent = SyntheticEvent<
$ReadOnly<{|
pageScrollState: PageScrollState,
|}>,
>;
type PageSelectedEvent = SyntheticEvent<
$ReadOnly<{|
position: number,
|}>,
>;
type NativeProps = $ReadOnly<{|
/**
* Index of initial page that should be selected. Use `setPage` method to
* update the page, and `onPageSelected` to monitor page changes
*/
initialPage?: ?number,
/**
* Executed when transitioning between pages (ether because of animation for
* the requested page change or when user is swiping/dragging between pages)
* The `event.nativeEvent` object for this callback will carry following data:
* - position - index of first page from the left that is currently visible
* - offset - value from range [0,1) describing stage between page transitions.
* Value x means that (1 - x) fraction of the page at "position" index is
* visible, and x fraction of the next page is visible.
*/
onPageScroll?: ?(e: PageScrollEvent) => void,
/**
* Function called when the page scrolling state has changed.
* The page scrolling state can be in 3 states:
* - idle, meaning there is no interaction with the page scroller happening at the time
* - dragging, meaning there is currently an interaction with the page scroller
* - settling, meaning that there was an interaction with the page scroller, and the
* page scroller is now finishing it's closing or opening animation
*/
onPageScrollStateChanged?: ?(e: PageScrollStateChangedEvent) => void,
/**
* This callback will be called once ViewPager finish navigating to selected page
* (when user swipes between pages). The `event.nativeEvent` object passed to this
* callback will have following fields:
* - position - index of page that has been selected
*/
onPageSelected?: ?(e: PageSelectedEvent) => void,
/**
* Blank space to show between pages. This is only visible while scrolling, pages are still
* edge-to-edge.
*/
pageMargin?: ?number,
/**
* Whether enable showing peekFraction or not. If this is true, the preview of
* last and next page will show in current screen. Defaults to false.
*/
peekEnabled?: ?boolean,
/**
* Determines whether the keyboard gets dismissed in response to a drag.
* - 'none' (the default), drags do not dismiss the keyboard.
* - 'on-drag', the keyboard is dismissed when a drag begins.
*/
keyboardDismissMode?: ?('none' | 'on-drag'),
/**
* When false, the content does not scroll.
* The default value is true.
*/
scrollEnabled?: ?boolean,
children?: Node,
style?: ?ViewStyleProp,
|}>;
type ViewPagerNativeType = Class<NativeComponent<NativeProps>>;
module.exports = ((requireNativeComponent(
'AndroidViewPager',
): any): ViewPagerNativeType);
Libraries/Components/ViewPager/ViewPagerAndroid.android.js
-277
View File
@@ -1,277 +0,0 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow strict-local
*/
'use strict';
const React = require('react');
const ReactNative = require('../../Renderer/shims/ReactNative');
const UIManager = require('../../ReactNative/UIManager');
const dismissKeyboard = require('../../Utilities/dismissKeyboard');
const NativeAndroidViewPager = require('./AndroidViewPagerNativeComponent');
import type {SyntheticEvent} from '../../Types/CoreEventTypes';
import type {ViewStyleProp} from '../../StyleSheet/StyleSheet';
const VIEWPAGER_REF = 'viewPager';
type PageScrollState = 'idle' | 'dragging' | 'settling';
type PageScrollEvent = SyntheticEvent<
$ReadOnly<{|
position: number,
offset: number,
|}>,
>;
type PageScrollStateChangedEvent = SyntheticEvent<
$ReadOnly<{|
pageScrollState: PageScrollState,
|}>,
>;
type PageSelectedEvent = SyntheticEvent<
$ReadOnly<{|
position: number,
|}>,
>;
export type ViewPagerScrollState = $Keys<{
idle: string,
dragging: string,
settling: string,
}>;
type Props = $ReadOnly<{|
/**
* Index of initial page that should be selected. Use `setPage` method to
* update the page, and `onPageSelected` to monitor page changes
*/
initialPage?: ?number,
/**
* Executed when transitioning between pages (ether because of animation for
* the requested page change or when user is swiping/dragging between pages)
* The `event.nativeEvent` object for this callback will carry following data:
* - position - index of first page from the left that is currently visible
* - offset - value from range [0,1) describing stage between page transitions.
* Value x means that (1 - x) fraction of the page at "position" index is
* visible, and x fraction of the next page is visible.
*/
onPageScroll?: ?(e: PageScrollEvent) => void,
/**
* Function called when the page scrolling state has changed.
* The page scrolling state can be in 3 states:
* - idle, meaning there is no interaction with the page scroller happening at the time
* - dragging, meaning there is currently an interaction with the page scroller
* - settling, meaning that there was an interaction with the page scroller, and the
* page scroller is now finishing it's closing or opening animation
*/
onPageScrollStateChanged?: ?(e: PageScrollStateChangedEvent) => void,
/**
* This callback will be called once ViewPager finish navigating to selected page
* (when user swipes between pages). The `event.nativeEvent` object passed to this
* callback will have following fields:
* - position - index of page that has been selected
*/
onPageSelected?: ?(e: PageSelectedEvent) => void,
/**
* Blank space to show between pages. This is only visible while scrolling, pages are still
* edge-to-edge.
*/
pageMargin?: ?number,
/**
* Whether enable showing peekFraction or not. If this is true, the preview of
* last and next page will show in current screen. Defaults to false.
*/
peekEnabled?: ?boolean,
/**
* Determines whether the keyboard gets dismissed in response to a drag.
* - 'none' (the default), drags do not dismiss the keyboard.
* - 'on-drag', the keyboard is dismissed when a drag begins.
*/
keyboardDismissMode?: ?('none' | 'on-drag'),
/**
* When false, the content does not scroll.
* The default value is true.
*/
scrollEnabled?: ?boolean,
children?: React.Node,
style?: ?ViewStyleProp,
|}>;
/**
* Container that allows to flip left and right between child views. Each
* child view of the `ViewPagerAndroid` will be treated as a separate page
* and will be stretched to fill the `ViewPagerAndroid`.
*
* It is important all children are `<View>`s and not composite components.
* You can set style properties like `padding` or `backgroundColor` for each
* child. It is also important that each child have a `key` prop.
*
* Example:
*
* ```
* render: function() {
* return (
* <ViewPagerAndroid
* style={styles.viewPager}
* initialPage={0}>
* <View style={styles.pageStyle} key="1">
* <Text>First page</Text>
* </View>
* <View style={styles.pageStyle} key="2">
* <Text>Second page</Text>
* </View>
* </ViewPagerAndroid>
* );
* }
*
* ...
*
* var styles = {
* ...
* viewPager: {
* flex: 1
* },
* pageStyle: {
* alignItems: 'center',
* padding: 20,
* }
* }
* ```
*/
class ViewPagerAndroid extends React.Component<Props> {
componentDidMount() {
if (this.props.initialPage != null) {
this.setPageWithoutAnimation(this.props.initialPage);
}
}
/* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was found
* when making Flow check .android.js files. */
getInnerViewNode = (): ReactComponent => {
return this.refs[VIEWPAGER_REF].getInnerViewNode();
};
/* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was found
* when making Flow check .android.js files. */
_childrenWithOverridenStyle = (): Array => {
// Override styles so that each page will fill the parent. Native component
// will handle positioning of elements, so it's not important to offset
// them correctly.
return React.Children.map(this.props.children, function(child) {
if (!child) {
return null;
}
const newProps = {
...child.props,
style: [
child.props.style,
{
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
width: undefined,
height: undefined,
},
],
collapsable: false,
};
if (
child.type &&
child.type.displayName &&
child.type.displayName !== 'RCTView' &&
child.type.displayName !== 'View'
) {
console.warn(
'Each ViewPager child must be a <View>. Was ' +
child.type.displayName,
);
}
return React.createElement(child.type, newProps);
});
};
_onPageScroll = (e: PageScrollEvent) => {
if (this.props.onPageScroll) {
this.props.onPageScroll(e);
}
if (this.props.keyboardDismissMode === 'on-drag') {
dismissKeyboard();
}
};
_onPageScrollStateChanged = (e: PageScrollStateChangedEvent) => {
if (this.props.onPageScrollStateChanged) {
this.props.onPageScrollStateChanged(e);
}
};
_onPageSelected = (e: PageSelectedEvent) => {
if (this.props.onPageSelected) {
this.props.onPageSelected(e);
}
};
/**
* A helper function to scroll to a specific page in the ViewPager.
* The transition between pages will be animated.
*/
setPage = (selectedPage: number) => {
UIManager.dispatchViewManagerCommand(
ReactNative.findNodeHandle(this),
UIManager.getViewManagerConfig('AndroidViewPager').Commands.setPage,
[selectedPage],
);
};
/**
* A helper function to scroll to a specific page in the ViewPager.
* The transition between pages will *not* be animated.
*/
setPageWithoutAnimation = (selectedPage: number) => {
UIManager.dispatchViewManagerCommand(
ReactNative.findNodeHandle(this),
UIManager.getViewManagerConfig('AndroidViewPager').Commands
.setPageWithoutAnimation,
[selectedPage],
);
};
render() {
return (
<NativeAndroidViewPager
{...this.props}
ref={VIEWPAGER_REF}
style={this.props.style}
onPageScroll={this._onPageScroll}
onPageScrollStateChanged={this._onPageScrollStateChanged}
onPageSelected={this._onPageSelected}
children={this._childrenWithOverridenStyle()}
/>
);
}
}
module.exports = ViewPagerAndroid;
Libraries/Components/ViewPager/ViewPagerAndroid.ios.js
-12
View File
@@ -1,12 +0,0 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
module.exports = require('../UnimplementedViews/UnimplementedView');
Libraries/react-native/react-native-implementation.js
Vendored
+13 -9
View File
@@ -136,15 +136,6 @@ module.exports = {
get View() {
return require('../Components/View/View');
},
get ViewPagerAndroid() {
warnOnce(
'viewpager-moved',
'ViewPagerAndroid has been extracted from react-native core and will be removed in a future release. ' +
"It can now be installed and imported from '@react-native-community/viewpager' instead of 'react-native'. " +
'See https://github.com/react-native-community/react-native-viewpager',
);
return require('../Components/ViewPager/ViewPagerAndroid');
},
get VirtualizedList() {
return require('../Lists/VirtualizedList');
},
@@ -417,4 +408,17 @@ if (__DEV__) {
);
},
});
// $FlowFixMe This is intentional: Flow will error when attempting to access ViewPagerAndroid.
Object.defineProperty(module.exports, 'ViewPagerAndroid', {
configurable: true,
get() {
invariant(
false,
'ViewPagerAndroid has been removed from React Native. ' +
"It can now be installed and imported from 'react-native-viewpager' instead of 'react-native'. " +
'See https://github.com/react-native-community/react-native-viewpager',
);
},
});
}