[RN] Avoid rendering Container if not visible
This solves the issue of view clipping on Android, plus it seems to be the RN convention unless the views are very large and memory hungry.
This commit is contained in:
parent
2128d047e1
commit
023359b9d2
|
@ -1,6 +1,5 @@
|
|||
import React from 'react';
|
||||
import {
|
||||
Dimensions,
|
||||
TouchableHighlight,
|
||||
TouchableWithoutFeedback,
|
||||
View
|
||||
|
@ -19,7 +18,7 @@ export class Container extends AbstractContainer {
|
|||
*
|
||||
* @static
|
||||
*/
|
||||
static propTypes = AbstractContainer.propTypes
|
||||
static propTypes = AbstractContainer.propTypes;
|
||||
|
||||
/**
|
||||
* Implements React's {@link Component#render()}.
|
||||
|
@ -32,23 +31,8 @@ export class Container extends AbstractContainer {
|
|||
let { onClick, style, touchFeedback, visible, ...props } = this.props;
|
||||
|
||||
// visible
|
||||
|
||||
// The following property is responsible to hide/show this Container by
|
||||
// moving it out of site of the screen boundaries. An attempt to use the
|
||||
// opacity property was made in order to eventually implement a
|
||||
// fadeIn/fadeOut animation, however a known React Native problem was
|
||||
// discovered, which allows the view to still capture touch events even
|
||||
// if hidden.
|
||||
// TODO Alternatives will be investigated.
|
||||
let parentStyle;
|
||||
|
||||
if (typeof visible !== 'undefined' && !visible) {
|
||||
const windowDimensions = Dimensions.get('window');
|
||||
|
||||
parentStyle = {
|
||||
bottom: -windowDimensions.height,
|
||||
right: -windowDimensions.width
|
||||
};
|
||||
return null;
|
||||
}
|
||||
|
||||
// onClick & touchFeedback
|
||||
|
@ -56,13 +40,6 @@ export class Container extends AbstractContainer {
|
|||
|
||||
const renderParent = touchFeedback || onClick;
|
||||
|
||||
if (!renderParent && parentStyle) {
|
||||
style = {
|
||||
...style,
|
||||
...parentStyle
|
||||
};
|
||||
}
|
||||
|
||||
// eslint-disable-next-line object-property-newline
|
||||
let component = this._render(View, { ...props, style });
|
||||
|
||||
|
@ -72,7 +49,6 @@ export class Container extends AbstractContainer {
|
|||
const parentProps = {};
|
||||
|
||||
onClick && (parentProps.onPress = onClick);
|
||||
parentStyle && (parentProps.style = parentStyle);
|
||||
|
||||
component = React.createElement(parentType, parentProps, component);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue