FIX: QRCode styling should be in View not TouchableOpacity

This commit is contained in:
Marcos Rodriguez Vélez 2021-08-24 00:46:39 -04:00
parent e657ef0be6
commit 3a485e41e8

View File

@ -107,13 +107,13 @@ export class DynamicQRCode extends Component {
<TouchableOpacity <TouchableOpacity
accessibilityRole="button" accessibilityRole="button"
testID="DynamicCode" testID="DynamicCode"
style={animatedQRCodeStyle.qrcodeContainer}
onPress={() => { onPress={() => {
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut); LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
this.setState(prevState => ({ hideControls: !prevState.hideControls })); this.setState(prevState => ({ hideControls: !prevState.hideControls }));
}} }}
> >
{this.state.displayQRCode && ( {this.state.displayQRCode && (
<View style={animatedQRCodeStyle.qrcodeContainer}>
<QRCode <QRCode
value={currentFragment.toUpperCase()} value={currentFragment.toUpperCase()}
size={this.state.qrCodeHeight} size={this.state.qrCodeHeight}
@ -123,6 +123,7 @@ export class DynamicQRCode extends Component {
ecl="L" ecl="L"
onError={this.onError} onError={this.onError}
/> />
</View>
)} )}
</TouchableOpacity> </TouchableOpacity>
@ -170,9 +171,6 @@ const animatedQRCodeStyle = StyleSheet.create({
flex: 1, flex: 1,
flexDirection: 'column', flexDirection: 'column',
alignItems: 'center', alignItems: 'center',
borderWidth: 6,
borderRadius: 8,
borderColor: '#FFFFFF',
}, },
qrcodeContainer: { qrcodeContainer: {
alignItems: 'center', alignItems: 'center',