react-native-js-material-searchbar
A React Native material search bar for Android that follows the Google's material design guidelines. See more on: https://material.io/guidelines/patterns/search.html#search-in-app-search
Getting started
$ yarn add react-native-js-material-searchbar
Usage
Code refers to the previous image example:
// @flow */ PureComponent { console } { return <View style=stylescontainer> <MaterialSearchBar onChangeText=this_onTextDidChange containerStyle=stylescontainerStyle styleInput=stylesstyleInput placeholderTextColor='white' placeholder=I18n searchIcon=<MaterialIcons name="search" size=24 color='white' /> closeIcon=<MaterialIcons name="close" size=24 color='white' /> /> </View> } const styles = StyleSheet
API
Props | Type | Description | Required |
---|---|---|---|
containerStyle | Object | No | |
styleInput | Object | Inline-styles of the style input | No |
searchIcon | React.Element | The displayed search icon on the right of the text input. react-native-vector-icons is supported |
No |
closeIcon | React.Element | The displayed close icon on the right of the text input. react-native-vector-icons is supported |
No |
onChangeText | Function | Function executed when field's value is changed |
License
MIT License
Copyright (c) 2018 InterfaceKit
Author
Antonio Moreno Valls <amoreno at apsl.net>
Built with 💛 by APSL.