O'Reilly logo

React Native By Example by Richard Kho

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

StyleSheet

React Native's core visual components accept a prop called style and the names and values more or less match up with CSS's naming conventions, with one major exception--kebab-case is swapped out for camelCase, similar to how things are named in JavaScript. For example, a CSS property of background-color will translate to backgroundColor in React Native.

For readability and reuse, it's beneficial to break off inline styling into its own styles object by defining all of our styles into a styles object using React Native's StyleSheet component to create a style object and reference it within our component's render method.

Taking it a step further, with larger applications, it's best to separate the style sheet into its own JavaScript ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required