RN的布局

• RN的布局是组件化的方式进行组合布局，没有定义flex情况下的话，布局很随意

样式的坑

• 要注意盒子之间是否使用了flex
• flex:0 1 auto 是三种不一样的情况

能使用的属性

Valid style props: [
  "alignItems",

  "alignSelf",

  "backfaceVisibility",

  "backgroundColor",

  "borderBottomColor",

  "borderBottomLeftRadius",

  "borderBottomRightRadius",

  "borderBottomWidth",

  "borderColor",

  "borderLeftColor",

  "borderLeftWidth",

  "borderRadius",

  "borderRightColor",

  "borderRightWidth",

  "borderStyle",

  "borderTopColor",

  "borderTopLeftRadius",

  "borderTopRightRadius",

  "borderTopWidth",

  "borderWidth",

  "bottom",

  "color",

  "elevation",

  "flex",

  "flexDirection",

  "flexWrap",

  "fontFamily",

  "fontSize",

  "fontStyle",

  "fontWeight",

  "height",

  "justifyContent",

  "left",

  "letterSpacing",

  "lineHeight",

  "margin",

  "marginBottom",

  "marginHorizontal",

  "marginLeft",

  "marginRight",

  "marginTop",

  "marginVertical",

  "maxHeight",

 "maxWidth",

  "opacity",

  "overflow",

  "overlayColor",

  "padding",

  "paddingBottom",

  "paddingHorizontal",

  "paddingLeft",

  "paddingRight",

  "paddingTop",

  "paddingVertical",

  "position",

  "resizeMode",

  "right",

  "rotation",

  "scaleX",

  "scaleY",

  "shadowColor",

  "shadowOffset",

  "shadowOpacity",

  "shadowRadius",

  "textAlign",

  "textAlignVertical",

  "textDecorationColor",

  "textDecorationLine",

  "textDecorationStyle",

  "textShadowColor",

  "textShadowOffset",

  "textShadowRadius",

  "tintColor",

  "top",

  "transform",

  "transformMatrix",

  "translateX",

  "translateY",

  "width",

  "writingDirection"]

• 不同的组件拥有的属性不一样
• 比如 View不能定义 color等