Spark Elements

Spark Elements is a react-native custom components.

Getting Started

Prerequisites

You will need install babel-preset-react-native-stage-0, and add to your .babelrc.

• Run the following command in a Command Prompt or shell:

npm install babel-preset-react-native-stage-0 --save

• Change your .babelrc (if you have one, if not, then create one):

{
  "presets": ["react-native-stage-0/decorator-support"]
}

Installing

To install the Spark Elements you need to run the following command in a Command Prompt or shell:

npm install spark-elements --save

Usage

import { Button } from 'spark-elements';
 
<Button
  text={'Welcome to Spark Elements'}
  backgroundColor={'grey'}
  textColor={'white'}
  onClick={() => console.log("Works!")} />
 

Components Included

• Avatar
• Background
• Badge
• Button
• CheckBox
• Divider
• FormChooser
• FormDatePicker
• FormText
• Icon
• List
• RatingBar
• SearchBar
• Text
• TextSlider

Using Icon

iOS

If you want to use any of the bundled icons, you need to add the icon fonts to your Xcode project. Just follow these steps:

• Browse to node_modules/spark-elements and drag the folder Fonts (or just the ones you want) to your project in Xcode. Make sure your app is checked under "Add to targets" and that "Create groups" is checked if you add the whole folder.
• Edit Info.plist and add a property called Fonts provided by application (or UIAppFonts if Xcode won't autocomplete/not using Xcode) and type in the files you just added. It will look something like this:

Android

• Copy the contents in the Fonts folder to android/app/src/main/assets/fonts (note lowercase font folder).

More info and screenshots about how to do this is available in the React Native Vector Icon documentation.

Contributing

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

Authors

• Fadel Trivandi Dipantara - Initial work - fadeltd
• M. Asrof Bayhaqqi - Initial work - haqiqiw

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE file for details

Acknowledgments

The Spark Elements team would like to thank React-Native, all the contributors to the Spark Elements project and you, the Spark Elements user. We would also thanks to developer of

• react-native-elements
• react-native-datepicker
• react-native-modal-selector
• react-native-swipe-gestures
• react-native-vector-icons
• ex-navigation