React Native Expo — кнопка исчезает при тестировании в сборке APK ⇐ Android

[Anonymous]

Я сталкиваюсь с критическими различиями между версией для разработки и версией сборки моего приложения React Native только на Android с использованием Expo. Основная проблема, с которой я сталкиваюсь, заключается в том, что кнопка закрытия, видимая в версии разработки, отсутствует в версии сборки (и другие мелкие проблемы пользовательского интерфейса).
Вот два экрана:
Версия для разработчиков (Expo Go)
[img]https://i .sstatic.net/XssZ5Acg.jpg[/img]

Версия сборки


Вот соответствующий код, который обрабатывает жест двойного касания и рендеринг пользовательского интерфейса:< /p>
import React, { useState, useEffect, useRef, useCallback } from 'react';
import { StyleSheet, Text, View, Dimensions, Image, TouchableWithoutFeedback, TouchableOpacity } from 'react-native';
// libraries
import { CameraView, useCameraPermissions } from 'expo-camera';
import { Button, Divider, IconButton } from 'react-native-paper';
import Icon from 'react-native-vector-icons/MaterialIcons';
// components
import CustomDashedLine from '../components/CustomDashline';

// ----------------------------------------------------------------------

const { height: DEVICE_HEIGHT, width: DEVICE_WIDTH } = Dimensions.get('window');

// ----------------------------------------------------------------------

const CameraScreen = ({ navigation, route }) => {

const [isTakingPicture, setIsTakingPicture] = useState(false);
const [showPrompt, setShowPrompt] = useState(true);
const tapRef = useRef(null);

const handleDoubleTap = useCallback(() => {
if (tapRef.current !== null) {
clearTimeout(tapRef.current);
setShowPrompt(false);
tapRef.current = null;
} else {
tapRef.current = setTimeout(() => {
tapRef.current = null;
}, 200);
}
}, []);

useEffect(() => {
setShowPrompt(true);
}, [step]);

const takePicture = async () => {
// take the pic and send with API
};

return (


{camera = ref}}
>

{
navigation.goBack();
setEnableTorch(false)
}}
style={styles.iconButton}
/>

{showPrompt && (



A Text here




)}
{!showPrompt && (




)}



);
};

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
},
camera: {
flex: 1,
width: '100%',
height: '100%',
},
buttonContainer: {
position: 'absolute',
right: 20,
bottom: 20,
alignSelf: 'center',
alignItems: 'center',
zIndex: 10,
backgroundColor: 'transparent',
},
iconButton: {
backgroundColor: 'rgba(0, 0, 0, 0.5)',
borderRadius: 50,
},
text: {
fontSize: 24,
fontWeight: 'bold',
color: 'white',
},
divider: {
backgroundColor: 'white',
width: 2,
height: 200,
marginVertical: 25,
opacity: 0.5,
},
fullScreenTouchable: {
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
justifyContent: 'center',
alignItems: 'center',
zIndex: 1,
},
promptContainer: {
backgroundColor: 'rgba(0, 0, 0, 0.7)',
padding: 20,
borderRadius: 10,
transform: [{ rotate: '90deg' }],
},
promptText: {
color: 'white',
fontSize: 18,
textAlign: 'center',
transform: [{ scaleX: -1 }]
},
overlay: {
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
},
cropLine: {
position: 'absolute',
left: '20%',
width: '70%',
},
});

export default CameraScreen;


Подробнее здесь: https://stackoverflow.com/questions/791 ... -apk-build