使用absolute布局弹出键盘被遮住问题

<KeyboardAvoidingView style={styles.container} behavior="padding" enabled>
  ... your UI ...
</KeyboardAvoidingView>
// 如无效请在最外层使用ScrollView

使用Flatlist改变state时没有重新渲染

需要在Flatlist增加extraData属性，来告诉它重渲染（因为它继承了PureComponent）

<FlatList
    extraData={this.state.selected}
    renderItem={(item) => itemView(item)}
    data={this.props.data}/>

解决setParams无法动态渲染headerRight

class SomeComponent extends Component {

  static navigationOptions = ({ navigation }) => {

    const { state } = navigation
    const { signOutButton } = "params" in state && state.params

    return {
      headerRight: signOutButton && signOutButton()
    }
  }

  componentWillMount() {
    const signOutButton = (
      <Button onPress={() => { this.doSignOut() }} title="Sign Out"></Button>
    )
    this.props.navigation.setParams({ signOutButton: () => signOutButton })
  }
}

获取View尺寸

<View onLayout={(event) => {
  var {x, y, width, height} = event.nativeEvent.layout;
}} />

react-native-tab-navigator增加选中背景渐变色

1、复制node_modules下的react-native-tab-navigator，并在项目中引入。

2、修改文件夹下TabNavigator.js文件

// 引入react-native-linear-gradient
import LinearGradient from 'react-native-linear-gradient'

// 修改_renderTab(item)
return (
      item.props.selected ?
        <LinearGradient style={{flex: 1}} colors={['#FC6D65', '#FE4A87']}>
          <Tab
            testID={item.props.testID}
            title={item.props.title}
            allowFontScaling={item.props.allowFontScaling}
            titleStyle={[
              item.props.titleStyle,
              item.props.selected ? [
                styles.defaultSelectedTitle,
                item.props.selectedTitleStyle,
              ] : null,
            ]}
            badge={badge}
            onPress={item.props.onPress}
            hidesTabTouch={this.props.hidesTabTouch}
            style={item.props.tabStyle}>
            {icon}
          </Tab>
        </LinearGradient>
        :
        <Tab
          testID={item.props.testID}
          title={item.props.title}
          allowFontScaling={item.props.allowFontScaling}
          titleStyle={[
            item.props.titleStyle,
            item.props.selected ? [
              styles.defaultSelectedTitle,
              item.props.selectedTitleStyle,
            ] : null,
          ]}
          badge={badge}
          onPress={item.props.onPress}
          hidesTabTouch={this.props.hidesTabTouch}
          style={item.props.tabStyle}>
          {icon}
        </Tab>
    );