From the course: React Native Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Styling the random play numbers

Styling the random play numbers - React Native Tutorial

From the course: React Native Essential Training

Start my 1-month free trial

Styling the random play numbers

- [Instructor] Here are the styles that I ended up with, you can check them out from Git tag 3.6. It's not very good, I know, but it will do for now. Hopefully you made a much better looking game, but here's what I did. I had to wrap all these random numbers in their own containers so that I can control its flex property and I named it randomContainer and these guys get just random. And I made some changes here to give the target margin from both sides. And then the randomContainer gets its own flex property but the direction, this time, is row and the flex wrap property is wrapped because I want the numbers to wrap. Justify content is spaces around. For every random number, I just give it a background with some margin, a font size, and a textAlign center. But the key for layout-ing these numbers is here. The flexDirection is row. By default, the flexDirection is column. The flexWrap is wrap, by default, it's not. In…

Contents