FIX: Replace swiper with view pager

This commit is contained in:
marcosrdz 2020-03-24 22:23:58 -04:00 committed by Overtorment
parent ab5475ec13
commit 9956118f83
3 changed files with 18 additions and 21 deletions

13
package-lock.json generated
View file

@ -1407,6 +1407,11 @@
"resolved": "https://registry.npmjs.org/@react-native-community/slider/-/slider-2.0.8.tgz",
"integrity": "sha512-FZC3wjYzHQiD7jT7ALy3QNccyLj9zQBRiKGBFr/QvrWLkVg5orpIJ53aYFXm3eOkNvUV+wjhoI9uCkh3LCN2+A=="
},
"@react-native-community/viewpager": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/@react-native-community/viewpager/-/viewpager-3.3.0.tgz",
"integrity": "sha512-tyzh79l4t/hxiyS9QD3LRmWMs8KVkZzjrkQ8U8+8To1wmvVCBtp8BenvNsDLTBO7CpO/YmiThpmIdEZMr1WuVw=="
},
"@react-navigation/core": {
"version": "3.4.2",
"resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-3.4.2.tgz",
@ -11683,14 +11688,6 @@
"css-tree": "^1.0.0-alpha.37"
}
},
"react-native-swiper": {
"version": "1.6.0-nightly.5",
"resolved": "https://registry.npmjs.org/react-native-swiper/-/react-native-swiper-1.6.0-nightly.5.tgz",
"integrity": "sha512-0siIUvD7FcGPSjRtsMyTWWmosUA+kJNT0WbJ0lf3Drp8vxeuWAg5kSmvQO+dJpISugcBWpfBc0OBDC5fBl+DsA==",
"requires": {
"prop-types": "^15.5.10"
}
},
"react-native-tab-view": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/react-native-tab-view/-/react-native-tab-view-1.4.1.tgz",

View file

@ -59,6 +59,7 @@
"@react-native-community/async-storage": "1.7.1",
"@react-native-community/blur": "3.4.1",
"@react-native-community/slider": "2.0.8",
"@react-native-community/viewpager": "3.3.0",
"@remobile/react-native-qrcode-local-image": "git+https://github.com/BlueWallet/react-native-qrcode-local-image.git",
"@sentry/react-native": "1.3.1",
"amplitude-js": "5.9.0",
@ -121,7 +122,6 @@
"react-native-snap-carousel": "3.8.4",
"react-native-sortable-list": "0.0.23",
"react-native-svg": "9.13.6",
"react-native-swiper": "1.6.0-nightly.5",
"react-native-tcp": "git+https://github.com/aprock/react-native-tcp.git",
"react-native-tooltip": "git+https://github.com/marcosrdz/react-native-tooltip.git",
"react-native-vector-icons": "6.6.0",

View file

@ -18,7 +18,7 @@ import ReactNativeHapticFeedback from 'react-native-haptic-feedback';
import PropTypes from 'prop-types';
import { PlaceholderWallet } from '../../class';
import WalletImport from '../../class/walletImport';
import Swiper from 'react-native-swiper';
import ViewPager from '@react-native-community/viewpager';
import ScanQRCode from '../send/ScanQRCode';
import DeeplinkSchemaMatch from '../../class/deeplinkSchemaMatch';
let EV = require('../../events');
@ -30,7 +30,7 @@ let BlueElectrum = require('../../BlueElectrum');
export default class WalletsList extends Component {
walletsCarousel = React.createRef();
swiperRef = React.createRef();
viewPagerRef = React.createRef();
constructor(props) {
super(props);
@ -296,7 +296,8 @@ export default class WalletsList extends Component {
}
};
onSwiperIndexChanged = index => {
onViewPagerScroll = (e: PageSelectedEvent) => {
const index = e.nativeEvent.position
StatusBar.setBarStyle(index === 1 ? 'dark-content' : 'light-content');
this.setState({ cameraPreviewIsPaused: index === 1 || index === undefined });
};
@ -335,19 +336,17 @@ export default class WalletsList extends Component {
<NavigationEvents
onDidFocus={() => {
this.redrawScreen();
this.setState({ cameraPreviewIsPaused: this.swiperRef.current.index === 1 || this.swiperRef.current.index === undefined });
this.setState({ cameraPreviewIsPaused: this.viewPageRef.current.index === 1 || this.viewPageRef.current.index === undefined });
}}
onWillBlur={() => this.setState({ cameraPreviewIsPaused: true })}
/>
<ScrollView contentContainerStyle={{ flex: 1 }}>
<Swiper
<ViewPager
style={styles.wrapper}
onIndexChanged={this.onSwiperIndexChanged}
index={1}
ref={this.swiperRef}
showsPagination={false}
showsButtons={false}
loop={false}
onPageScroll={this.onViewPagerScroll}
initialPage={1}
ref={this.viewPagerRef}
showPageIndicator={false}
>
<View style={styles.scanQRWrapper}>
<ScanQRCode
@ -420,7 +419,7 @@ export default class WalletsList extends Component {
</ScrollView>
</View>
</SafeBlueArea>
</Swiper>
</ViewPager>
</ScrollView>
</View>
);
@ -430,6 +429,7 @@ export default class WalletsList extends Component {
const styles = StyleSheet.create({
wrapper: {
backgroundColor: '#FFFFFF',
flex: 1,
},
walletsListWrapper: {
flex: 1,