reactnativeFlexDirection.js

import React, {Component} from ‘react’;
import {AppRegistry,View}from ‘react - native’;

export default class FlexDirectionBasics extends Component {
 render() {
 return (
 <View style = {
    {
     flex: 1,
     flexDirection: ‘column’
    }
   } > //changed flexDirection to row and you get fig. 1.2 as a result.
   < View style = {{width: 50,height: 50,backgroundColor: ‘powderblue’}} /> 
   < View style = {{width: 50,height: 50,backgroundColor: ‘skyblue’}} />
   < View style = {{width: 50,height: 50,backgroundColor: ‘steelblue’}} />
 </View>);
 }
};