https://github.com/msamirma/react-native-form-runtime
React Native With Expo and Native Base Dynamic form
https://github.com/msamirma/react-native-form-runtime
expo form-at-runtime forms json-forms native-base react-native
Last synced: 6 months ago
JSON representation
React Native With Expo and Native Base Dynamic form
- Host: GitHub
- URL: https://github.com/msamirma/react-native-form-runtime
- Owner: msamirma
- License: mit
- Created: 2018-10-04T19:26:10.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-10-07T12:06:03.000Z (over 7 years ago)
- Last Synced: 2025-03-13T11:25:19.007Z (about 1 year ago)
- Topics: expo, form-at-runtime, forms, json-forms, native-base, react-native
- Language: JavaScript
- Size: 53.7 KB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Native Form Runtime
Form runtime is a react container that let you to have dynamic forms based on design json schema.
# Sample output
# Prerequisites
You must have installed Expo And Native base in your application.
# Installing
```sh
$ yarn add react-native-form-runtime
```
# Simple Example
```sh
import FormRuntime from "react-native-form-runtime";
...
const formDesign = [
{
type: "Text",
field: "firstName",
label: "First Name"
},
{
type: "Number",
field: "age",
label: "Age"
},
{
type: "Picker",
field: "gender",
label: "Select Gender",
options: ["Male", "Female"]
}
];
...
_submit(formData: {}, ACTION: string) {
console.log(formData);
}
...
```
### Available Properties
| Property | Type | Description |
| ---------- | ---------------- | ------------------------------------------------------------------ |
| formDesign | Array of objects | Array holds number of fields in form |
| type | string | Action will be taken when click on submit |
| submit | function | Function will be called to submit your data to server for example. |
### Available Fields ( Type in form design array)
| Field | Description |
| -------- | ------------------------------------- |
| Text | simple text input |
| Number | simple number input |
| Checkbox | simple checkbox |
| Label | text field |
| Picker | picker . MUST have options property . |
# Todo
- [ ] View Mode
- [ ] Form validation
- [ ] Flow Typed And Linting
- [ ] Test
- [x] Add Picker Field
- [ ] Add more fields (Cont.)
- [ ] Add Example (Cont.)