React Native in Action

5 Styling in depth

This chapter covers

• Platform-specific sizes and styles
• Adding drop shadows to components
• Moving and rotating components on the x- and y-axes
• Scaling and skewing components
• Using flexbox for layout

Chapter 4 introduced styling React Native components. It showed how to style View and Text components, styles you’ll likely use every day and that mostly affect the look of a component. This chapter continues the discussion and goes into more depth with platform-specific styles; drop shadows; manipulating components with transformations such as translation, rotation, scaling, and skewing; and dynamically laying out components with flexbox.

Some of these topics may feel familiar. You used platform-specific styles and flexbox ...