https://github.com/netbeast/react-native-dial

A react native reusable and efficient dial knob element
https://github.com/netbeast/react-native-dial

component dial knob react-native ui

Last synced: about 2 months ago
JSON representation

A react native reusable and efficient dial knob element

• Host: GitHub
• URL: https://github.com/netbeast/react-native-dial
• Owner: netbeast
• License: mit
• Created: 2016-11-16T22:42:59.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2021-01-22T06:01:48.000Z (almost 4 years ago)
• Last Synced: 2024-09-16T18:42:07.945Z (3 months ago)
• Topics: component, dial, knob, react-native, ui
• Language: JavaScript
• Homepage: https://getyeti.co/
• Size: 330 KB
• Stars: 67
• Watchers: 11
• Forks: 15
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-react-native - react-native-dial ★47 - A react native reusable and efficient dial knob element. (Components / UI)
• awesome-reactnative-ui - react-native-dial - native-dial/master/works-with-yeti.png)| (Others)
• awesome-react-native - react-native-dial ★47 - A react native reusable and efficient dial knob element. (Components / UI)
• awesome-react-native - react-native-dial ★47 - A react native reusable and efficient dial knob element. (Components / UI)
• awesome-reactnative-ui - react-native-dial - native-dial/master/works-with-yeti.png)| (Others)
• awesome-react-native - react-native-dial ★47 - A react native reusable and efficient dial knob element. (Components / UI)
• awesome-react-native-ui - react-native-dial ★12 - A react native reusable and efficient dial knob element. (Components / UI)

README

        
# react-native-dial

![npm version](https://badge.fury.io/js/react-native-dial.svg)



   



> This package powers [Yeti Smart Home](https://getyeti.co) and is used in production.

A react native reusable and efficient dial knob element.

```javascript

import { Dial } from 'react-native-dial'

// ...

 this.toggle()}

   responderStyle={styles.responderStyle}

   wrapperStyle={styles.wheelWrapper}

   onValueChange={(a, r) => this.changeBrightness(r)} />

```



Some properties:

```

 {/* 

   Optionally you can pass children so it renders a different component of your choice as a Dial,

   that can change in scale and angle

 */}

   

 

 

```

More documentation is incoming, in the meanwhile please read the source code. It is a single file!

PRs and issues are more than welcome.

Follow us in Github or https://twitter.com/netbeast_co.