Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/AlexisLeon/react-native-watch
React Native bindings for WatchKit
https://github.com/AlexisLeon/react-native-watch
react-native watchkit
Last synced: 4 months ago
JSON representation
React Native bindings for WatchKit
- Host: GitHub
- URL: https://github.com/AlexisLeon/react-native-watch
- Owner: AlexisLeon
- License: mit
- Created: 2017-09-22T20:52:04.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2018-08-22T14:59:01.000Z (almost 6 years ago)
- Last Synced: 2024-02-01T13:23:37.859Z (5 months ago)
- Topics: react-native, watchkit
- Language: Objective-C
- Homepage: https://www.npmjs.com/package/react-native-watch
- Size: 10.7 KB
- Stars: 29
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Lists
- awesome-apple-watch - @AlexisLeon/react-native-watch - React Native bindings for WatchKit (Library / Plugin)
README
# React Native Watch
[](https://travis-ci.org/alexisleon/react-native-watch)
[](https://www.npmjs.com/package/react-native-watch)
[](https://www.npmjs.com/package/react-native-watch)
[](https://www.npmjs.com/package/react-native-watch)
***This is a beta release***
*Requirements:*
* `react-native >= 0.41.2` for iOS
Connect your React Native App with WatchKit.
***Android Wear support coming soon..***
## Getting started
```
yarn add react-native-watch
```
Link the library to your project automatically by using:
```
react-native link react-native-watch
```
Or manually, by adding `node_modules/react-native-watch/RNWatch.xcodeproj` to your project and adding `libRNWatch.a` to `Build Phases` ➜ `Link Binary With Libraries`
Once linked to your project, modify `AppDelegate.h`:
```diff
#import
+ #import
+ @class RNWatch;
@interface AppDelegate : UIResponder
@property (nonatomic, strong) UIWindow *window;
+ @property (nonatomic, strong) RNWatch *watchBridge;
+ @property (nonatomic, strong) WCSession *session;
@end
```
And modify `AppDelegate.m`
```diff
#import "AppDelegate.h"
+ #import "RNWatch.h"
...
-(BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
...
+ self.watchBridge = [RNWatch shared];
+ self.session = self.watchBridge.session;
return YES;
```
## Usage
Use the examples below to start sending data between React Native and WatchOS (Swift)
**ES5**
```javascript
var watch = require('react-native-watch')
```
**ES6**
```javascript
import * as watch from 'react-native-watch'
```
### Messages
#### Receive messages
Subscribe and unsubscribe to all messages.
```javascript
// Subscribe
componentDidMount() {
this.messageSubscription = watch.subscribeToMessages(
(err, message) => {
if (err) console.error('Error receiving message', err)
else {
...
}
}
)
}
// Unsubscribe
componentWillUnmount() {
// messageSubscription -> remove function waiting to be called
this.messageSubscription()
}
```
#### Send Message
Send messages and receive a response
```javascript
watch.sendMessage(data, (err, res) => {
if (err) console.error('Error sending message to watch', err)
else {
console.log('Watch received the message sent')
if (res) {
console.log('Watch replied', res)
}
}
})
```
## Testing
```bash
yarn run test
```
## Contributing
Please read [CONTRIBUTING.md](CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to us.
## Versioning
We use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/alexisleon/react-native-watch/tags).
## Authors
* **Alexis Leon** - *Initial work* - [AlexisLeon](https://github.com/AlexisLeon)
See also the list of [contributors](https://github.com/alexisleon/react-native-watch/contributors) who participated in this project.
## License
This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details
## Acknowledgments
* Inspirited by [Conor Buckley](https://github.com/conorbuck/react-native-watch.git)
* Inspirited by [Michael Ford](https://github.com/mtford90/react-native-watch-connectivity)