diff --git a/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js b/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js index ebd4f4f7b..686c45d22 100644 --- a/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js +++ b/Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js @@ -78,8 +78,8 @@ const styles = StyleSheet.create({ width: 76, }, image: { - height: 30, - width: 30, + height: 33, + width: 33, }, text: { color: '#ffffff', diff --git a/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js b/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js index e950b29e1..b7c09747a 100644 --- a/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js +++ b/Libraries/Experimental/SwipeableRow/SwipeableQuickActions.js @@ -61,7 +61,6 @@ const SwipeableQuickActions = React.createClass({ const styles = StyleSheet.create({ background: { - alignSelf: 'flex-end', flex: 1, flexDirection: 'row', justifyContent: 'flex-end', diff --git a/Libraries/Experimental/SwipeableRow/SwipeableRow.js b/Libraries/Experimental/SwipeableRow/SwipeableRow.js index 0fba64f0a..1880f559e 100644 --- a/Libraries/Experimental/SwipeableRow/SwipeableRow.js +++ b/Libraries/Experimental/SwipeableRow/SwipeableRow.js @@ -122,13 +122,7 @@ const SwipeableRow = React.createClass({ }, render(): ReactElement { - const slideoutStyle = [ - styles.slideOutContainer, - { - right: -this.state.scrollViewWidth, - width: this.state.scrollViewWidth, - }, - ]; + const slideoutStyle = [styles.slideOutContainer]; if (Platform.OS === 'ios') { slideoutStyle.push({opacity: this.state.isSwipeableViewRendered ? 1 : 0}); } @@ -244,8 +238,7 @@ const SwipeableRow = React.createClass({ _onLayoutChange(event: Object): void { const width = event.nativeEvent.layout.width; - - if (width !== this.state.scrollViewWidth) { + if (width && width !== this.state.scrollViewWidth) { this.setState({ scrollViewWidth: width, }); @@ -259,9 +252,12 @@ const styles = StyleSheet.create({ flexDirection: 'row', }, slideOutContainer: { + bottom: 0, flex: 1, - flexDirection: 'column', - alignItems: 'flex-end', + left: 0, + position: 'absolute', + right: 0, + top: 0, }, });