Building Flexbox layouts
In this section, you’ll learn about several potential layouts that you can use in your React Native applications. I want to stay away from the idea that one layout is better than another. Instead, I’ll show you how powerful the Flexbox layout model is for mobile screens so that you can design the kind of layout that best suits your application.
Simple three-column layout
To start things off, let’s implement a simple layout with three sections that flex in the column direction (top to bottom). We’ll look at the result we are aiming for first.
Figure 18.3: Simple three-column layout
The idea, in this example, is that you style and label the three screen sections so that they stand out. In other words, these components wouldn’t necessarily have any styling in a real application since they’re used to arrange other components on the screen.
Now, let’s take a look at the components used to...