react-native-noticebar

NoticeBar component for React Native, works at iOS and Android.

Install

npm install react-native-noticebar --save

Usage

import NoticeBar from 'react-native-noticebar'

class Demo extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      noticeList: [
        {
          id: 1,
          title: 'This is Notice Bar!'
        },
        {
          id: 2,
          title: 'Notice Bar coming!!'
        }
      ]
    }
  }

  // noticebar change event
  handleChange = (index) => {
    console.log(`Current index is ${index}.` )
  }

  // noticebar press event
  handlePress = (item) => {
    console.log(item)
  }

  // render item
  renderBarItem = (item, index) => {
    return (
      <View>
        <Text numberOfLines={1}>{item.title}</Text>
      </View>
    )
  }

  render() {
    return (
      <View>
        <Text>NoticeBar Demo</Text>
        <NoticeBar
          data={ noticeList }
          renderBarItem={ this.renderBarItem }
          scrollHeight={ 40 }
          scrollBarStyle={ styles.barStyle }
          delay={ 3000 }
          duration={ 500 }
          easing='linear'
          onChange={ this.handleChange }
          onPress={ this.handlePress }></NoticeBar>
      </View>
    )
  }
}

Props