From 568e31e5d93142eb7ab9ca980f50fefd3efdf9b9 Mon Sep 17 00:00:00 2001 From: scottdixon Date: Fri, 3 Apr 2015 15:59:25 -0700 Subject: [PATCH] Updated README: included TouchableHighlight component in example. Clarified example setup --- README.md | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index e9dfd17..fa96f16 100644 --- a/README.md +++ b/README.md @@ -7,10 +7,10 @@ Note: The capture feature is currently not working properly. Pull requests welco ## Getting started 1. `npm install react-native-camera@latest --save` -2. In XCode, in the project navigator right click `Libraries` ➜ `Add Files to [your project's name]` +2. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]` 3. Go to `node_modules` ➜ `react-native-camera` and add `RCTCamera.xcodeproj` -4. Add `libRCTCamera.a` to your project's `Build Phases` ➜ `Link Binary With Libraries` -5. Click `RCTCamera.xcodeproj` in the project navigator and go the `Build Settings` tab. Look for `Header Search Paths` and make sure it contains both `$(SRCROOT)/../react-native/React` and `$(SRCROOT)/../../React` - mark both as `recursive`. +4. In XCode, in the project navigator, select your project. Add `libRCTCamera.a` to your project's `Build Phases` ➜ `Link Binary With Libraries` +5. Click `RCTCamera.xcodeproj` in the project navigator and go the `Build Settings` tab. Make sure 'All' is toggled on (instead of 'Basic'). Look for `Header Search Paths` and make sure it contains both `$(SRCROOT)/../react-native/React` and `$(SRCROOT)/../../React` - mark both as `recursive`. 5. Run your project (`Cmd+R`) ## Usage @@ -25,6 +25,7 @@ var { StyleSheet, Text, View, + TouchableHighlight } = React; var Camera = require('react-native-camera'); @@ -53,26 +54,26 @@ var cameraApp = React.createClass({ AppRegistry.registerComponent('cameraApp', () => cameraApp); ``` -### Props +### Properties #### `aspect` Values: `Fit`, `Fill` (default), `Stretch` -The `aspect` prop allows you to define how your viewfinder renders the camera's view. For instance, if you have a square viewfinder and you want to fill the it entirely, you have two options: `Fill`, where the aspect ratio of the camera's view is preserved by cropping the view or `Stretch`, where the aspect ratio is skewed in order to fit the entire image inside the viewfinder. The other option is `Fit`, which ensures the camera's entire view fits inside your viewfinder without altering the aspect ratio. +The `aspect` property allows you to define how your viewfinder renders the camera's view. For instance, if you have a square viewfinder and you want to fill the it entirely, you have two options: `Fill`, where the aspect ratio of the camera's view is preserved by cropping the view or `Stretch`, where the aspect ratio is skewed in order to fit the entire image inside the viewfinder. The other option is `Fit`, which ensures the camera's entire view fits inside your viewfinder without altering the aspect ratio. #### `camera` Values: `Front`, `Back` (default) -Use the `camera` prop to specify which camera to use. +Use the `camera` property to specify which camera to use. #### `orientation` Values: `LandscapeLeft`, `LandscapeRight`, `Portrait` (default), `PortraitUpsideDown` -The `orientation` prop allows you to specify the current orientation of the phone to ensure the viewfinder is "the right way up." +The `orientation` property allows you to specify the current orientation of the phone to ensure the viewfinder is "the right way up." TODO: Add support for an `Auto` value to automatically adjust for orientation changes.