When developing in the React ecosystem, it's important to know the component hierarchy. In web development, we are used to inspecting our HTML code using Chrome DevTools. In React Native, inspecting our app layout is also possible using a built-in inspector. To show inspector, select the Show Inspector option inside the developer menu. You will be presented with the following screen:
Let's, for example, follow the instructions shown on the screen and select the Navigate to ChatScreen button. We will be presented with the following screenshot:
As you can see from the preceding screenshot, we have "box model" for our button, showing what exact margins and padding it has. Also, we see all component hierarchies on top. We can click on each parent or child component and check its style similar to what we would do in web development...