Anpassen Webview Höhe je nach Inhalt in

Ich bin mit Webview-Komponente in Reagieren Native Rendern von HTML-Inhalten. Das problem, das ich bin vor ist, dass ich nicht machen kann die Höhe variabel, so kann es anpassen, um jeden Inhalt, den es hat.

return (
                <View style={{flex: 1}}>
                    <Header 
                        containerStyle={{
                            backgroundColor: 'white',
                            borderBottomColor: '#dee0e2',
                            borderBottomWidth: 1
                        }}
                        centerComponent={{ text: 'Noticia', style: { color: 'black' } }}
                        leftComponent={
                            <TouchableHighlight onPress={() => navigate('homeScreen')}>
                                    <Text style={{color: '#4289f4'}}>Atrás</Text>  
                            </TouchableHighlight>
                        }
                    />
                    <ScrollView style={{padding: 5}}>
                        <View style={{flexDirection: 'column'}}>
                            <Text style={{textAlign: 'center', fontSize: 17, fontWeight: 'bold'}}>{noticia[0].titulo}</Text>
                            <Image style={{width: '100%', height: 200, alignSelf: 'stretch', marginTop: 10}} source={{uri: noticia[0].imagen}} />  
                            <View style={{height: 200, backgroundColor: 'red'}}>
                                <WebView
                                    source={{html: noticia[0].articulo}}
                                    scalesPageToFit={(Platform.OS === 'ios') ? false : true}
                                />
                            </View>
                        </View>



                    </ScrollView>
                </View>
              );

Wenn ich nicht die <View>' that contents ' <Webview>' a height it does show me nothing. Tried already withflex: 1` aber es ändert sich nichts.

1 Antworten

  • Malik Hezretov
    4. Mai 2019

    In Ihrer übergeordneten Ansicht (root-Ansicht direkt unter return()) Stil als

    height: '100%',
    width: '100%'
    

    Es wird erlassen, um jeder Größe Bildschirm.