How it works...

I fired up the emulator, and tried out the code. When in portrait orientation, the view is as shown in the following screenshot; note that I scrolled down, and the app correctly handles it:

Our styled application, showing colors, styles, and a scrollable view

If you change the device's orientation, our device handler logic captures the event, and the app is rendered differently. Here, we can see the split screen, with centered elements on the left and the scrollable view on the right, with its grayish background:

The landscape view gets a different layout, courtesy of new styling rules

As we've seen—and this was only an introduction to the many styling features provided by RN—you can get the same kind of results as with HTML and CSS, though here you are assuredly working with different elements and styles. The possibility of applying the full extent of JS to the definition of styles lets you forget about using tools such as SASS, because all the extra functionality that it would bring is already available through JS itself. Let's look at a further example of styling, this time for text, as we consider how to write code that's been specifically oriented to a given platform.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.145.64.132