006_ReactNative: Height and Width

(问渠那得清如许，为有源头活水来。 双手奉上RN官网)

固定尺寸: Height and Width 用于确定组件的尺寸. RN中的所有尺寸都是无单位的,最终以像素为单位展现.

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

class FixedDimensionsBasics extends Component {
  render() {
    return (
      //view中元素默认独占一行
      
        // 固定宽高
        
        
        
      
    );
  }
};

AppRegistry.registerComponent('AwesomeProject', () => FixedDimensionsBasics);

动态尺寸: 按照在兄弟flex和值中所占的比例分配高度,宽度与父view相同

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

class FlexDimensionsBasics extends Component {
  render() {
    return (
      // Try removing the `flex: 1` on the parent View.
      // The parent will not have dimensions, so the children can't expand.
      // What if you add `height: 300` instead of `flex: 1`?
      
      //父view高度占据整个屏幕
//        
      //父view没有指定尺寸,子view没有可用空间,都无法显示
//         
      //此时父view高度300定值,子view高度按比例划分
//        
      
      //3个子view宽度与父view相同.高度占比依次为1/6,2/6, 3/6.  各自的flex和值为6
       
        {/* shit,在内部常用的注释方式都用不了,包括 */}
        {/* 好吧,组件内注释需要使用{}包括起来 */} 
        
        
        
      
    );
  }
};

AppRegistry.registerComponent('AwesomeProject', () => FlexDimensionsBasics);