Native reagieren - warum Padding nicht funktioniert?

Question

Warum Padding funktioniert nie in React Native? Ich habe 10px padding im Bild und das Textfeld unter:

const styles = StyleSheet.create({ 
    container: { 
     marginTop: 75, 
     alignItems: 'center' 
    }, 
    image: { 
     width: 107, 
     height: 165, 
     padding: 10, 
     backgroundColor:'blue' 
    }, 
    description: { 
     padding: 20, 
     margin: 10, 
     fontSize: 15, 
     color: '#656565', 
     backgroundColor:'red' 
    } 
}); 

Ergebnis:

Irgendwelche Ideen, warum? Habe ich etwas verpasst?

Answer 1

Android mit React Native neigt dazu, Padding nicht zu mögen, es sei denn, es hat einen Rahmen. Eine vorübergehende Lösung wäre, all Ihre "paddingXXX" zu "marginXXX" zu ändern, um das ungefähre Styling zu erhalten, das Sie wollen.

const styles = StyleSheet.create({ 
container: { 
    marginTop: 75, 
    alignItems: 'center' 
}, 
image: { 
    width: 107, 
    height: 165, 
    margin: 10, 
    backgroundColor:'blue' 
}, 
description: { 
    margin: 30, 
    fontSize: 15, 
    color: '#656565', 
    backgroundColor:'red' 
} 
}); 

Es ist ein wirklich schlechter Workaround, aber ich habe noch eine präzise Lösung zu sehen. Soweit ich weiß, gibt es ein Problem mit dem Git Repo, aber es wurde noch nicht behoben.

Answer 2

Padding Problem für Android ist in react-native v0.31.0 Version behoben. für weitere Details können Sie gehen zu reagieren-natvie Release Changelog https://github.com/facebook/react-native/releases