Creates native picker in Swift UI and JetPack Compose
npm install @rn-elementary/menuCreates native picker in UIKit and Kotlin.
Sometimes react native apps dont feel native due to the javascript components. With this library will be starting a project to have all the native components ready to use in the application.
I couldnt find this kind of menu in the npm store so fastest way was to build it ;)
``sh
npm install @rn-elementary/menu
yarn add @rn-elementary/menu
`
| Prop | Description | Type | Default |
| -------------- | ------------------------------------------------------------------------------------------------------------------- | -------------------------------------- | ------------- |
| title | Title for the menu (only iOS) | String | "" |
| options | Option to display in the menu | Array of String | [] |
| onSelect | function which gives the index and title of the menu option selected. | Function | () => Void |
| layout | It is used to overlap the native view over the react native component. Without this the component wont be tappable. | layout from react-native-picker-native | Important |
- Kindly look into the example/src/App.tsx as it has the full implementation.
`js
import { PickerNativeView, usePickerLayout} from "@rn-elementary/menu";
// ...
const { layout, onLayout } = usePickerLayout();
// ...
options={[
'One',
'Two',
'Four',
'Five',
'Six',
'Seven',
'Eight',
'Nine',
'Ten',
]}
onSelect={(e) => {
console.log(e.nativeEvent.index);
console.log(e.nativeEvent.title);
}}
layout={layout}
>
style={{ marginTop: 200, width: 200, marginLeft: 20 }}
>
backgroundColor: 'red',
}}
>
CLICK ME
``
PR's are highly appreciated and so are issues.
See the contributing guide to learn how to contribute to the repository and the development workflow.
MIT
---
Made with create-react-native-library