#react-native #flexbox
Вопрос:
Я хочу отобразить свой компонент QRCodeScanner внутри представления другого компонента с определенной высотой и шириной. Компонент удержания сканера QR-кода является
lt;QRCodeScanner onRead={onSuccess} cameraType={"front"} reactivate={false} reactivateTimeout={5000} bottomContent={ lt;Text style={styles.centerText}gt; {t("Scan your")} {"n"} {t("QR Code")} lt;/Textgt; } cameraStyle={{ height: "100%", }} /gt;
Компонент, в котором я хочу отобразить, выглядит следующим образом :
return ( lt;LinearGradient colors={["#536aeb", "#004c93"]} style={{ display: "flex", flexDirection: "column", height: "100%", justifyContent: orientation === "LANDSCAPE" ? "space-between" : "flex-start", alignItems: "center", }} gt; lt;View style={{ width: "100%", flex: 1 , display: "flex", flexDirection: "column", alignItems:'flex-start',justifyContent: 'center', }}gt; lt;View style={{width: "100%", height: "30%",display: "flex", flexDirection: "row", alignItems: 'flex-start', justifyContent: 'center', marginTop: 100, backgroundColor:'white'}}gt; lt;QrCodeScanner navigation={props.navigation} /gt; lt;/Viewgt; lt;View style={{display: 'flex', flexDirection:'row', justifyContent: 'flex-end', alignItems:'flex-end', borderColor: 'white',position: 'absolute', bottom: 0, right:0}}gt; lt;View style={{padding: 10, backgroundColor:'white' }}gt; lt;QRCode value={JSON.stringify({ c: 'altData.companyId', })} size={100} /gt; lt;/Viewgt; lt;/Viewgt; lt;/Viewgt; lt;View style={{ width: "100%" }}gt; lt;Footer /gt; lt;/Viewgt; lt;/LinearGradientgt; )
Но для этого требуется полный рост, который я хочу ограничить определенным размером. Как я могу этого достичь !
Комментарии:
1. Вы пытались изменить стиль камеры на определенную высоту?