https://github.com/hizoul/preact-nativescript-components
JSX-Wrapper for preact-to-nativescript
https://github.com/hizoul/preact-nativescript-components
nativescript preact preact-to-nativescript
Last synced: 5 months ago
JSON representation
JSX-Wrapper for preact-to-nativescript
- Host: GitHub
- URL: https://github.com/hizoul/preact-nativescript-components
- Owner: Hizoul
- Created: 2018-01-13T09:28:39.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-02-08T16:36:16.000Z (almost 8 years ago)
- Last Synced: 2025-03-16T00:13:15.558Z (9 months ago)
- Topics: nativescript, preact, preact-to-nativescript
- Language: TypeScript
- Homepage:
- Size: 121 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: changelog.md
Awesome Lists containing this project
README
# preact-nativescript-components[](https://travis-ci.org/Hizoul/preact-nativescript-components) [](https://coveralls.io/github/Hizoul/preact-nativescript-components?branch=master) [](https://david-dm.org/Hizoul/preact-nativescript-components) [](https://www.npmjs.com/package/preact-nativescript-components)
preact-nativescript-components was made to use JSX-Syntax for [preact-to-nativescript](https://github.com/Hizoul/preact-to-nativescript) components
# Usage
You should mostly be able to import and use the NativeScript UI Components by name e.g.
```javascript
import application from "tns-core-modules/application"
import { render } from "preact-to-nativescript"
import {
ActionBar, ActionItem, Button, Label, Page, ScrollView, StackLayout
} from "preact-nativescript-components"
application.start({
create: () => {
return render(
Custom Header
PageContent
)
}
})
```
# List of importable Components
- Layouts
- [AbsoluteLayout](https://docs.nativescript.org/cookbook/ui/layouts/absolute-layout)
- [DockLayout](https://docs.nativescript.org/cookbook/ui/layouts/dock-layout)
- [FlexboxLayout](https://docs.nativescript.org/cookbook/ui/layouts/flexbox-layout)
- [GridLayout](https://docs.nativescript.org/cookbook/ui/layouts/grid-layout)
- [StackLayout](https://docs.nativescript.org/cookbook/ui/layouts/stack-layout)
- [WrapLayout](https://docs.nativescript.org/cookbook/ui/layouts/wrap-layout)
- [ActionBar / ActionItem / NavigationButton](https://docs.nativescript.org/cookbook/ui/action-bar)
- [ActivityIndicator](https://docs.nativescript.org/cookbook/ui/activity-indicator)
- [Button](https://docs.nativescript.org/cookbook/ui/button)
- [DatePicker](https://docs.nativescript.org/cookbook/ui/date-picker)
- [HtmlView](https://docs.nativescript.org/cookbook/ui/html-view)
- [Image](https://docs.nativescript.org/cookbook/ui/image)
- [Label](https://docs.nativescript.org/cookbook/ui/label)
- [ListPicker](https://docs.nativescript.org/cookbook/ui/list-picker)
- [ListView](https://docs.nativescript.org/cookbook/ui/list-view)
- [Page](https://docs.nativescript.org/cookbook/ui/page)
- [Placeholder](https://docs.nativescript.org/cookbook/ui/placeholder)
- [Progress](https://docs.nativescript.org/cookbook/ui/progress)
- [ScrollView](https://docs.nativescript.org/cookbook/ui/scroll-view)
- [SearchBar](https://docs.nativescript.org/cookbook/ui/search-bar)
- [SegmentedBar](https://docs.nativescript.org/cookbook/ui/segmented-bar)
- [Slider](https://docs.nativescript.org/cookbook/ui/slider)
- [Switch](https://docs.nativescript.org/cookbook/ui/switch)
- [TabView / TabViewItem](https://docs.nativescript.org/cookbook/ui/tab-view)
- [TextField](https://docs.nativescript.org/cookbook/ui/text-field)
- [TextView](https://docs.nativescript.org/cookbook/ui/text-view)
- [TimePicker](https://docs.nativescript.org/cookbook/ui/time-picker)
- [WebView](https://docs.nativescript.org/cookbook/ui/web-view)