├── .babelrc ├── .editorconfig ├── .eslintignore ├── .eslintrc ├── .github └── screenshot.gif ├── .gitignore ├── .npmignore ├── LICENSE.md ├── README.md ├── circle.yml ├── examples └── Simple │ ├── .babelrc │ ├── .buckconfig │ ├── .eslintrc │ ├── .flowconfig │ ├── .gitattributes │ ├── .gitignore │ ├── .watchmanconfig │ ├── android │ ├── app │ │ ├── BUCK │ │ ├── build.gradle │ │ ├── proguard-rules.pro │ │ └── src │ │ │ └── main │ │ │ ├── AndroidManifest.xml │ │ │ ├── java │ │ │ └── com │ │ │ │ └── simple │ │ │ │ ├── MainActivity.java │ │ │ │ └── MainApplication.java │ │ │ └── res │ │ │ ├── mipmap-hdpi │ │ │ └── ic_launcher.png │ │ │ ├── mipmap-mdpi │ │ │ └── ic_launcher.png │ │ │ ├── mipmap-xhdpi │ │ │ └── ic_launcher.png │ │ │ ├── mipmap-xxhdpi │ │ │ └── ic_launcher.png │ │ │ └── values │ │ │ ├── strings.xml │ │ │ └── styles.xml │ ├── build.gradle │ ├── gradle.properties │ ├── gradle │ │ └── wrapper │ │ │ ├── gradle-wrapper.jar │ │ │ └── gradle-wrapper.properties │ ├── gradlew │ ├── gradlew.bat │ ├── keystores │ │ ├── BUCK │ │ └── debug.keystore.properties │ └── settings.gradle │ ├── app │ ├── ExampleList.js │ ├── Row.js │ └── components │ │ ├── AdditionalInfoCard.js │ │ ├── InfoCard.js │ │ ├── Lines.js │ │ ├── PhotoCard.js │ │ ├── ProfileCard.js │ │ └── ProfileDetailCard.js │ ├── index.android.js │ ├── index.ios.js │ ├── ios │ ├── Simple.xcodeproj │ │ ├── project.pbxproj │ │ └── xcshareddata │ │ │ └── xcschemes │ │ │ └── Simple.xcscheme │ ├── Simple │ │ ├── AppDelegate.h │ │ ├── AppDelegate.m │ │ ├── Base.lproj │ │ │ └── LaunchScreen.xib │ │ ├── Images.xcassets │ │ │ └── AppIcon.appiconset │ │ │ │ └── Contents.json │ │ ├── Info.plist │ │ └── main.m │ └── SimpleTests │ │ ├── Info.plist │ │ └── SimpleTests.m │ └── package.json ├── gulpfile.js ├── package-lock.json ├── package.json ├── spec ├── .eslintrc └── sanityCheck.spec.js ├── src ├── FoldView.js ├── index.js └── transformUtil.js └── yarn.lock /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ "react-native" ] 3 | } 4 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | tab_width = 2 8 | end_of_line = lf 9 | charset = utf-8 10 | trim_trailing_whitespace = true 11 | insert_final_newline = true 12 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | # node_modules ignored by default 2 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "airbnb", 3 | "parser": "babel-eslint", 4 | "globals": { 5 | // Flow global types 6 | "ReactComponent": false, 7 | "ReactClass": false, 8 | "ReactElement": false, 9 | "ReactPropsCheckType": false, 10 | "ReactPropsChainableTypeChecker": false, 11 | "ReactPropTypes": false, 12 | "SyntheticEvent": false, 13 | "$Either": false, 14 | "$All": false, 15 | "$Tuple": false, 16 | "$Supertype": false, 17 | "$Subtype": false, 18 | "$Shape": false, 19 | "$Diff": false, 20 | "$Keys": false, 21 | "$Enum": false, 22 | "$Exports": false, 23 | "$FlowIssue": false, 24 | "$FlowFixMe": false, 25 | "$FixMe": false, 26 | // Polyfill 27 | "requestAnimationFrame": false, 28 | }, 29 | "rules": { 30 | "react/jsx-filename-extension": ["error", { "extensions": [".js"] }], 31 | "react/no-unused-prop-types": ["off"], 32 | "react/forbid-prop-types": ["off"], 33 | "react/require-default-props": ["off"], 34 | "class-methods-use-this": ["off"], 35 | "arrow-parens": ["off"], 36 | "no-underscore-dangle": [2, { allowAfterThis: true }], 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /.github/screenshot.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jmurzy/react-native-foldview/892f89569cd851867602ce7412852515dccc7e5f/.github/screenshot.gif -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | npm-debug.log 3 | node_modules/ 4 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .babelrc 3 | .eslintrc 4 | spec 5 | circle.yml 6 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016-2017 Jake Murzy 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # React Native FoldView [![Medium](https://img.shields.io/badge/blog-medium-brightgreen.svg)](https://commitocracy.com/implementing-foldview-in-react-native-e970011f98b8) [![CircleCI](https://img.shields.io/circleci/project/jmurzy/react-native-foldview/master.svg?style=flat-square)](https://circleci.com/gh/jmurzy/react-native-foldview) [![npm version](https://img.shields.io/npm/v/react-native-foldview.svg?style=flat-square)](https://www.npmjs.com/package/react-native-foldview) [![npm](https://img.shields.io/npm/l/react-native-foldview.svg?style=flat-square)](https://github.com/jmurzy/react-native-foldview/blob/master/LICENSE.md) 2 | 3 | FoldingCell implementation in JavaScript. This project was inspired by the folding cell animation seen on [Dribbble](https://dribbble.com/shots/2121350-Delivery-Card). 4 | 5 | 6 | 7 | 8 | #### Questions? 9 | Feel free to reach out to me on Twitter [@jmurzy](https://twitter.com/jmurzy). 10 | 11 | ### Read it on Medium 12 | To learn more about how FoldView was implemented, check out the article on Medium: [Implementing FoldView in React Native](https://commitocracy.com/implementing-foldview-in-react-native-e970011f98b8). 13 | 14 | ### Example 15 | The demo app from the GIF can be found at `examples/Simple`. 16 | 17 | To build and run the example app: 18 | 19 | ```bash 20 | git clone https://github.com/jmurzy/react-native-foldview 21 | 22 | cd react-native-foldview/examples/Simple 23 | npm install 24 | ``` 25 | 26 | To deploy to iOS simulator: 27 | 28 | ```bash 29 | npm run ios 30 | ``` 31 | 32 | ### Installation 33 | 34 | #### Using npm: 35 | 36 | ```sh 37 | $ npm install --save react-native-foldview 38 | ``` 39 | 40 | #### Using yarn: 41 | 42 | ```sh 43 | $ yarn add react-native-foldview 44 | ``` 45 | 46 | ### Usage 47 | 48 | ```jsx 49 | import React, { Component } from 'react'; 50 | 51 | import FoldView from 'react-native-foldview'; 52 | 53 | const Frontface = (props) => (/*...*/); 54 | const Backface = (props) => (/*...*/); 55 | const Base = (props) => (/*...*/); 56 | 57 | export default class Row extends Component { 58 | 59 | constructor(props) { 60 | super(props); 61 | 62 | this.state = { 63 | expanded: false, 64 | }; 65 | } 66 | 67 | componentWillMount() { 68 | this.flip = this.flip.bind(this); 69 | } 70 | 71 | flip() { 72 | this.setState({ 73 | expanded: !this.state.expanded, 74 | }); 75 | } 76 | 77 | renderFrontface() { 78 | return ( 79 | 80 | ); 81 | } 82 | 83 | renderBackface() { 84 | /** 85 | * You can nest s here to achieve the folding effect shown in the GIF above. 86 | * A reference implementation can be found in examples/Simple. 87 | */ 88 | return ( 89 | 90 | ); 91 | } 92 | 93 | render() { 94 | return ( 95 | 100 | 101 | 102 | ); 103 | } 104 | } 105 | 106 | ``` 107 | 108 | #### Props 109 | 110 | | Prop | Type | Description | 111 | |---|---|---| 112 | |**`children`**|`ReactElement`|React Element(s) to render.| 113 | |**`flipDuration`**|`?number`|Length of flip animation in milliseconds. _Default 280._| 114 | |**`renderBackface`**|`() => ReactElement`|Callback that renders a backface.| 115 | |**`renderFrontface`**|`() => ReactElement`|Callback that renders a frontface.| 116 | |**`renderLoading`**|`?() => ReactElement`|Callback that renders a temporary view to display before base layout occurs. If not provided, `renderFrontface` is used instead.| 117 | 118 | #### Root-only Props 119 | 120 | FoldViews can be nested. The following props can only be set on the root `FoldView`. 121 | 122 | | Prop | Type | Description | 123 | |---|---|---| 124 | |**`collapse`**|`?(foldviews: Array) => Promise`|Called when FoldView should collapse allowing you to have control over which FoldViews(s) to collapse. Default behavior is to wait until a FoldView is collapsed before collapsing the next one.| 125 | |**`expand`**|`?(foldviews: Array) => Promise`|Called when FoldView should expand allowing you to have control over which FoldView(s) to expand. Default behavior is to wait until a FoldView is expanded before expanding the next one.| 126 | |**`expanded`**|`boolean`|Allows you to expand and collapse the FoldView content.| 127 | |**`onAnimationEnd`**|`?(duration: number, height: number) => void`|Called when a collapse animation ends.| 128 | |**`onAnimationStart`**|`?(duration: number, height: number) => void`|Called before an expand animation starts.| 129 | |**`perspective`**|`?number`|Defines the space within which the 3D animation occurs.| 130 | 131 | ### Advanced Usage 132 | You can customize the behavior of expand and collapse animations using the `expand` and `collapse` props on the root `FoldView`. For example, it's very much possible to collapse all FoldViews in a given stack altogether rather than one by one. You can do so as follows: 133 | 134 | ```jsx 135 | const collapse = async (foldViews) => { 136 | /** 137 | * Internally, FoldView turns off rasterization when collapsed as an optimization to decrease 138 | * memory usage. It's important to wrap your calls in a `Promise` here to avoid early disabling 139 | * of rasterization. 140 | */ 141 | await Promise.all(foldViews.map(foldView => foldView.collapse())); 142 | } 143 | 144 | 149 | { /* ... */ } 150 | 151 | ``` 152 | 153 | ### Platform Support 154 | This library heavily depends on the `overflow` style property. Unfortunately, `overflow` defaults to `hidden` on Android and cannot be changed. Although it looks like a [possible](https://github.com/facebook/react-native/issues/3198#issuecomment-241867280) [fix](https://github.com/facebook/react-native/tree/master/ReactAndroid/src/main/java/com/facebook/react/flat) is in the making, currently, FoldingView is only supported on iOS. 155 | 156 | ### Contributing 157 | Contributions are very welcome: bug fixes, features, documentation, tests. Just make sure the CI is 👌. 158 | 159 | #### Hacking 160 | 161 | Unfortunately, React Native packager does not support symlinking so you cannot use [`npm link`](https://docs.npmjs.com/cli/link) when hacking on this library. You can learn more about that, [here](https://productpains.com/post/react-native/symlink-support-for-packager/). 162 | 163 | The library code is specified as a [local dependency](local dependency) in the example's `package.json`. In order to hack on the library code, you need to sync it into `examples/Simple/node_modules`. To do so, run: 164 | 165 | ```js 166 | npm run watch 167 | ``` 168 | 169 | This will automatically watch the `src` directory and sync your changes into `examples/Simple/node_modules` every time something changes. 170 | 171 | #### License 172 | 173 | All pull requests that get merged will be made available under [the MIT license](https://github.com/jmurzy/react-native-foldview/blob/master/LICENSE.md), as the rest of the repository. 174 | -------------------------------------------------------------------------------- /circle.yml: -------------------------------------------------------------------------------- 1 | machine: 2 | node: 3 | version: 5.1.0 4 | 5 | dependencies: 6 | pre: 7 | - npm install -g npm@3.3.12 8 | 9 | test: 10 | override: 11 | - npm test 12 | -------------------------------------------------------------------------------- /examples/Simple/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-native"] 3 | } -------------------------------------------------------------------------------- /examples/Simple/.buckconfig: -------------------------------------------------------------------------------- 1 | 2 | [android] 3 | target = Google Inc.:Google APIs:23 4 | 5 | [maven_repositories] 6 | central = https://repo1.maven.org/maven2 7 | -------------------------------------------------------------------------------- /examples/Simple/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "settings": { 3 | "import/resolver": { 4 | "node": { 5 | "extensions": [".ios.js", ".android.js", ".js"] 6 | } 7 | } 8 | }, 9 | "rules": { 10 | "import/no-unresolved": "off", 11 | "import/prefer-default-export": "off", 12 | "import/extensions": "off", 13 | "react/no-multi-comp": "off", 14 | "react/prop-types": "off" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /examples/Simple/.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | ; We fork some components by platform 3 | .*/*[.]android.js 4 | 5 | ; Ignore "BUCK" generated dirs 6 | /\.buckd/ 7 | 8 | ; Ignore unexpected extra "@providesModule" 9 | .*/node_modules/.*/node_modules/fbjs/.* 10 | 11 | ; Ignore duplicate module providers 12 | ; For RN Apps installed via npm, "Libraries" folder is inside 13 | ; "node_modules/react-native" but in the source repo it is in the root 14 | .*/Libraries/react-native/React.js 15 | .*/Libraries/react-native/ReactNative.js 16 | 17 | [include] 18 | 19 | [libs] 20 | node_modules/react-native/Libraries/react-native/react-native-interface.js 21 | node_modules/react-native/flow 22 | flow/ 23 | 24 | [options] 25 | module.system=haste 26 | 27 | experimental.strict_type_args=true 28 | 29 | munge_underscores=true 30 | 31 | module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub' 32 | 33 | suppress_type=$FlowIssue 34 | suppress_type=$FlowFixMe 35 | suppress_type=$FixMe 36 | 37 | suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-6]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\) 38 | suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-6]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+ 39 | suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy 40 | 41 | unsafe.enable_getters_and_setters=true 42 | 43 | [version] 44 | ^0.36.0 45 | -------------------------------------------------------------------------------- /examples/Simple/.gitattributes: -------------------------------------------------------------------------------- 1 | *.pbxproj -text 2 | -------------------------------------------------------------------------------- /examples/Simple/.gitignore: -------------------------------------------------------------------------------- 1 | # OSX 2 | # 3 | .DS_Store 4 | 5 | # Xcode 6 | # 7 | build/ 8 | *.pbxuser 9 | !default.pbxuser 10 | *.mode1v3 11 | !default.mode1v3 12 | *.mode2v3 13 | !default.mode2v3 14 | *.perspectivev3 15 | !default.perspectivev3 16 | xcuserdata 17 | *.xccheckout 18 | *.moved-aside 19 | DerivedData 20 | *.hmap 21 | *.ipa 22 | *.xcuserstate 23 | project.xcworkspace 24 | 25 | # Android/IntelliJ 26 | # 27 | build/ 28 | .idea 29 | .gradle 30 | local.properties 31 | *.iml 32 | 33 | # node.js 34 | # 35 | node_modules/ 36 | npm-debug.log 37 | 38 | # BUCK 39 | buck-out/ 40 | \.buckd/ 41 | android/app/libs 42 | *.keystore 43 | 44 | # fastlane 45 | # 46 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the 47 | # screenshots whenever they are needed. 48 | # For more information about the recommended setup visit: 49 | # https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md 50 | 51 | fastlane/report.xml 52 | fastlane/Preview.html 53 | fastlane/screenshots 54 | -------------------------------------------------------------------------------- /examples/Simple/.watchmanconfig: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /examples/Simple/android/app/BUCK: -------------------------------------------------------------------------------- 1 | import re 2 | 3 | # To learn about Buck see [Docs](https://buckbuild.com/). 4 | # To run your application with Buck: 5 | # - install Buck 6 | # - `npm start` - to start the packager 7 | # - `cd android` 8 | # - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"` 9 | # - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck 10 | # - `buck install -r android/app` - compile, install and run application 11 | # 12 | 13 | lib_deps = [] 14 | for jarfile in glob(['libs/*.jar']): 15 | name = 'jars__' + re.sub(r'^.*/([^/]+)\.jar$', r'\1', jarfile) 16 | lib_deps.append(':' + name) 17 | prebuilt_jar( 18 | name = name, 19 | binary_jar = jarfile, 20 | ) 21 | 22 | for aarfile in glob(['libs/*.aar']): 23 | name = 'aars__' + re.sub(r'^.*/([^/]+)\.aar$', r'\1', aarfile) 24 | lib_deps.append(':' + name) 25 | android_prebuilt_aar( 26 | name = name, 27 | aar = aarfile, 28 | ) 29 | 30 | android_library( 31 | name = 'all-libs', 32 | exported_deps = lib_deps 33 | ) 34 | 35 | android_library( 36 | name = 'app-code', 37 | srcs = glob([ 38 | 'src/main/java/**/*.java', 39 | ]), 40 | deps = [ 41 | ':all-libs', 42 | ':build_config', 43 | ':res', 44 | ], 45 | ) 46 | 47 | android_build_config( 48 | name = 'build_config', 49 | package = 'com.simple', 50 | ) 51 | 52 | android_resource( 53 | name = 'res', 54 | res = 'src/main/res', 55 | package = 'com.simple', 56 | ) 57 | 58 | android_binary( 59 | name = 'app', 60 | package_type = 'debug', 61 | manifest = 'src/main/AndroidManifest.xml', 62 | keystore = '//android/keystores:debug', 63 | deps = [ 64 | ':app-code', 65 | ], 66 | ) 67 | -------------------------------------------------------------------------------- /examples/Simple/android/app/build.gradle: -------------------------------------------------------------------------------- 1 | apply plugin: "com.android.application" 2 | 3 | import com.android.build.OutputFile 4 | 5 | /** 6 | * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets 7 | * and bundleReleaseJsAndAssets). 8 | * These basically call `react-native bundle` with the correct arguments during the Android build 9 | * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the 10 | * bundle directly from the development server. Below you can see all the possible configurations 11 | * and their defaults. If you decide to add a configuration block, make sure to add it before the 12 | * `apply from: "../../node_modules/react-native/react.gradle"` line. 13 | * 14 | * project.ext.react = [ 15 | * // the name of the generated asset file containing your JS bundle 16 | * bundleAssetName: "index.android.bundle", 17 | * 18 | * // the entry file for bundle generation 19 | * entryFile: "index.android.js", 20 | * 21 | * // whether to bundle JS and assets in debug mode 22 | * bundleInDebug: false, 23 | * 24 | * // whether to bundle JS and assets in release mode 25 | * bundleInRelease: true, 26 | * 27 | * // whether to bundle JS and assets in another build variant (if configured). 28 | * // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants 29 | * // The configuration property can be in the following formats 30 | * // 'bundleIn${productFlavor}${buildType}' 31 | * // 'bundleIn${buildType}' 32 | * // bundleInFreeDebug: true, 33 | * // bundleInPaidRelease: true, 34 | * // bundleInBeta: true, 35 | * 36 | * // the root of your project, i.e. where "package.json" lives 37 | * root: "../../", 38 | * 39 | * // where to put the JS bundle asset in debug mode 40 | * jsBundleDirDebug: "$buildDir/intermediates/assets/debug", 41 | * 42 | * // where to put the JS bundle asset in release mode 43 | * jsBundleDirRelease: "$buildDir/intermediates/assets/release", 44 | * 45 | * // where to put drawable resources / React Native assets, e.g. the ones you use via 46 | * // require('./image.png')), in debug mode 47 | * resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", 48 | * 49 | * // where to put drawable resources / React Native assets, e.g. the ones you use via 50 | * // require('./image.png')), in release mode 51 | * resourcesDirRelease: "$buildDir/intermediates/res/merged/release", 52 | * 53 | * // by default the gradle tasks are skipped if none of the JS files or assets change; this means 54 | * // that we don't look at files in android/ or ios/ to determine whether the tasks are up to 55 | * // date; if you have any other folders that you want to ignore for performance reasons (gradle 56 | * // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ 57 | * // for example, you might want to remove it from here. 58 | * inputExcludes: ["android/**", "ios/**"], 59 | * 60 | * // override which node gets called and with what additional arguments 61 | * nodeExecutableAndArgs: ["node"] 62 | * 63 | * // supply additional arguments to the packager 64 | * extraPackagerArgs: [] 65 | * ] 66 | */ 67 | 68 | apply from: "../../node_modules/react-native/react.gradle" 69 | 70 | /** 71 | * Set this to true to create two separate APKs instead of one: 72 | * - An APK that only works on ARM devices 73 | * - An APK that only works on x86 devices 74 | * The advantage is the size of the APK is reduced by about 4MB. 75 | * Upload all the APKs to the Play Store and people will download 76 | * the correct one based on the CPU architecture of their device. 77 | */ 78 | def enableSeparateBuildPerCPUArchitecture = false 79 | 80 | /** 81 | * Run Proguard to shrink the Java bytecode in release builds. 82 | */ 83 | def enableProguardInReleaseBuilds = false 84 | 85 | android { 86 | compileSdkVersion 23 87 | buildToolsVersion "23.0.1" 88 | 89 | defaultConfig { 90 | applicationId "com.simple" 91 | minSdkVersion 16 92 | targetSdkVersion 22 93 | versionCode 1 94 | versionName "1.0" 95 | ndk { 96 | abiFilters "armeabi-v7a", "x86" 97 | } 98 | } 99 | splits { 100 | abi { 101 | reset() 102 | enable enableSeparateBuildPerCPUArchitecture 103 | universalApk false // If true, also generate a universal APK 104 | include "armeabi-v7a", "x86" 105 | } 106 | } 107 | buildTypes { 108 | release { 109 | minifyEnabled enableProguardInReleaseBuilds 110 | proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro" 111 | } 112 | } 113 | // applicationVariants are e.g. debug, release 114 | applicationVariants.all { variant -> 115 | variant.outputs.each { output -> 116 | // For each separate APK per architecture, set a unique version code as described here: 117 | // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits 118 | def versionCodes = ["armeabi-v7a":1, "x86":2] 119 | def abi = output.getFilter(OutputFile.ABI) 120 | if (abi != null) { // null for the universal-debug, universal-release variants 121 | output.versionCodeOverride = 122 | versionCodes.get(abi) * 1048576 + defaultConfig.versionCode 123 | } 124 | } 125 | } 126 | } 127 | 128 | dependencies { 129 | compile fileTree(dir: "libs", include: ["*.jar"]) 130 | compile "com.android.support:appcompat-v7:23.0.1" 131 | compile "com.facebook.react:react-native:+" // From node_modules 132 | } 133 | 134 | // Run this once to be able to run the application with BUCK 135 | // puts all compile dependencies into folder libs for BUCK to use 136 | task copyDownloadableDepsToLibs(type: Copy) { 137 | from configurations.compile 138 | into 'libs' 139 | } 140 | -------------------------------------------------------------------------------- /examples/Simple/android/app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # By default, the flags in this file are appended to flags specified 3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt 4 | # You can edit the include path and order by changing the proguardFiles 5 | # directive in build.gradle. 6 | # 7 | # For more details, see 8 | # http://developer.android.com/guide/developing/tools/proguard.html 9 | 10 | # Add any project specific keep options here: 11 | 12 | # If your project uses WebView with JS, uncomment the following 13 | # and specify the fully qualified class name to the JavaScript interface 14 | # class: 15 | #-keepclassmembers class fqcn.of.javascript.interface.for.webview { 16 | # public *; 17 | #} 18 | 19 | # Disabling obfuscation is useful if you collect stack traces from production crashes 20 | # (unless you are using a system that supports de-obfuscate the stack traces). 21 | -dontobfuscate 22 | 23 | # React Native 24 | 25 | # Keep our interfaces so they can be used by other ProGuard rules. 26 | # See http://sourceforge.net/p/proguard/bugs/466/ 27 | -keep,allowobfuscation @interface com.facebook.proguard.annotations.DoNotStrip 28 | -keep,allowobfuscation @interface com.facebook.proguard.annotations.KeepGettersAndSetters 29 | -keep,allowobfuscation @interface com.facebook.common.internal.DoNotStrip 30 | 31 | # Do not strip any method/class that is annotated with @DoNotStrip 32 | -keep @com.facebook.proguard.annotations.DoNotStrip class * 33 | -keep @com.facebook.common.internal.DoNotStrip class * 34 | -keepclassmembers class * { 35 | @com.facebook.proguard.annotations.DoNotStrip *; 36 | @com.facebook.common.internal.DoNotStrip *; 37 | } 38 | 39 | -keepclassmembers @com.facebook.proguard.annotations.KeepGettersAndSetters class * { 40 | void set*(***); 41 | *** get*(); 42 | } 43 | 44 | -keep class * extends com.facebook.react.bridge.JavaScriptModule { *; } 45 | -keep class * extends com.facebook.react.bridge.NativeModule { *; } 46 | -keepclassmembers,includedescriptorclasses class * { native ; } 47 | -keepclassmembers class * { @com.facebook.react.uimanager.UIProp ; } 48 | -keepclassmembers class * { @com.facebook.react.uimanager.annotations.ReactProp ; } 49 | -keepclassmembers class * { @com.facebook.react.uimanager.annotations.ReactPropGroup ; } 50 | 51 | -dontwarn com.facebook.react.** 52 | 53 | # okhttp 54 | 55 | -keepattributes Signature 56 | -keepattributes *Annotation* 57 | -keep class okhttp3.** { *; } 58 | -keep interface okhttp3.** { *; } 59 | -dontwarn okhttp3.** 60 | 61 | # okio 62 | 63 | -keep class sun.misc.Unsafe { *; } 64 | -dontwarn java.nio.file.* 65 | -dontwarn org.codehaus.mojo.animal_sniffer.IgnoreJRERequirement 66 | -dontwarn okio.** 67 | -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 5 | 6 | 7 | 8 | 9 | 12 | 13 | 19 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/java/com/simple/MainActivity.java: -------------------------------------------------------------------------------- 1 | package com.simple; 2 | 3 | import com.facebook.react.ReactActivity; 4 | 5 | public class MainActivity extends ReactActivity { 6 | 7 | /** 8 | * Returns the name of the main component registered from JavaScript. 9 | * This is used to schedule rendering of the component. 10 | */ 11 | @Override 12 | protected String getMainComponentName() { 13 | return "Simple"; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/java/com/simple/MainApplication.java: -------------------------------------------------------------------------------- 1 | package com.simple; 2 | 3 | import android.app.Application; 4 | import android.util.Log; 5 | 6 | import com.facebook.react.ReactApplication; 7 | import com.facebook.react.ReactInstanceManager; 8 | import com.facebook.react.ReactNativeHost; 9 | import com.facebook.react.ReactPackage; 10 | import com.facebook.react.shell.MainReactPackage; 11 | import com.facebook.soloader.SoLoader; 12 | 13 | import java.util.Arrays; 14 | import java.util.List; 15 | 16 | public class MainApplication extends Application implements ReactApplication { 17 | 18 | private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { 19 | @Override 20 | protected boolean getUseDeveloperSupport() { 21 | return BuildConfig.DEBUG; 22 | } 23 | 24 | @Override 25 | protected List getPackages() { 26 | return Arrays.asList( 27 | new MainReactPackage() 28 | ); 29 | } 30 | }; 31 | 32 | @Override 33 | public ReactNativeHost getReactNativeHost() { 34 | return mReactNativeHost; 35 | } 36 | 37 | @Override 38 | public void onCreate() { 39 | super.onCreate(); 40 | SoLoader.init(this, /* native exopackage */ false); 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/res/mipmap-hdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jmurzy/react-native-foldview/892f89569cd851867602ce7412852515dccc7e5f/examples/Simple/android/app/src/main/res/mipmap-hdpi/ic_launcher.png -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/res/mipmap-mdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jmurzy/react-native-foldview/892f89569cd851867602ce7412852515dccc7e5f/examples/Simple/android/app/src/main/res/mipmap-mdpi/ic_launcher.png -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jmurzy/react-native-foldview/892f89569cd851867602ce7412852515dccc7e5f/examples/Simple/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jmurzy/react-native-foldview/892f89569cd851867602ce7412852515dccc7e5f/examples/Simple/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/res/values/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | Simple 3 | 4 | -------------------------------------------------------------------------------- /examples/Simple/android/app/src/main/res/values/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /examples/Simple/android/build.gradle: -------------------------------------------------------------------------------- 1 | // Top-level build file where you can add configuration options common to all sub-projects/modules. 2 | 3 | buildscript { 4 | repositories { 5 | jcenter() 6 | } 7 | dependencies { 8 | classpath 'com.android.tools.build:gradle:1.3.1' 9 | 10 | // NOTE: Do not place your application dependencies here; they belong 11 | // in the individual module build.gradle files 12 | } 13 | } 14 | 15 | allprojects { 16 | repositories { 17 | mavenLocal() 18 | jcenter() 19 | maven { 20 | // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm 21 | url "$rootDir/../node_modules/react-native/android" 22 | } 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /examples/Simple/android/gradle.properties: -------------------------------------------------------------------------------- 1 | # Project-wide Gradle settings. 2 | 3 | # IDE (e.g. Android Studio) users: 4 | # Gradle settings configured through the IDE *will override* 5 | # any settings specified in this file. 6 | 7 | # For more details on how to configure your build environment visit 8 | # http://www.gradle.org/docs/current/userguide/build_environment.html 9 | 10 | # Specifies the JVM arguments used for the daemon process. 11 | # The setting is particularly useful for tweaking memory settings. 12 | # Default value: -Xmx10248m -XX:MaxPermSize=256m 13 | # org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8 14 | 15 | # When configured, Gradle will run in incubating parallel mode. 16 | # This option should only be used with decoupled projects. More details, visit 17 | # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects 18 | # org.gradle.parallel=true 19 | 20 | android.useDeprecatedNdk=true 21 | -------------------------------------------------------------------------------- /examples/Simple/android/gradle/wrapper/gradle-wrapper.jar: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jmurzy/react-native-foldview/892f89569cd851867602ce7412852515dccc7e5f/examples/Simple/android/gradle/wrapper/gradle-wrapper.jar -------------------------------------------------------------------------------- /examples/Simple/android/gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | distributionBase=GRADLE_USER_HOME 2 | distributionPath=wrapper/dists 3 | zipStoreBase=GRADLE_USER_HOME 4 | zipStorePath=wrapper/dists 5 | distributionUrl=https\://services.gradle.org/distributions/gradle-2.4-all.zip 6 | -------------------------------------------------------------------------------- /examples/Simple/android/gradlew: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | ############################################################################## 4 | ## 5 | ## Gradle start up script for UN*X 6 | ## 7 | ############################################################################## 8 | 9 | # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 10 | DEFAULT_JVM_OPTS="" 11 | 12 | APP_NAME="Gradle" 13 | APP_BASE_NAME=`basename "$0"` 14 | 15 | # Use the maximum available, or set MAX_FD != -1 to use that value. 16 | MAX_FD="maximum" 17 | 18 | warn ( ) { 19 | echo "$*" 20 | } 21 | 22 | die ( ) { 23 | echo 24 | echo "$*" 25 | echo 26 | exit 1 27 | } 28 | 29 | # OS specific support (must be 'true' or 'false'). 30 | cygwin=false 31 | msys=false 32 | darwin=false 33 | case "`uname`" in 34 | CYGWIN* ) 35 | cygwin=true 36 | ;; 37 | Darwin* ) 38 | darwin=true 39 | ;; 40 | MINGW* ) 41 | msys=true 42 | ;; 43 | esac 44 | 45 | # For Cygwin, ensure paths are in UNIX format before anything is touched. 46 | if $cygwin ; then 47 | [ -n "$JAVA_HOME" ] && JAVA_HOME=`cygpath --unix "$JAVA_HOME"` 48 | fi 49 | 50 | # Attempt to set APP_HOME 51 | # Resolve links: $0 may be a link 52 | PRG="$0" 53 | # Need this for relative symlinks. 54 | while [ -h "$PRG" ] ; do 55 | ls=`ls -ld "$PRG"` 56 | link=`expr "$ls" : '.*-> \(.*\)$'` 57 | if expr "$link" : '/.*' > /dev/null; then 58 | PRG="$link" 59 | else 60 | PRG=`dirname "$PRG"`"/$link" 61 | fi 62 | done 63 | SAVED="`pwd`" 64 | cd "`dirname \"$PRG\"`/" >&- 65 | APP_HOME="`pwd -P`" 66 | cd "$SAVED" >&- 67 | 68 | CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar 69 | 70 | # Determine the Java command to use to start the JVM. 71 | if [ -n "$JAVA_HOME" ] ; then 72 | if [ -x "$JAVA_HOME/jre/sh/java" ] ; then 73 | # IBM's JDK on AIX uses strange locations for the executables 74 | JAVACMD="$JAVA_HOME/jre/sh/java" 75 | else 76 | JAVACMD="$JAVA_HOME/bin/java" 77 | fi 78 | if [ ! -x "$JAVACMD" ] ; then 79 | die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME 80 | 81 | Please set the JAVA_HOME variable in your environment to match the 82 | location of your Java installation." 83 | fi 84 | else 85 | JAVACMD="java" 86 | which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 87 | 88 | Please set the JAVA_HOME variable in your environment to match the 89 | location of your Java installation." 90 | fi 91 | 92 | # Increase the maximum file descriptors if we can. 93 | if [ "$cygwin" = "false" -a "$darwin" = "false" ] ; then 94 | MAX_FD_LIMIT=`ulimit -H -n` 95 | if [ $? -eq 0 ] ; then 96 | if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then 97 | MAX_FD="$MAX_FD_LIMIT" 98 | fi 99 | ulimit -n $MAX_FD 100 | if [ $? -ne 0 ] ; then 101 | warn "Could not set maximum file descriptor limit: $MAX_FD" 102 | fi 103 | else 104 | warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT" 105 | fi 106 | fi 107 | 108 | # For Darwin, add options to specify how the application appears in the dock 109 | if $darwin; then 110 | GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\"" 111 | fi 112 | 113 | # For Cygwin, switch paths to Windows format before running java 114 | if $cygwin ; then 115 | APP_HOME=`cygpath --path --mixed "$APP_HOME"` 116 | CLASSPATH=`cygpath --path --mixed "$CLASSPATH"` 117 | 118 | # We build the pattern for arguments to be converted via cygpath 119 | ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null` 120 | SEP="" 121 | for dir in $ROOTDIRSRAW ; do 122 | ROOTDIRS="$ROOTDIRS$SEP$dir" 123 | SEP="|" 124 | done 125 | OURCYGPATTERN="(^($ROOTDIRS))" 126 | # Add a user-defined pattern to the cygpath arguments 127 | if [ "$GRADLE_CYGPATTERN" != "" ] ; then 128 | OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)" 129 | fi 130 | # Now convert the arguments - kludge to limit ourselves to /bin/sh 131 | i=0 132 | for arg in "$@" ; do 133 | CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -` 134 | CHECK2=`echo "$arg"|egrep -c "^-"` ### Determine if an option 135 | 136 | if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then ### Added a condition 137 | eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"` 138 | else 139 | eval `echo args$i`="\"$arg\"" 140 | fi 141 | i=$((i+1)) 142 | done 143 | case $i in 144 | (0) set -- ;; 145 | (1) set -- "$args0" ;; 146 | (2) set -- "$args0" "$args1" ;; 147 | (3) set -- "$args0" "$args1" "$args2" ;; 148 | (4) set -- "$args0" "$args1" "$args2" "$args3" ;; 149 | (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;; 150 | (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;; 151 | (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;; 152 | (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;; 153 | (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;; 154 | esac 155 | fi 156 | 157 | # Split up the JVM_OPTS And GRADLE_OPTS values into an array, following the shell quoting and substitution rules 158 | function splitJvmOpts() { 159 | JVM_OPTS=("$@") 160 | } 161 | eval splitJvmOpts $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS 162 | JVM_OPTS[${#JVM_OPTS[*]}]="-Dorg.gradle.appname=$APP_BASE_NAME" 163 | 164 | exec "$JAVACMD" "${JVM_OPTS[@]}" -classpath "$CLASSPATH" org.gradle.wrapper.GradleWrapperMain "$@" 165 | -------------------------------------------------------------------------------- /examples/Simple/android/gradlew.bat: -------------------------------------------------------------------------------- 1 | @if "%DEBUG%" == "" @echo off 2 | @rem ########################################################################## 3 | @rem 4 | @rem Gradle startup script for Windows 5 | @rem 6 | @rem ########################################################################## 7 | 8 | @rem Set local scope for the variables with windows NT shell 9 | if "%OS%"=="Windows_NT" setlocal 10 | 11 | @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 12 | set DEFAULT_JVM_OPTS= 13 | 14 | set DIRNAME=%~dp0 15 | if "%DIRNAME%" == "" set DIRNAME=. 16 | set APP_BASE_NAME=%~n0 17 | set APP_HOME=%DIRNAME% 18 | 19 | @rem Find java.exe 20 | if defined JAVA_HOME goto findJavaFromJavaHome 21 | 22 | set JAVA_EXE=java.exe 23 | %JAVA_EXE% -version >NUL 2>&1 24 | if "%ERRORLEVEL%" == "0" goto init 25 | 26 | echo. 27 | echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 28 | echo. 29 | echo Please set the JAVA_HOME variable in your environment to match the 30 | echo location of your Java installation. 31 | 32 | goto fail 33 | 34 | :findJavaFromJavaHome 35 | set JAVA_HOME=%JAVA_HOME:"=% 36 | set JAVA_EXE=%JAVA_HOME%/bin/java.exe 37 | 38 | if exist "%JAVA_EXE%" goto init 39 | 40 | echo. 41 | echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 42 | echo. 43 | echo Please set the JAVA_HOME variable in your environment to match the 44 | echo location of your Java installation. 45 | 46 | goto fail 47 | 48 | :init 49 | @rem Get command-line arguments, handling Windowz variants 50 | 51 | if not "%OS%" == "Windows_NT" goto win9xME_args 52 | if "%@eval[2+2]" == "4" goto 4NT_args 53 | 54 | :win9xME_args 55 | @rem Slurp the command line arguments. 56 | set CMD_LINE_ARGS= 57 | set _SKIP=2 58 | 59 | :win9xME_args_slurp 60 | if "x%~1" == "x" goto execute 61 | 62 | set CMD_LINE_ARGS=%* 63 | goto execute 64 | 65 | :4NT_args 66 | @rem Get arguments from the 4NT Shell from JP Software 67 | set CMD_LINE_ARGS=%$ 68 | 69 | :execute 70 | @rem Setup the command line 71 | 72 | set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar 73 | 74 | @rem Execute Gradle 75 | "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS% 76 | 77 | :end 78 | @rem End local scope for the variables with windows NT shell 79 | if "%ERRORLEVEL%"=="0" goto mainEnd 80 | 81 | :fail 82 | rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of 83 | rem the _cmd.exe /c_ return code! 84 | if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 85 | exit /b 1 86 | 87 | :mainEnd 88 | if "%OS%"=="Windows_NT" endlocal 89 | 90 | :omega 91 | -------------------------------------------------------------------------------- /examples/Simple/android/keystores/BUCK: -------------------------------------------------------------------------------- 1 | keystore( 2 | name = 'debug', 3 | store = 'debug.keystore', 4 | properties = 'debug.keystore.properties', 5 | visibility = [ 6 | 'PUBLIC', 7 | ], 8 | ) 9 | -------------------------------------------------------------------------------- /examples/Simple/android/keystores/debug.keystore.properties: -------------------------------------------------------------------------------- 1 | key.store=debug.keystore 2 | key.alias=androiddebugkey 3 | key.store.password=android 4 | key.alias.password=android 5 | -------------------------------------------------------------------------------- /examples/Simple/android/settings.gradle: -------------------------------------------------------------------------------- 1 | rootProject.name = 'Simple' 2 | 3 | include ':app' 4 | -------------------------------------------------------------------------------- /examples/Simple/app/ExampleList.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { 4 | Platform, 5 | ScrollView, 6 | StatusBar, 7 | StyleSheet, 8 | View, 9 | } from 'react-native'; 10 | 11 | import Row from './Row'; 12 | 13 | const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 20 : 0; 14 | 15 | const styles = StyleSheet.create({ 16 | container: { 17 | flex: 1, 18 | }, 19 | scrollView: { 20 | backgroundColor: '#4A637D', 21 | flex: 1, 22 | padding: 10, 23 | paddingTop: STATUSBAR_HEIGHT, 24 | }, 25 | }); 26 | 27 | export default () => ( 28 | 29 | 32 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | ); 42 | -------------------------------------------------------------------------------- /examples/Simple/app/Row.js: -------------------------------------------------------------------------------- 1 | import React, { 2 | Component, 3 | } from 'react'; 4 | 5 | import { 6 | LayoutAnimation, 7 | UIManager, 8 | View, 9 | } from 'react-native'; 10 | 11 | import FoldView from 'react-native-foldview'; 12 | 13 | import InfoCard from './components/InfoCard'; 14 | import PhotoCard from './components/PhotoCard'; 15 | import ProfileCard from './components/ProfileCard'; 16 | 17 | // Enable LayoutAnimation on Android 18 | if (UIManager.setLayoutAnimationEnabledExperimental) { 19 | UIManager.setLayoutAnimationEnabledExperimental(true); 20 | } 21 | 22 | const ROW_HEIGHT = 180; 23 | 24 | const Spacer = ({ height }) => ( 25 | 31 | ); 32 | 33 | export default class Row extends Component { 34 | 35 | constructor(props) { 36 | super(props); 37 | 38 | this.state = { 39 | expanded: false, 40 | height: ROW_HEIGHT, 41 | }; 42 | } 43 | 44 | componentWillMount() { 45 | this.flip = this.flip.bind(this); 46 | this.handleAnimationStart = this.handleAnimationStart.bind(this); 47 | this.renderFrontface = this.renderFrontface.bind(this); 48 | this.renderBackface = this.renderBackface.bind(this); 49 | } 50 | 51 | flip() { 52 | this.setState({ 53 | expanded: !this.state.expanded, 54 | }); 55 | } 56 | 57 | handleAnimationStart(duration, height) { 58 | const isExpanding = this.state.expanded; 59 | 60 | const animationConfig = { 61 | duration, 62 | update: { 63 | type: isExpanding ? LayoutAnimation.Types.easeOut : LayoutAnimation.Types.easeIn, 64 | property: LayoutAnimation.Properties.height, 65 | }, 66 | }; 67 | 68 | LayoutAnimation.configureNext(animationConfig); 69 | 70 | this.setState({ 71 | height, 72 | }); 73 | } 74 | 75 | renderFrontface() { 76 | return ( 77 | 78 | ); 79 | } 80 | 81 | renderBackface() { 82 | return ( 83 | 84 | ); 85 | } 86 | 87 | render() { 88 | const { height } = this.state; 89 | const { zIndex } = this.props; 90 | 91 | const spacerHeight = height - ROW_HEIGHT; 92 | 93 | return ( 94 | 100 | 106 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | ); 121 | } 122 | } 123 | -------------------------------------------------------------------------------- /examples/Simple/app/components/AdditionalInfoCard.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { 4 | View, 5 | StyleSheet, 6 | } from 'react-native'; 7 | 8 | import { 9 | ThinGrayLine, 10 | ThickDarkGrayLine, 11 | } from './Lines'; 12 | 13 | export default ({ onPress }) => ( 14 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | ); 38 | -------------------------------------------------------------------------------- /examples/Simple/app/components/InfoCard.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { 4 | View, 5 | StyleSheet, 6 | } from 'react-native'; 7 | 8 | import { 9 | ThinGrayLine, 10 | ThickGrayLine, 11 | ThickDarkGrayLine, 12 | ThinRedLine, 13 | } from './Lines'; 14 | 15 | const styles = StyleSheet.create({ 16 | container: { 17 | flex: 1, 18 | backgroundColor: '#fff', 19 | flexDirection: 'row', 20 | }, 21 | leftPane: { 22 | flex: 1, 23 | backgroundColor: '#33373B', 24 | padding: 16, 25 | flexDirection: 'column', 26 | justifyContent: 'space-between', 27 | }, 28 | rightPane: { 29 | flex: 2, 30 | padding: 16, 31 | backgroundColor: '#fff', 32 | }, 33 | }); 34 | 35 | export default ({ onPress }) => ( 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | ); 68 | -------------------------------------------------------------------------------- /examples/Simple/app/components/Lines.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { 4 | View, 5 | TouchableHighlight, 6 | } from 'react-native'; 7 | 8 | const Line = ({ style, onPress }) => { 9 | if (onPress) { 10 | return ( 11 | 21 | 22 | 23 | ); 24 | } 25 | 26 | return ( 27 | 35 | ); 36 | }; 37 | 38 | const ThinLine = ({ color, width = 60, ...props }) => ( 39 | 47 | ); 48 | 49 | const ThickLine = ({ color, width = 70, ...props }) => ( 50 | 58 | ); 59 | 60 | export const ThinGrayLine = (props) => ( 61 | 62 | ); 63 | 64 | export const ThickGrayLine = (props) => ( 65 | 66 | ); 67 | 68 | export const ThickWhiteLine = (props) => ( 69 | 70 | ); 71 | 72 | export const ThickDarkGrayLine = (props) => ( 73 | 74 | ); 75 | 76 | export const ThinRedLine = (props) => ( 77 | 78 | ); 79 | -------------------------------------------------------------------------------- /examples/Simple/app/components/PhotoCard.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { 4 | View, 5 | StyleSheet, 6 | } from 'react-native'; 7 | 8 | import { 9 | ThinGrayLine, 10 | ThickWhiteLine, 11 | } from './Lines'; 12 | 13 | const styles = StyleSheet.create({ 14 | container: { 15 | flex: 1, 16 | backgroundColor: '#33373B', 17 | padding: 10, 18 | flexDirection: 'column', 19 | }, 20 | card: { 21 | flex: 1, 22 | backgroundColor: '#FFFFFF', 23 | justifyContent: 'flex-end', 24 | }, 25 | }); 26 | 27 | export default ({ onPress }) => ( 28 | 29 | 30 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | ); 61 | -------------------------------------------------------------------------------- /examples/Simple/app/components/ProfileCard.js: -------------------------------------------------------------------------------- 1 | import React, { 2 | Component, 3 | } from 'react'; 4 | 5 | import { 6 | View, 7 | Text, 8 | TouchableHighlight, 9 | StyleSheet, 10 | } from 'react-native'; 11 | 12 | import FoldView from 'react-native-foldview'; 13 | 14 | import ProfileDetailCard from './ProfileDetailCard'; 15 | import AdditionalInfoCard from './AdditionalInfoCard'; 16 | 17 | import { 18 | ThinGrayLine, 19 | ThickDarkGrayLine, 20 | } from './Lines'; 21 | 22 | export default class Row extends Component { 23 | 24 | componentWillMount() { 25 | this.renderBackface = this.renderBackface.bind(this); 26 | this.renderInnerBackFace = this.renderInnerBackFace.bind(this); 27 | } 28 | 29 | renderBlankFace() { 30 | return ( 31 | 37 | ); 38 | } 39 | 40 | renderBackface() { 41 | const onPress = this.props.onPress; 42 | return ( 43 | 44 | 45 | 49 | 50 | 51 | 52 | 53 | ); 54 | } 55 | 56 | renderInnerBackFace() { 57 | const onPress = this.props.onPress; 58 | return ( 59 | 69 | 77 | 85 | 86 | PRESS ME 87 | 88 | 89 | 90 | 91 | 92 | ); 93 | } 94 | 95 | render() { 96 | const onPress = this.props.onPress; 97 | 98 | return ( 99 | 106 | 107 | 108 | 109 | 116 | 117 | 118 | 119 | 125 | 126 | 129 | 137 | 138 | 139 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | ); 168 | } 169 | } 170 | -------------------------------------------------------------------------------- /examples/Simple/app/components/ProfileDetailCard.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { 4 | View, 5 | StyleSheet, 6 | } from 'react-native'; 7 | 8 | import { 9 | ThinGrayLine, 10 | ThickGrayLine, 11 | } from './Lines'; 12 | 13 | const styles = StyleSheet.create({ 14 | container: { 15 | flex: 1, 16 | paddingTop: 10, 17 | paddingHorizontal: 16, 18 | flexDirection: 'row', 19 | borderTopWidth: StyleSheet.hairlineWidth, 20 | borderTopColor: '#BDC2C9', 21 | }, 22 | }); 23 | 24 | export default ({ onPress }) => ( 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | ); 37 | -------------------------------------------------------------------------------- /examples/Simple/index.android.js: -------------------------------------------------------------------------------- 1 | import { AppRegistry } from 'react-native'; 2 | import ExampleList from './app/ExampleList'; 3 | 4 | AppRegistry.registerComponent('Simple', () => ExampleList); 5 | -------------------------------------------------------------------------------- /examples/Simple/index.ios.js: -------------------------------------------------------------------------------- 1 | import { AppRegistry } from 'react-native'; 2 | import ExampleList from './app/ExampleList'; 3 | 4 | AppRegistry.registerComponent('Simple', () => ExampleList); 5 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple.xcodeproj/project.pbxproj: -------------------------------------------------------------------------------- 1 | // !$*UTF8*$! 2 | { 3 | archiveVersion = 1; 4 | classes = { 5 | }; 6 | objectVersion = 46; 7 | objects = { 8 | 9 | /* Begin PBXBuildFile section */ 10 | 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; }; 11 | 00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; }; 12 | 00C302E81ABCBA2D00DB3ED1 /* libRCTImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302C01ABCB91800DB3ED1 /* libRCTImage.a */; }; 13 | 00C302E91ABCBA2D00DB3ED1 /* libRCTNetwork.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302DC1ABCB9D200DB3ED1 /* libRCTNetwork.a */; }; 14 | 00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302E41ABCB9EE00DB3ED1 /* libRCTVibration.a */; }; 15 | 00E356F31AD99517003FC87E /* SimpleTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* SimpleTests.m */; }; 16 | 133E29F31AD74F7200F7D852 /* libRCTLinking.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 78C398B91ACF4ADC00677621 /* libRCTLinking.a */; }; 17 | 139105C61AF99C1200B5F7CC /* libRCTSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139105C11AF99BAD00B5F7CC /* libRCTSettings.a */; }; 18 | 139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139FDEF41B06529B00C62182 /* libRCTWebSocket.a */; }; 19 | 13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; }; 20 | 13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; }; 21 | 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; }; 22 | 13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; }; 23 | 140ED2AC1D01E1AD002B40FF /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; }; 24 | 146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; }; 25 | 5E9157361DD0AC6A00FF2AA8 /* libRCTAnimation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */; }; 26 | 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; }; 27 | /* End PBXBuildFile section */ 28 | 29 | /* Begin PBXContainerItemProxy section */ 30 | 00C302AB1ABCB8CE00DB3ED1 /* PBXContainerItemProxy */ = { 31 | isa = PBXContainerItemProxy; 32 | containerPortal = 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */; 33 | proxyType = 2; 34 | remoteGlobalIDString = 134814201AA4EA6300B7C361; 35 | remoteInfo = RCTActionSheet; 36 | }; 37 | 00C302B91ABCB90400DB3ED1 /* PBXContainerItemProxy */ = { 38 | isa = PBXContainerItemProxy; 39 | containerPortal = 00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */; 40 | proxyType = 2; 41 | remoteGlobalIDString = 134814201AA4EA6300B7C361; 42 | remoteInfo = RCTGeolocation; 43 | }; 44 | 00C302BF1ABCB91800DB3ED1 /* PBXContainerItemProxy */ = { 45 | isa = PBXContainerItemProxy; 46 | containerPortal = 00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */; 47 | proxyType = 2; 48 | remoteGlobalIDString = 58B5115D1A9E6B3D00147676; 49 | remoteInfo = RCTImage; 50 | }; 51 | 00C302DB1ABCB9D200DB3ED1 /* PBXContainerItemProxy */ = { 52 | isa = PBXContainerItemProxy; 53 | containerPortal = 00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */; 54 | proxyType = 2; 55 | remoteGlobalIDString = 58B511DB1A9E6C8500147676; 56 | remoteInfo = RCTNetwork; 57 | }; 58 | 00C302E31ABCB9EE00DB3ED1 /* PBXContainerItemProxy */ = { 59 | isa = PBXContainerItemProxy; 60 | containerPortal = 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */; 61 | proxyType = 2; 62 | remoteGlobalIDString = 832C81801AAF6DEF007FA2F7; 63 | remoteInfo = RCTVibration; 64 | }; 65 | 00E356F41AD99517003FC87E /* PBXContainerItemProxy */ = { 66 | isa = PBXContainerItemProxy; 67 | containerPortal = 83CBB9F71A601CBA00E9B192 /* Project object */; 68 | proxyType = 1; 69 | remoteGlobalIDString = 13B07F861A680F5B00A75B9A; 70 | remoteInfo = Simple; 71 | }; 72 | 139105C01AF99BAD00B5F7CC /* PBXContainerItemProxy */ = { 73 | isa = PBXContainerItemProxy; 74 | containerPortal = 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */; 75 | proxyType = 2; 76 | remoteGlobalIDString = 134814201AA4EA6300B7C361; 77 | remoteInfo = RCTSettings; 78 | }; 79 | 139FDEF31B06529B00C62182 /* PBXContainerItemProxy */ = { 80 | isa = PBXContainerItemProxy; 81 | containerPortal = 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */; 82 | proxyType = 2; 83 | remoteGlobalIDString = 3C86DF461ADF2C930047B81A; 84 | remoteInfo = RCTWebSocket; 85 | }; 86 | 146834031AC3E56700842450 /* PBXContainerItemProxy */ = { 87 | isa = PBXContainerItemProxy; 88 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 89 | proxyType = 2; 90 | remoteGlobalIDString = 83CBBA2E1A601D0E00E9B192; 91 | remoteInfo = React; 92 | }; 93 | 3DAD3E831DF850E9000B6D8A /* PBXContainerItemProxy */ = { 94 | isa = PBXContainerItemProxy; 95 | containerPortal = 00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */; 96 | proxyType = 2; 97 | remoteGlobalIDString = 2D2A283A1D9B042B00D4039D; 98 | remoteInfo = "RCTImage-tvOS"; 99 | }; 100 | 3DAD3E871DF850E9000B6D8A /* PBXContainerItemProxy */ = { 101 | isa = PBXContainerItemProxy; 102 | containerPortal = 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */; 103 | proxyType = 2; 104 | remoteGlobalIDString = 2D2A28471D9B043800D4039D; 105 | remoteInfo = "RCTLinking-tvOS"; 106 | }; 107 | 3DAD3E8B1DF850E9000B6D8A /* PBXContainerItemProxy */ = { 108 | isa = PBXContainerItemProxy; 109 | containerPortal = 00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */; 110 | proxyType = 2; 111 | remoteGlobalIDString = 2D2A28541D9B044C00D4039D; 112 | remoteInfo = "RCTNetwork-tvOS"; 113 | }; 114 | 3DAD3E8F1DF850E9000B6D8A /* PBXContainerItemProxy */ = { 115 | isa = PBXContainerItemProxy; 116 | containerPortal = 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */; 117 | proxyType = 2; 118 | remoteGlobalIDString = 2D2A28611D9B046600D4039D; 119 | remoteInfo = "RCTSettings-tvOS"; 120 | }; 121 | 3DAD3E931DF850E9000B6D8A /* PBXContainerItemProxy */ = { 122 | isa = PBXContainerItemProxy; 123 | containerPortal = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */; 124 | proxyType = 2; 125 | remoteGlobalIDString = 2D2A287B1D9B048500D4039D; 126 | remoteInfo = "RCTText-tvOS"; 127 | }; 128 | 3DAD3E981DF850E9000B6D8A /* PBXContainerItemProxy */ = { 129 | isa = PBXContainerItemProxy; 130 | containerPortal = 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */; 131 | proxyType = 2; 132 | remoteGlobalIDString = 2D2A28881D9B049200D4039D; 133 | remoteInfo = "RCTWebSocket-tvOS"; 134 | }; 135 | 3DAD3EA21DF850E9000B6D8A /* PBXContainerItemProxy */ = { 136 | isa = PBXContainerItemProxy; 137 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 138 | proxyType = 2; 139 | remoteGlobalIDString = 2D2A28131D9B038B00D4039D; 140 | remoteInfo = "React-tvOS"; 141 | }; 142 | 3DAD3EA41DF850E9000B6D8A /* PBXContainerItemProxy */ = { 143 | isa = PBXContainerItemProxy; 144 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 145 | proxyType = 2; 146 | remoteGlobalIDString = 3D3C059A1DE3340900C268FA; 147 | remoteInfo = yoga; 148 | }; 149 | 3DAD3EA61DF850E9000B6D8A /* PBXContainerItemProxy */ = { 150 | isa = PBXContainerItemProxy; 151 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 152 | proxyType = 2; 153 | remoteGlobalIDString = 3D3C06751DE3340C00C268FA; 154 | remoteInfo = "yoga-tvOS"; 155 | }; 156 | 3DAD3EA81DF850E9000B6D8A /* PBXContainerItemProxy */ = { 157 | isa = PBXContainerItemProxy; 158 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 159 | proxyType = 2; 160 | remoteGlobalIDString = 3D3CD9251DE5FBEC00167DC4; 161 | remoteInfo = cxxreact; 162 | }; 163 | 3DAD3EAA1DF850E9000B6D8A /* PBXContainerItemProxy */ = { 164 | isa = PBXContainerItemProxy; 165 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 166 | proxyType = 2; 167 | remoteGlobalIDString = 3D3CD9321DE5FBEE00167DC4; 168 | remoteInfo = "cxxreact-tvOS"; 169 | }; 170 | 3DAD3EAC1DF850E9000B6D8A /* PBXContainerItemProxy */ = { 171 | isa = PBXContainerItemProxy; 172 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 173 | proxyType = 2; 174 | remoteGlobalIDString = 3D3CD90B1DE5FBD600167DC4; 175 | remoteInfo = jschelpers; 176 | }; 177 | 3DAD3EAE1DF850E9000B6D8A /* PBXContainerItemProxy */ = { 178 | isa = PBXContainerItemProxy; 179 | containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */; 180 | proxyType = 2; 181 | remoteGlobalIDString = 3D3CD9181DE5FBD800167DC4; 182 | remoteInfo = "jschelpers-tvOS"; 183 | }; 184 | 5E9157321DD0AC6500FF2AA8 /* PBXContainerItemProxy */ = { 185 | isa = PBXContainerItemProxy; 186 | containerPortal = 5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */; 187 | proxyType = 2; 188 | remoteGlobalIDString = 134814201AA4EA6300B7C361; 189 | remoteInfo = RCTAnimation; 190 | }; 191 | 5E9157341DD0AC6500FF2AA8 /* PBXContainerItemProxy */ = { 192 | isa = PBXContainerItemProxy; 193 | containerPortal = 5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */; 194 | proxyType = 2; 195 | remoteGlobalIDString = 2D2A28201D9B03D100D4039D; 196 | remoteInfo = "RCTAnimation-tvOS"; 197 | }; 198 | 78C398B81ACF4ADC00677621 /* PBXContainerItemProxy */ = { 199 | isa = PBXContainerItemProxy; 200 | containerPortal = 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */; 201 | proxyType = 2; 202 | remoteGlobalIDString = 134814201AA4EA6300B7C361; 203 | remoteInfo = RCTLinking; 204 | }; 205 | 832341B41AAA6A8300B99B32 /* PBXContainerItemProxy */ = { 206 | isa = PBXContainerItemProxy; 207 | containerPortal = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */; 208 | proxyType = 2; 209 | remoteGlobalIDString = 58B5119B1A9E6C1200147676; 210 | remoteInfo = RCTText; 211 | }; 212 | /* End PBXContainerItemProxy section */ 213 | 214 | /* Begin PBXFileReference section */ 215 | 008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = ""; }; 216 | 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = "../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj"; sourceTree = ""; }; 217 | 00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = "../node_modules/react-native/Libraries/Geolocation/RCTGeolocation.xcodeproj"; sourceTree = ""; }; 218 | 00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = "../node_modules/react-native/Libraries/Image/RCTImage.xcodeproj"; sourceTree = ""; }; 219 | 00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = "../node_modules/react-native/Libraries/Network/RCTNetwork.xcodeproj"; sourceTree = ""; }; 220 | 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = "../node_modules/react-native/Libraries/Vibration/RCTVibration.xcodeproj"; sourceTree = ""; }; 221 | 00E356EE1AD99517003FC87E /* SimpleTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = SimpleTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; }; 222 | 00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = ""; }; 223 | 00E356F21AD99517003FC87E /* SimpleTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = SimpleTests.m; sourceTree = ""; }; 224 | 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = "../node_modules/react-native/Libraries/Settings/RCTSettings.xcodeproj"; sourceTree = ""; }; 225 | 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = "../node_modules/react-native/Libraries/WebSocket/RCTWebSocket.xcodeproj"; sourceTree = ""; }; 226 | 13B07F961A680F5B00A75B9A /* Simple.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = Simple.app; sourceTree = BUILT_PRODUCTS_DIR; }; 227 | 13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = Simple/AppDelegate.h; sourceTree = ""; }; 228 | 13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = Simple/AppDelegate.m; sourceTree = ""; }; 229 | 13B07FB21A68108700A75B9A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/LaunchScreen.xib; sourceTree = ""; }; 230 | 13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = Simple/Images.xcassets; sourceTree = ""; }; 231 | 13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = Simple/Info.plist; sourceTree = ""; }; 232 | 13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = Simple/main.m; sourceTree = ""; }; 233 | 146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = "../node_modules/react-native/React/React.xcodeproj"; sourceTree = ""; }; 234 | 5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAnimation.xcodeproj; path = "../node_modules/react-native/Libraries/NativeAnimation/RCTAnimation.xcodeproj"; sourceTree = ""; }; 235 | 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = "../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj"; sourceTree = ""; }; 236 | 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = "../node_modules/react-native/Libraries/Text/RCTText.xcodeproj"; sourceTree = ""; }; 237 | /* End PBXFileReference section */ 238 | 239 | /* Begin PBXFrameworksBuildPhase section */ 240 | 00E356EB1AD99517003FC87E /* Frameworks */ = { 241 | isa = PBXFrameworksBuildPhase; 242 | buildActionMask = 2147483647; 243 | files = ( 244 | 140ED2AC1D01E1AD002B40FF /* libReact.a in Frameworks */, 245 | ); 246 | runOnlyForDeploymentPostprocessing = 0; 247 | }; 248 | 13B07F8C1A680F5B00A75B9A /* Frameworks */ = { 249 | isa = PBXFrameworksBuildPhase; 250 | buildActionMask = 2147483647; 251 | files = ( 252 | 5E9157361DD0AC6A00FF2AA8 /* libRCTAnimation.a in Frameworks */, 253 | 146834051AC3E58100842450 /* libReact.a in Frameworks */, 254 | 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */, 255 | 00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */, 256 | 00C302E81ABCBA2D00DB3ED1 /* libRCTImage.a in Frameworks */, 257 | 133E29F31AD74F7200F7D852 /* libRCTLinking.a in Frameworks */, 258 | 00C302E91ABCBA2D00DB3ED1 /* libRCTNetwork.a in Frameworks */, 259 | 139105C61AF99C1200B5F7CC /* libRCTSettings.a in Frameworks */, 260 | 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */, 261 | 00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */, 262 | 139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */, 263 | ); 264 | runOnlyForDeploymentPostprocessing = 0; 265 | }; 266 | /* End PBXFrameworksBuildPhase section */ 267 | 268 | /* Begin PBXGroup section */ 269 | 00C302A81ABCB8CE00DB3ED1 /* Products */ = { 270 | isa = PBXGroup; 271 | children = ( 272 | 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */, 273 | ); 274 | name = Products; 275 | sourceTree = ""; 276 | }; 277 | 00C302B61ABCB90400DB3ED1 /* Products */ = { 278 | isa = PBXGroup; 279 | children = ( 280 | 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */, 281 | ); 282 | name = Products; 283 | sourceTree = ""; 284 | }; 285 | 00C302BC1ABCB91800DB3ED1 /* Products */ = { 286 | isa = PBXGroup; 287 | children = ( 288 | 00C302C01ABCB91800DB3ED1 /* libRCTImage.a */, 289 | 3DAD3E841DF850E9000B6D8A /* libRCTImage-tvOS.a */, 290 | ); 291 | name = Products; 292 | sourceTree = ""; 293 | }; 294 | 00C302D41ABCB9D200DB3ED1 /* Products */ = { 295 | isa = PBXGroup; 296 | children = ( 297 | 00C302DC1ABCB9D200DB3ED1 /* libRCTNetwork.a */, 298 | 3DAD3E8C1DF850E9000B6D8A /* libRCTNetwork-tvOS.a */, 299 | ); 300 | name = Products; 301 | sourceTree = ""; 302 | }; 303 | 00C302E01ABCB9EE00DB3ED1 /* Products */ = { 304 | isa = PBXGroup; 305 | children = ( 306 | 00C302E41ABCB9EE00DB3ED1 /* libRCTVibration.a */, 307 | ); 308 | name = Products; 309 | sourceTree = ""; 310 | }; 311 | 00E356EF1AD99517003FC87E /* SimpleTests */ = { 312 | isa = PBXGroup; 313 | children = ( 314 | 00E356F21AD99517003FC87E /* SimpleTests.m */, 315 | 00E356F01AD99517003FC87E /* Supporting Files */, 316 | ); 317 | path = SimpleTests; 318 | sourceTree = ""; 319 | }; 320 | 00E356F01AD99517003FC87E /* Supporting Files */ = { 321 | isa = PBXGroup; 322 | children = ( 323 | 00E356F11AD99517003FC87E /* Info.plist */, 324 | ); 325 | name = "Supporting Files"; 326 | sourceTree = ""; 327 | }; 328 | 139105B71AF99BAD00B5F7CC /* Products */ = { 329 | isa = PBXGroup; 330 | children = ( 331 | 139105C11AF99BAD00B5F7CC /* libRCTSettings.a */, 332 | 3DAD3E901DF850E9000B6D8A /* libRCTSettings-tvOS.a */, 333 | ); 334 | name = Products; 335 | sourceTree = ""; 336 | }; 337 | 139FDEE71B06529A00C62182 /* Products */ = { 338 | isa = PBXGroup; 339 | children = ( 340 | 139FDEF41B06529B00C62182 /* libRCTWebSocket.a */, 341 | 3DAD3E991DF850E9000B6D8A /* libRCTWebSocket-tvOS.a */, 342 | ); 343 | name = Products; 344 | sourceTree = ""; 345 | }; 346 | 13B07FAE1A68108700A75B9A /* Simple */ = { 347 | isa = PBXGroup; 348 | children = ( 349 | 008F07F21AC5B25A0029DE68 /* main.jsbundle */, 350 | 13B07FAF1A68108700A75B9A /* AppDelegate.h */, 351 | 13B07FB01A68108700A75B9A /* AppDelegate.m */, 352 | 13B07FB51A68108700A75B9A /* Images.xcassets */, 353 | 13B07FB61A68108700A75B9A /* Info.plist */, 354 | 13B07FB11A68108700A75B9A /* LaunchScreen.xib */, 355 | 13B07FB71A68108700A75B9A /* main.m */, 356 | ); 357 | name = Simple; 358 | sourceTree = ""; 359 | }; 360 | 146834001AC3E56700842450 /* Products */ = { 361 | isa = PBXGroup; 362 | children = ( 363 | 146834041AC3E56700842450 /* libReact.a */, 364 | 3DAD3EA31DF850E9000B6D8A /* libReact.a */, 365 | 3DAD3EA51DF850E9000B6D8A /* libyoga.a */, 366 | 3DAD3EA71DF850E9000B6D8A /* libyoga.a */, 367 | 3DAD3EA91DF850E9000B6D8A /* libcxxreact.a */, 368 | 3DAD3EAB1DF850E9000B6D8A /* libcxxreact.a */, 369 | 3DAD3EAD1DF850E9000B6D8A /* libjschelpers.a */, 370 | 3DAD3EAF1DF850E9000B6D8A /* libjschelpers.a */, 371 | ); 372 | name = Products; 373 | sourceTree = ""; 374 | }; 375 | 5E91572E1DD0AC6500FF2AA8 /* Products */ = { 376 | isa = PBXGroup; 377 | children = ( 378 | 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */, 379 | 5E9157351DD0AC6500FF2AA8 /* libRCTAnimation-tvOS.a */, 380 | ); 381 | name = Products; 382 | sourceTree = ""; 383 | }; 384 | 78C398B11ACF4ADC00677621 /* Products */ = { 385 | isa = PBXGroup; 386 | children = ( 387 | 78C398B91ACF4ADC00677621 /* libRCTLinking.a */, 388 | 3DAD3E881DF850E9000B6D8A /* libRCTLinking-tvOS.a */, 389 | ); 390 | name = Products; 391 | sourceTree = ""; 392 | }; 393 | 832341AE1AAA6A7D00B99B32 /* Libraries */ = { 394 | isa = PBXGroup; 395 | children = ( 396 | 5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */, 397 | 146833FF1AC3E56700842450 /* React.xcodeproj */, 398 | 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */, 399 | 00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */, 400 | 00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */, 401 | 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */, 402 | 00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */, 403 | 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */, 404 | 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */, 405 | 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */, 406 | 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */, 407 | ); 408 | name = Libraries; 409 | sourceTree = ""; 410 | }; 411 | 832341B11AAA6A8300B99B32 /* Products */ = { 412 | isa = PBXGroup; 413 | children = ( 414 | 832341B51AAA6A8300B99B32 /* libRCTText.a */, 415 | 3DAD3E941DF850E9000B6D8A /* libRCTText-tvOS.a */, 416 | ); 417 | name = Products; 418 | sourceTree = ""; 419 | }; 420 | 83CBB9F61A601CBA00E9B192 = { 421 | isa = PBXGroup; 422 | children = ( 423 | 13B07FAE1A68108700A75B9A /* Simple */, 424 | 832341AE1AAA6A7D00B99B32 /* Libraries */, 425 | 00E356EF1AD99517003FC87E /* SimpleTests */, 426 | 83CBBA001A601CBA00E9B192 /* Products */, 427 | ); 428 | indentWidth = 2; 429 | sourceTree = ""; 430 | tabWidth = 2; 431 | }; 432 | 83CBBA001A601CBA00E9B192 /* Products */ = { 433 | isa = PBXGroup; 434 | children = ( 435 | 13B07F961A680F5B00A75B9A /* Simple.app */, 436 | 00E356EE1AD99517003FC87E /* SimpleTests.xctest */, 437 | ); 438 | name = Products; 439 | sourceTree = ""; 440 | }; 441 | /* End PBXGroup section */ 442 | 443 | /* Begin PBXNativeTarget section */ 444 | 00E356ED1AD99517003FC87E /* SimpleTests */ = { 445 | isa = PBXNativeTarget; 446 | buildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "SimpleTests" */; 447 | buildPhases = ( 448 | 00E356EA1AD99517003FC87E /* Sources */, 449 | 00E356EB1AD99517003FC87E /* Frameworks */, 450 | 00E356EC1AD99517003FC87E /* Resources */, 451 | ); 452 | buildRules = ( 453 | ); 454 | dependencies = ( 455 | 00E356F51AD99517003FC87E /* PBXTargetDependency */, 456 | ); 457 | name = SimpleTests; 458 | productName = SimpleTests; 459 | productReference = 00E356EE1AD99517003FC87E /* SimpleTests.xctest */; 460 | productType = "com.apple.product-type.bundle.unit-test"; 461 | }; 462 | 13B07F861A680F5B00A75B9A /* Simple */ = { 463 | isa = PBXNativeTarget; 464 | buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "Simple" */; 465 | buildPhases = ( 466 | 13B07F871A680F5B00A75B9A /* Sources */, 467 | 13B07F8C1A680F5B00A75B9A /* Frameworks */, 468 | 13B07F8E1A680F5B00A75B9A /* Resources */, 469 | 00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */, 470 | ); 471 | buildRules = ( 472 | ); 473 | dependencies = ( 474 | ); 475 | name = Simple; 476 | productName = "Hello World"; 477 | productReference = 13B07F961A680F5B00A75B9A /* Simple.app */; 478 | productType = "com.apple.product-type.application"; 479 | }; 480 | /* End PBXNativeTarget section */ 481 | 482 | /* Begin PBXProject section */ 483 | 83CBB9F71A601CBA00E9B192 /* Project object */ = { 484 | isa = PBXProject; 485 | attributes = { 486 | LastUpgradeCheck = 0610; 487 | ORGANIZATIONNAME = Facebook; 488 | TargetAttributes = { 489 | 00E356ED1AD99517003FC87E = { 490 | CreatedOnToolsVersion = 6.2; 491 | TestTargetID = 13B07F861A680F5B00A75B9A; 492 | }; 493 | }; 494 | }; 495 | buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "Simple" */; 496 | compatibilityVersion = "Xcode 3.2"; 497 | developmentRegion = English; 498 | hasScannedForEncodings = 0; 499 | knownRegions = ( 500 | en, 501 | Base, 502 | ); 503 | mainGroup = 83CBB9F61A601CBA00E9B192; 504 | productRefGroup = 83CBBA001A601CBA00E9B192 /* Products */; 505 | projectDirPath = ""; 506 | projectReferences = ( 507 | { 508 | ProductGroup = 00C302A81ABCB8CE00DB3ED1 /* Products */; 509 | ProjectRef = 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */; 510 | }, 511 | { 512 | ProductGroup = 5E91572E1DD0AC6500FF2AA8 /* Products */; 513 | ProjectRef = 5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */; 514 | }, 515 | { 516 | ProductGroup = 00C302B61ABCB90400DB3ED1 /* Products */; 517 | ProjectRef = 00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */; 518 | }, 519 | { 520 | ProductGroup = 00C302BC1ABCB91800DB3ED1 /* Products */; 521 | ProjectRef = 00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */; 522 | }, 523 | { 524 | ProductGroup = 78C398B11ACF4ADC00677621 /* Products */; 525 | ProjectRef = 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */; 526 | }, 527 | { 528 | ProductGroup = 00C302D41ABCB9D200DB3ED1 /* Products */; 529 | ProjectRef = 00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */; 530 | }, 531 | { 532 | ProductGroup = 139105B71AF99BAD00B5F7CC /* Products */; 533 | ProjectRef = 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */; 534 | }, 535 | { 536 | ProductGroup = 832341B11AAA6A8300B99B32 /* Products */; 537 | ProjectRef = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */; 538 | }, 539 | { 540 | ProductGroup = 00C302E01ABCB9EE00DB3ED1 /* Products */; 541 | ProjectRef = 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */; 542 | }, 543 | { 544 | ProductGroup = 139FDEE71B06529A00C62182 /* Products */; 545 | ProjectRef = 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */; 546 | }, 547 | { 548 | ProductGroup = 146834001AC3E56700842450 /* Products */; 549 | ProjectRef = 146833FF1AC3E56700842450 /* React.xcodeproj */; 550 | }, 551 | ); 552 | projectRoot = ""; 553 | targets = ( 554 | 13B07F861A680F5B00A75B9A /* Simple */, 555 | 00E356ED1AD99517003FC87E /* SimpleTests */, 556 | ); 557 | }; 558 | /* End PBXProject section */ 559 | 560 | /* Begin PBXReferenceProxy section */ 561 | 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */ = { 562 | isa = PBXReferenceProxy; 563 | fileType = archive.ar; 564 | path = libRCTActionSheet.a; 565 | remoteRef = 00C302AB1ABCB8CE00DB3ED1 /* PBXContainerItemProxy */; 566 | sourceTree = BUILT_PRODUCTS_DIR; 567 | }; 568 | 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */ = { 569 | isa = PBXReferenceProxy; 570 | fileType = archive.ar; 571 | path = libRCTGeolocation.a; 572 | remoteRef = 00C302B91ABCB90400DB3ED1 /* PBXContainerItemProxy */; 573 | sourceTree = BUILT_PRODUCTS_DIR; 574 | }; 575 | 00C302C01ABCB91800DB3ED1 /* libRCTImage.a */ = { 576 | isa = PBXReferenceProxy; 577 | fileType = archive.ar; 578 | path = libRCTImage.a; 579 | remoteRef = 00C302BF1ABCB91800DB3ED1 /* PBXContainerItemProxy */; 580 | sourceTree = BUILT_PRODUCTS_DIR; 581 | }; 582 | 00C302DC1ABCB9D200DB3ED1 /* libRCTNetwork.a */ = { 583 | isa = PBXReferenceProxy; 584 | fileType = archive.ar; 585 | path = libRCTNetwork.a; 586 | remoteRef = 00C302DB1ABCB9D200DB3ED1 /* PBXContainerItemProxy */; 587 | sourceTree = BUILT_PRODUCTS_DIR; 588 | }; 589 | 00C302E41ABCB9EE00DB3ED1 /* libRCTVibration.a */ = { 590 | isa = PBXReferenceProxy; 591 | fileType = archive.ar; 592 | path = libRCTVibration.a; 593 | remoteRef = 00C302E31ABCB9EE00DB3ED1 /* PBXContainerItemProxy */; 594 | sourceTree = BUILT_PRODUCTS_DIR; 595 | }; 596 | 139105C11AF99BAD00B5F7CC /* libRCTSettings.a */ = { 597 | isa = PBXReferenceProxy; 598 | fileType = archive.ar; 599 | path = libRCTSettings.a; 600 | remoteRef = 139105C01AF99BAD00B5F7CC /* PBXContainerItemProxy */; 601 | sourceTree = BUILT_PRODUCTS_DIR; 602 | }; 603 | 139FDEF41B06529B00C62182 /* libRCTWebSocket.a */ = { 604 | isa = PBXReferenceProxy; 605 | fileType = archive.ar; 606 | path = libRCTWebSocket.a; 607 | remoteRef = 139FDEF31B06529B00C62182 /* PBXContainerItemProxy */; 608 | sourceTree = BUILT_PRODUCTS_DIR; 609 | }; 610 | 146834041AC3E56700842450 /* libReact.a */ = { 611 | isa = PBXReferenceProxy; 612 | fileType = archive.ar; 613 | path = libReact.a; 614 | remoteRef = 146834031AC3E56700842450 /* PBXContainerItemProxy */; 615 | sourceTree = BUILT_PRODUCTS_DIR; 616 | }; 617 | 3DAD3E841DF850E9000B6D8A /* libRCTImage-tvOS.a */ = { 618 | isa = PBXReferenceProxy; 619 | fileType = archive.ar; 620 | path = "libRCTImage-tvOS.a"; 621 | remoteRef = 3DAD3E831DF850E9000B6D8A /* PBXContainerItemProxy */; 622 | sourceTree = BUILT_PRODUCTS_DIR; 623 | }; 624 | 3DAD3E881DF850E9000B6D8A /* libRCTLinking-tvOS.a */ = { 625 | isa = PBXReferenceProxy; 626 | fileType = archive.ar; 627 | path = "libRCTLinking-tvOS.a"; 628 | remoteRef = 3DAD3E871DF850E9000B6D8A /* PBXContainerItemProxy */; 629 | sourceTree = BUILT_PRODUCTS_DIR; 630 | }; 631 | 3DAD3E8C1DF850E9000B6D8A /* libRCTNetwork-tvOS.a */ = { 632 | isa = PBXReferenceProxy; 633 | fileType = archive.ar; 634 | path = "libRCTNetwork-tvOS.a"; 635 | remoteRef = 3DAD3E8B1DF850E9000B6D8A /* PBXContainerItemProxy */; 636 | sourceTree = BUILT_PRODUCTS_DIR; 637 | }; 638 | 3DAD3E901DF850E9000B6D8A /* libRCTSettings-tvOS.a */ = { 639 | isa = PBXReferenceProxy; 640 | fileType = archive.ar; 641 | path = "libRCTSettings-tvOS.a"; 642 | remoteRef = 3DAD3E8F1DF850E9000B6D8A /* PBXContainerItemProxy */; 643 | sourceTree = BUILT_PRODUCTS_DIR; 644 | }; 645 | 3DAD3E941DF850E9000B6D8A /* libRCTText-tvOS.a */ = { 646 | isa = PBXReferenceProxy; 647 | fileType = archive.ar; 648 | path = "libRCTText-tvOS.a"; 649 | remoteRef = 3DAD3E931DF850E9000B6D8A /* PBXContainerItemProxy */; 650 | sourceTree = BUILT_PRODUCTS_DIR; 651 | }; 652 | 3DAD3E991DF850E9000B6D8A /* libRCTWebSocket-tvOS.a */ = { 653 | isa = PBXReferenceProxy; 654 | fileType = archive.ar; 655 | path = "libRCTWebSocket-tvOS.a"; 656 | remoteRef = 3DAD3E981DF850E9000B6D8A /* PBXContainerItemProxy */; 657 | sourceTree = BUILT_PRODUCTS_DIR; 658 | }; 659 | 3DAD3EA31DF850E9000B6D8A /* libReact.a */ = { 660 | isa = PBXReferenceProxy; 661 | fileType = archive.ar; 662 | path = libReact.a; 663 | remoteRef = 3DAD3EA21DF850E9000B6D8A /* PBXContainerItemProxy */; 664 | sourceTree = BUILT_PRODUCTS_DIR; 665 | }; 666 | 3DAD3EA51DF850E9000B6D8A /* libyoga.a */ = { 667 | isa = PBXReferenceProxy; 668 | fileType = archive.ar; 669 | path = libyoga.a; 670 | remoteRef = 3DAD3EA41DF850E9000B6D8A /* PBXContainerItemProxy */; 671 | sourceTree = BUILT_PRODUCTS_DIR; 672 | }; 673 | 3DAD3EA71DF850E9000B6D8A /* libyoga.a */ = { 674 | isa = PBXReferenceProxy; 675 | fileType = archive.ar; 676 | path = libyoga.a; 677 | remoteRef = 3DAD3EA61DF850E9000B6D8A /* PBXContainerItemProxy */; 678 | sourceTree = BUILT_PRODUCTS_DIR; 679 | }; 680 | 3DAD3EA91DF850E9000B6D8A /* libcxxreact.a */ = { 681 | isa = PBXReferenceProxy; 682 | fileType = archive.ar; 683 | path = libcxxreact.a; 684 | remoteRef = 3DAD3EA81DF850E9000B6D8A /* PBXContainerItemProxy */; 685 | sourceTree = BUILT_PRODUCTS_DIR; 686 | }; 687 | 3DAD3EAB1DF850E9000B6D8A /* libcxxreact.a */ = { 688 | isa = PBXReferenceProxy; 689 | fileType = archive.ar; 690 | path = libcxxreact.a; 691 | remoteRef = 3DAD3EAA1DF850E9000B6D8A /* PBXContainerItemProxy */; 692 | sourceTree = BUILT_PRODUCTS_DIR; 693 | }; 694 | 3DAD3EAD1DF850E9000B6D8A /* libjschelpers.a */ = { 695 | isa = PBXReferenceProxy; 696 | fileType = archive.ar; 697 | path = libjschelpers.a; 698 | remoteRef = 3DAD3EAC1DF850E9000B6D8A /* PBXContainerItemProxy */; 699 | sourceTree = BUILT_PRODUCTS_DIR; 700 | }; 701 | 3DAD3EAF1DF850E9000B6D8A /* libjschelpers.a */ = { 702 | isa = PBXReferenceProxy; 703 | fileType = archive.ar; 704 | path = libjschelpers.a; 705 | remoteRef = 3DAD3EAE1DF850E9000B6D8A /* PBXContainerItemProxy */; 706 | sourceTree = BUILT_PRODUCTS_DIR; 707 | }; 708 | 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */ = { 709 | isa = PBXReferenceProxy; 710 | fileType = archive.ar; 711 | path = libRCTAnimation.a; 712 | remoteRef = 5E9157321DD0AC6500FF2AA8 /* PBXContainerItemProxy */; 713 | sourceTree = BUILT_PRODUCTS_DIR; 714 | }; 715 | 5E9157351DD0AC6500FF2AA8 /* libRCTAnimation-tvOS.a */ = { 716 | isa = PBXReferenceProxy; 717 | fileType = archive.ar; 718 | path = "libRCTAnimation-tvOS.a"; 719 | remoteRef = 5E9157341DD0AC6500FF2AA8 /* PBXContainerItemProxy */; 720 | sourceTree = BUILT_PRODUCTS_DIR; 721 | }; 722 | 78C398B91ACF4ADC00677621 /* libRCTLinking.a */ = { 723 | isa = PBXReferenceProxy; 724 | fileType = archive.ar; 725 | path = libRCTLinking.a; 726 | remoteRef = 78C398B81ACF4ADC00677621 /* PBXContainerItemProxy */; 727 | sourceTree = BUILT_PRODUCTS_DIR; 728 | }; 729 | 832341B51AAA6A8300B99B32 /* libRCTText.a */ = { 730 | isa = PBXReferenceProxy; 731 | fileType = archive.ar; 732 | path = libRCTText.a; 733 | remoteRef = 832341B41AAA6A8300B99B32 /* PBXContainerItemProxy */; 734 | sourceTree = BUILT_PRODUCTS_DIR; 735 | }; 736 | /* End PBXReferenceProxy section */ 737 | 738 | /* Begin PBXResourcesBuildPhase section */ 739 | 00E356EC1AD99517003FC87E /* Resources */ = { 740 | isa = PBXResourcesBuildPhase; 741 | buildActionMask = 2147483647; 742 | files = ( 743 | ); 744 | runOnlyForDeploymentPostprocessing = 0; 745 | }; 746 | 13B07F8E1A680F5B00A75B9A /* Resources */ = { 747 | isa = PBXResourcesBuildPhase; 748 | buildActionMask = 2147483647; 749 | files = ( 750 | 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */, 751 | 13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */, 752 | ); 753 | runOnlyForDeploymentPostprocessing = 0; 754 | }; 755 | /* End PBXResourcesBuildPhase section */ 756 | 757 | /* Begin PBXShellScriptBuildPhase section */ 758 | 00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = { 759 | isa = PBXShellScriptBuildPhase; 760 | buildActionMask = 2147483647; 761 | files = ( 762 | ); 763 | inputPaths = ( 764 | ); 765 | name = "Bundle React Native code and images"; 766 | outputPaths = ( 767 | ); 768 | runOnlyForDeploymentPostprocessing = 0; 769 | shellPath = /bin/sh; 770 | shellScript = "export NODE_BINARY=node\n../node_modules/react-native/packager/react-native-xcode.sh"; 771 | }; 772 | /* End PBXShellScriptBuildPhase section */ 773 | 774 | /* Begin PBXSourcesBuildPhase section */ 775 | 00E356EA1AD99517003FC87E /* Sources */ = { 776 | isa = PBXSourcesBuildPhase; 777 | buildActionMask = 2147483647; 778 | files = ( 779 | 00E356F31AD99517003FC87E /* SimpleTests.m in Sources */, 780 | ); 781 | runOnlyForDeploymentPostprocessing = 0; 782 | }; 783 | 13B07F871A680F5B00A75B9A /* Sources */ = { 784 | isa = PBXSourcesBuildPhase; 785 | buildActionMask = 2147483647; 786 | files = ( 787 | 13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */, 788 | 13B07FC11A68108700A75B9A /* main.m in Sources */, 789 | ); 790 | runOnlyForDeploymentPostprocessing = 0; 791 | }; 792 | /* End PBXSourcesBuildPhase section */ 793 | 794 | /* Begin PBXTargetDependency section */ 795 | 00E356F51AD99517003FC87E /* PBXTargetDependency */ = { 796 | isa = PBXTargetDependency; 797 | target = 13B07F861A680F5B00A75B9A /* Simple */; 798 | targetProxy = 00E356F41AD99517003FC87E /* PBXContainerItemProxy */; 799 | }; 800 | /* End PBXTargetDependency section */ 801 | 802 | /* Begin PBXVariantGroup section */ 803 | 13B07FB11A68108700A75B9A /* LaunchScreen.xib */ = { 804 | isa = PBXVariantGroup; 805 | children = ( 806 | 13B07FB21A68108700A75B9A /* Base */, 807 | ); 808 | name = LaunchScreen.xib; 809 | path = Simple; 810 | sourceTree = ""; 811 | }; 812 | /* End PBXVariantGroup section */ 813 | 814 | /* Begin XCBuildConfiguration section */ 815 | 00E356F61AD99517003FC87E /* Debug */ = { 816 | isa = XCBuildConfiguration; 817 | buildSettings = { 818 | BUNDLE_LOADER = "$(TEST_HOST)"; 819 | GCC_PREPROCESSOR_DEFINITIONS = ( 820 | "DEBUG=1", 821 | "$(inherited)", 822 | ); 823 | INFOPLIST_FILE = SimpleTests/Info.plist; 824 | IPHONEOS_DEPLOYMENT_TARGET = 8.0; 825 | LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks"; 826 | PRODUCT_NAME = "$(TARGET_NAME)"; 827 | TEST_HOST = "$(BUILT_PRODUCTS_DIR)/Simple.app/Simple"; 828 | }; 829 | name = Debug; 830 | }; 831 | 00E356F71AD99517003FC87E /* Release */ = { 832 | isa = XCBuildConfiguration; 833 | buildSettings = { 834 | BUNDLE_LOADER = "$(TEST_HOST)"; 835 | COPY_PHASE_STRIP = NO; 836 | INFOPLIST_FILE = SimpleTests/Info.plist; 837 | IPHONEOS_DEPLOYMENT_TARGET = 8.0; 838 | LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks"; 839 | PRODUCT_NAME = "$(TARGET_NAME)"; 840 | TEST_HOST = "$(BUILT_PRODUCTS_DIR)/Simple.app/Simple"; 841 | }; 842 | name = Release; 843 | }; 844 | 13B07F941A680F5B00A75B9A /* Debug */ = { 845 | isa = XCBuildConfiguration; 846 | buildSettings = { 847 | ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; 848 | CURRENT_PROJECT_VERSION = 1; 849 | DEAD_CODE_STRIPPING = NO; 850 | INFOPLIST_FILE = Simple/Info.plist; 851 | LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; 852 | OTHER_LDFLAGS = ( 853 | "$(inherited)", 854 | "-ObjC", 855 | "-lc++", 856 | ); 857 | PRODUCT_NAME = Simple; 858 | VERSIONING_SYSTEM = "apple-generic"; 859 | }; 860 | name = Debug; 861 | }; 862 | 13B07F951A680F5B00A75B9A /* Release */ = { 863 | isa = XCBuildConfiguration; 864 | buildSettings = { 865 | ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; 866 | CURRENT_PROJECT_VERSION = 1; 867 | INFOPLIST_FILE = Simple/Info.plist; 868 | LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; 869 | OTHER_LDFLAGS = ( 870 | "$(inherited)", 871 | "-ObjC", 872 | "-lc++", 873 | ); 874 | PRODUCT_NAME = Simple; 875 | VERSIONING_SYSTEM = "apple-generic"; 876 | }; 877 | name = Release; 878 | }; 879 | 83CBBA201A601CBA00E9B192 /* Debug */ = { 880 | isa = XCBuildConfiguration; 881 | buildSettings = { 882 | ALWAYS_SEARCH_USER_PATHS = NO; 883 | CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x"; 884 | CLANG_CXX_LIBRARY = "libc++"; 885 | CLANG_ENABLE_MODULES = YES; 886 | CLANG_ENABLE_OBJC_ARC = YES; 887 | CLANG_WARN_BOOL_CONVERSION = YES; 888 | CLANG_WARN_CONSTANT_CONVERSION = YES; 889 | CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR; 890 | CLANG_WARN_EMPTY_BODY = YES; 891 | CLANG_WARN_ENUM_CONVERSION = YES; 892 | CLANG_WARN_INT_CONVERSION = YES; 893 | CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR; 894 | CLANG_WARN_UNREACHABLE_CODE = YES; 895 | CLANG_WARN__DUPLICATE_METHOD_MATCH = YES; 896 | "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer"; 897 | COPY_PHASE_STRIP = NO; 898 | ENABLE_STRICT_OBJC_MSGSEND = YES; 899 | GCC_C_LANGUAGE_STANDARD = gnu99; 900 | GCC_DYNAMIC_NO_PIC = NO; 901 | GCC_OPTIMIZATION_LEVEL = 0; 902 | GCC_PREPROCESSOR_DEFINITIONS = ( 903 | "DEBUG=1", 904 | "$(inherited)", 905 | ); 906 | GCC_SYMBOLS_PRIVATE_EXTERN = NO; 907 | GCC_WARN_64_TO_32_BIT_CONVERSION = YES; 908 | GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR; 909 | GCC_WARN_UNDECLARED_SELECTOR = YES; 910 | GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; 911 | GCC_WARN_UNUSED_FUNCTION = YES; 912 | GCC_WARN_UNUSED_VARIABLE = YES; 913 | IPHONEOS_DEPLOYMENT_TARGET = 8.0; 914 | MTL_ENABLE_DEBUG_INFO = YES; 915 | ONLY_ACTIVE_ARCH = YES; 916 | SDKROOT = iphoneos; 917 | }; 918 | name = Debug; 919 | }; 920 | 83CBBA211A601CBA00E9B192 /* Release */ = { 921 | isa = XCBuildConfiguration; 922 | buildSettings = { 923 | ALWAYS_SEARCH_USER_PATHS = NO; 924 | CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x"; 925 | CLANG_CXX_LIBRARY = "libc++"; 926 | CLANG_ENABLE_MODULES = YES; 927 | CLANG_ENABLE_OBJC_ARC = YES; 928 | CLANG_WARN_BOOL_CONVERSION = YES; 929 | CLANG_WARN_CONSTANT_CONVERSION = YES; 930 | CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR; 931 | CLANG_WARN_EMPTY_BODY = YES; 932 | CLANG_WARN_ENUM_CONVERSION = YES; 933 | CLANG_WARN_INT_CONVERSION = YES; 934 | CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR; 935 | CLANG_WARN_UNREACHABLE_CODE = YES; 936 | CLANG_WARN__DUPLICATE_METHOD_MATCH = YES; 937 | "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer"; 938 | COPY_PHASE_STRIP = YES; 939 | ENABLE_NS_ASSERTIONS = NO; 940 | ENABLE_STRICT_OBJC_MSGSEND = YES; 941 | GCC_C_LANGUAGE_STANDARD = gnu99; 942 | GCC_WARN_64_TO_32_BIT_CONVERSION = YES; 943 | GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR; 944 | GCC_WARN_UNDECLARED_SELECTOR = YES; 945 | GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; 946 | GCC_WARN_UNUSED_FUNCTION = YES; 947 | GCC_WARN_UNUSED_VARIABLE = YES; 948 | IPHONEOS_DEPLOYMENT_TARGET = 8.0; 949 | MTL_ENABLE_DEBUG_INFO = NO; 950 | SDKROOT = iphoneos; 951 | VALIDATE_PRODUCT = YES; 952 | }; 953 | name = Release; 954 | }; 955 | /* End XCBuildConfiguration section */ 956 | 957 | /* Begin XCConfigurationList section */ 958 | 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "SimpleTests" */ = { 959 | isa = XCConfigurationList; 960 | buildConfigurations = ( 961 | 00E356F61AD99517003FC87E /* Debug */, 962 | 00E356F71AD99517003FC87E /* Release */, 963 | ); 964 | defaultConfigurationIsVisible = 0; 965 | defaultConfigurationName = Release; 966 | }; 967 | 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "Simple" */ = { 968 | isa = XCConfigurationList; 969 | buildConfigurations = ( 970 | 13B07F941A680F5B00A75B9A /* Debug */, 971 | 13B07F951A680F5B00A75B9A /* Release */, 972 | ); 973 | defaultConfigurationIsVisible = 0; 974 | defaultConfigurationName = Release; 975 | }; 976 | 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "Simple" */ = { 977 | isa = XCConfigurationList; 978 | buildConfigurations = ( 979 | 83CBBA201A601CBA00E9B192 /* Debug */, 980 | 83CBBA211A601CBA00E9B192 /* Release */, 981 | ); 982 | defaultConfigurationIsVisible = 0; 983 | defaultConfigurationName = Release; 984 | }; 985 | /* End XCConfigurationList section */ 986 | }; 987 | rootObject = 83CBB9F71A601CBA00E9B192 /* Project object */; 988 | } 989 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple.xcodeproj/xcshareddata/xcschemes/Simple.xcscheme: -------------------------------------------------------------------------------- 1 | 2 | 5 | 8 | 9 | 15 | 21 | 22 | 23 | 29 | 35 | 36 | 37 | 43 | 49 | 50 | 51 | 52 | 53 | 58 | 59 | 61 | 67 | 68 | 69 | 70 | 71 | 77 | 78 | 79 | 80 | 81 | 82 | 92 | 94 | 100 | 101 | 102 | 103 | 104 | 105 | 111 | 113 | 119 | 120 | 121 | 122 | 124 | 125 | 128 | 129 | 130 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple/AppDelegate.h: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | #import 11 | 12 | @interface AppDelegate : UIResponder 13 | 14 | @property (nonatomic, strong) UIWindow *window; 15 | 16 | @end 17 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple/AppDelegate.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | #import "AppDelegate.h" 11 | 12 | #import 13 | #import 14 | 15 | @implementation AppDelegate 16 | 17 | - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 18 | { 19 | NSURL *jsCodeLocation; 20 | 21 | jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil]; 22 | 23 | RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation 24 | moduleName:@"Simple" 25 | initialProperties:nil 26 | launchOptions:launchOptions]; 27 | rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1]; 28 | 29 | self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds]; 30 | UIViewController *rootViewController = [UIViewController new]; 31 | rootViewController.view = rootView; 32 | self.window.rootViewController = rootViewController; 33 | [self.window makeKeyAndVisible]; 34 | return YES; 35 | } 36 | 37 | @end 38 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple/Base.lproj/LaunchScreen.xib: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 21 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple/Images.xcassets/AppIcon.appiconset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "size" : "29x29", 6 | "scale" : "2x" 7 | }, 8 | { 9 | "idiom" : "iphone", 10 | "size" : "29x29", 11 | "scale" : "3x" 12 | }, 13 | { 14 | "idiom" : "iphone", 15 | "size" : "40x40", 16 | "scale" : "2x" 17 | }, 18 | { 19 | "idiom" : "iphone", 20 | "size" : "40x40", 21 | "scale" : "3x" 22 | }, 23 | { 24 | "idiom" : "iphone", 25 | "size" : "60x60", 26 | "scale" : "2x" 27 | }, 28 | { 29 | "idiom" : "iphone", 30 | "size" : "60x60", 31 | "scale" : "3x" 32 | } 33 | ], 34 | "info" : { 35 | "version" : 1, 36 | "author" : "xcode" 37 | } 38 | } -------------------------------------------------------------------------------- /examples/Simple/ios/Simple/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | APPL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | LSRequiresIPhoneOS 24 | 25 | UILaunchStoryboardName 26 | LaunchScreen 27 | UIRequiredDeviceCapabilities 28 | 29 | armv7 30 | 31 | UISupportedInterfaceOrientations 32 | 33 | UIInterfaceOrientationPortrait 34 | UIInterfaceOrientationLandscapeLeft 35 | UIInterfaceOrientationLandscapeRight 36 | 37 | UIViewControllerBasedStatusBarAppearance 38 | 39 | NSLocationWhenInUseUsageDescription 40 | 41 | NSAppTransportSecurity 42 | 43 | 44 | NSExceptionDomains 45 | 46 | localhost 47 | 48 | NSExceptionAllowsInsecureHTTPLoads 49 | 50 | 51 | 52 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /examples/Simple/ios/Simple/main.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | #import 11 | 12 | #import "AppDelegate.h" 13 | 14 | int main(int argc, char * argv[]) { 15 | @autoreleasepool { 16 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class])); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /examples/Simple/ios/SimpleTests/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | BNDL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | 24 | 25 | -------------------------------------------------------------------------------- /examples/Simple/ios/SimpleTests/SimpleTests.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | #import 11 | #import 12 | 13 | #import 14 | #import 15 | 16 | #define TIMEOUT_SECONDS 600 17 | #define TEXT_TO_LOOK_FOR @"Welcome to React Native!" 18 | 19 | @interface SimpleTests : XCTestCase 20 | 21 | @end 22 | 23 | @implementation SimpleTests 24 | 25 | - (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test 26 | { 27 | if (test(view)) { 28 | return YES; 29 | } 30 | for (UIView *subview in [view subviews]) { 31 | if ([self findSubviewInView:subview matching:test]) { 32 | return YES; 33 | } 34 | } 35 | return NO; 36 | } 37 | 38 | - (void)testRendersWelcomeScreen 39 | { 40 | UIViewController *vc = [[[[UIApplication sharedApplication] delegate] window] rootViewController]; 41 | NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS]; 42 | BOOL foundElement = NO; 43 | 44 | __block NSString *redboxError = nil; 45 | RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) { 46 | if (level >= RCTLogLevelError) { 47 | redboxError = message; 48 | } 49 | }); 50 | 51 | while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) { 52 | [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]]; 53 | [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]]; 54 | 55 | foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) { 56 | if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) { 57 | return YES; 58 | } 59 | return NO; 60 | }]; 61 | } 62 | 63 | RCTSetLogFunction(RCTDefaultLogFunction); 64 | 65 | XCTAssertNil(redboxError, @"RedBox error: %@", redboxError); 66 | XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS); 67 | } 68 | 69 | 70 | @end 71 | -------------------------------------------------------------------------------- /examples/Simple/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Simple", 3 | "version": "0.0.1", 4 | "private": true, 5 | "scripts": { 6 | "start": "./node_modules/.bin/react-native start", 7 | "ios": "./node_modules/.bin/react-native run-ios", 8 | "android": "./node_modules/.bin/react-native run-android", 9 | "test": "jest" 10 | }, 11 | "dependencies": { 12 | "react": "^15.4.2", 13 | "react-native": "^0.40.0", 14 | "react-native-foldview": "file:../../" 15 | }, 16 | "jest": { 17 | "preset": "jest-react-native" 18 | }, 19 | "devDependencies": { 20 | "babel-jest": "18.0.0", 21 | "babel-preset-react-native": "1.9.1", 22 | "jest": "18.1.0", 23 | "jest-react-native": "18.0.0", 24 | "react-test-renderer": "15.4.2" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | import gulp from 'gulp'; 2 | import gulpESlint from 'gulp-eslint'; 3 | import gulpMocha from 'gulp-mocha'; 4 | import runSequence from 'run-sequence'; 5 | 6 | const IGNOREDDIRS = ['!**/node_modules/**']; 7 | 8 | const SRCDIR = 'src'; 9 | const EXAMPLESDIR = 'examples'; 10 | const SPECDIR = 'spec'; 11 | 12 | gulp.task('lint', () => gulp 13 | .src([ 14 | `${SRCDIR}/**/*.js`, 15 | `${SPECDIR}/**/*.js`, 16 | `${EXAMPLESDIR}/**/*.js`, 17 | 'gulpfile.js', 18 | ...IGNOREDDIRS, 19 | ]) 20 | .pipe(gulpESlint()) 21 | .pipe(gulpESlint.format()) 22 | .pipe(gulpESlint.failAfterError()), 23 | ); 24 | 25 | gulp.task('spec', () => 26 | gulp.src([ 27 | `${SPECDIR}/**/*.spec.js`, 28 | ]) 29 | .pipe(gulpMocha({ 30 | reporter: 'spec', 31 | ui: 'bdd', 32 | }))); 33 | 34 | gulp.task('copy', () => 35 | gulp.src([ 36 | `${SRCDIR}/**/*.js`, 37 | ]) 38 | .pipe(gulp.dest( 39 | `examples/Simple/node_modules/react-native-foldview/${SRCDIR}`, 40 | )), 41 | ); 42 | 43 | gulp.task('default', done => { 44 | runSequence( 45 | 'spec', 46 | 'lint', 47 | done, 48 | ); 49 | }); 50 | 51 | gulp.task('watch', () => { 52 | gulp.watch([ 53 | `${SRCDIR}/**/*`, 54 | `${SPECDIR}/**/*`, 55 | 'gulpfile.js', 56 | ], ['copy', 'default']); 57 | }); 58 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-native-foldview", 3 | "version": "1.1.1", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "js-tokens": { 8 | "version": "3.0.2", 9 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", 10 | "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=" 11 | }, 12 | "loose-envify": { 13 | "version": "1.3.1", 14 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz", 15 | "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=", 16 | "requires": { 17 | "js-tokens": "3.0.2" 18 | } 19 | }, 20 | "object-assign": { 21 | "version": "4.1.1", 22 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", 23 | "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" 24 | }, 25 | "prop-types": { 26 | "version": "15.6.2", 27 | "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz", 28 | "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==", 29 | "requires": { 30 | "loose-envify": "1.3.1", 31 | "object-assign": "4.1.1" 32 | } 33 | } 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-native-foldview", 3 | "version": "1.2.1", 4 | "description": "FoldingCell impl in JavaScript", 5 | "main": "src/index", 6 | "jsnext:main": "src/index", 7 | "files": [ 8 | "*.md", 9 | "src" 10 | ], 11 | "author": "Jake Murzy ", 12 | "license": "MIT", 13 | "homepage": "https://github.com/jmurzy/react-native-foldview", 14 | "tags": [ 15 | "react", 16 | "react-native", 17 | "FoldView", 18 | "FoldingCell", 19 | "ListView", 20 | "ScrollView" 21 | ], 22 | "keywords": [ 23 | "react", 24 | "react-native", 25 | "native", 26 | "ios", 27 | "andorid", 28 | "FoldingCell", 29 | "folding", 30 | "cell", 31 | "view" 32 | ], 33 | "contributors": [ 34 | { 35 | "name": "Jake Murzy", 36 | "email": "jake@murzy" 37 | } 38 | ], 39 | "engines": { 40 | "node": ">=4.0.0" 41 | }, 42 | "scripts": { 43 | "test": "npm run spec && npm run lint", 44 | "spec": "./node_modules/.bin/babel-node ./node_modules/.bin/gulp spec", 45 | "lint": "./node_modules/.bin/babel-node ./node_modules/.bin/gulp lint", 46 | "watch": "./node_modules/.bin/babel-node ./node_modules/.bin/gulp watch" 47 | }, 48 | "repository": { 49 | "type": "git", 50 | "url": "https://github.com/jmurzy/react-native-foldview.git" 51 | }, 52 | "bugs": { 53 | "url": "https://github.com/jmurzy/react-native-foldview/issues" 54 | }, 55 | "peerDependencies": { 56 | "react": "^15.4.2", 57 | "react-native": "0.40.0" 58 | }, 59 | "dependencies": { 60 | "invariant": "^2.2.2", 61 | "prop-types": "^15.6.2", 62 | "warning": "^3.0.0" 63 | }, 64 | "devDependencies": { 65 | "babel-cli": "^6.22.2", 66 | "babel-core": "^6.22.1", 67 | "babel-eslint": "^7.1.1", 68 | "babel-polyfill": "^6.22.0", 69 | "babel-preset-react-native": "^1.9.1", 70 | "chai": "^3.5.0", 71 | "eslint": "^3.14.0", 72 | "eslint-config-airbnb": "^14.0.0", 73 | "eslint-plugin-flowtype": "^2.30.0", 74 | "eslint-plugin-import": "^2.2.0", 75 | "eslint-plugin-jsx-a11y": "^3.0.2", 76 | "eslint-plugin-react": "^6.9.0", 77 | "flow-bin": "^0.33.0", 78 | "gulp": "^3.9.1", 79 | "gulp-eslint": "^3.0.1", 80 | "gulp-mocha": "^3.0.1", 81 | "react": "^15.4.2", 82 | "react-native": "0.40.0", 83 | "rimraf": "^2.5.2", 84 | "run-sequence": "^1.2.2" 85 | } 86 | } 87 | -------------------------------------------------------------------------------- /spec/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "mocha": true 4 | }, 5 | "rules": { 6 | "react/prop-types": 0 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /spec/sanityCheck.spec.js: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai'; 2 | 3 | describe('test', () => { 4 | it('should pass sanity check', () => { 5 | expect(true).to.equal(true); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /src/FoldView.js: -------------------------------------------------------------------------------- 1 | import React, { 2 | Component, 3 | } from 'react'; 4 | 5 | import PropTypes from 'prop-types'; 6 | 7 | import { 8 | View, 9 | Animated, 10 | StyleSheet, 11 | Platform, 12 | } from 'react-native'; 13 | 14 | import invariant from 'invariant'; 15 | 16 | import transformUtil from './transformUtil'; 17 | 18 | const styles = StyleSheet.create({ 19 | container: { 20 | flex: 1, 21 | }, 22 | base: { 23 | flex: 1, 24 | backgroundColor: 'transparent', 25 | }, 26 | face: { 27 | backfaceVisibility: 'hidden', 28 | backgroundColor: 'transparent', 29 | position: 'absolute', 30 | }, 31 | }); 32 | 33 | /* eslint-disable no-restricted-syntax, no-await-in-loop */ 34 | const rootDefaultProps = { 35 | collapse: async (foldViews) => { 36 | const reversedFoldViews = [...foldViews].reverse(); 37 | for (const foldView of reversedFoldViews) { 38 | await foldView.collapse(); 39 | } 40 | }, 41 | expand: async (foldViews) => { 42 | for (const foldView of foldViews) { 43 | await foldView.expand(); 44 | } 45 | }, 46 | perspective: 1000, 47 | }; 48 | /* eslint-enable */ 49 | 50 | export default class FoldingCell extends Component { 51 | 52 | static childContextTypes = { 53 | registerComponent: PropTypes.func, 54 | }; 55 | 56 | static contextTypes = { 57 | registerComponent: PropTypes.func, 58 | }; 59 | 60 | static propTypes = { 61 | children: PropTypes.element.isRequired, 62 | flipDuration: PropTypes.number, 63 | renderBackface: PropTypes.func.isRequired, 64 | renderFrontface: PropTypes.func.isRequired, 65 | renderLoading: PropTypes.func, 66 | /* Root-only props */ 67 | collapse: PropTypes.func, 68 | expand: PropTypes.func, 69 | expanded: PropTypes.bool, 70 | onAnimationEnd: PropTypes.func, 71 | onAnimationStart: PropTypes.func, 72 | perspective: PropTypes.number, 73 | }; 74 | 75 | static defaultProps = { 76 | flipDuration: 280, 77 | }; 78 | 79 | constructor(props, context) { 80 | super(props, context); 81 | 82 | this.state = { 83 | rotateXfront: new Animated.Value(0), 84 | rotateXback: new Animated.Value(-180), 85 | baseLayout: null, 86 | rasterize: false, 87 | }; 88 | 89 | this.isRoot = !context.registerComponent; 90 | this.managedComponents = []; 91 | } 92 | 93 | getChildContext(): Object { 94 | return { 95 | registerComponent: (pseudoRef) => { 96 | if (this.isRoot) { 97 | this.managedComponents.push(pseudoRef); 98 | } else { 99 | // Forward `ref` until it reaches root 100 | this.context.registerComponent(pseudoRef); 101 | } 102 | }, 103 | }; 104 | } 105 | 106 | componentWillMount() { 107 | this.collapse = this.collapse.bind(this); 108 | this.expand = this.expand.bind(this); 109 | this.getBaseHeight = this.getBaseHeight.bind(this); 110 | this.getFlipDuration = this.getFlipDuration.bind(this); 111 | this.handleBaseLayout = this.handleBaseLayout.bind(this); 112 | this.rasterize = this.rasterize.bind(this); 113 | this.renderBackface = this.renderBackface.bind(this); 114 | this.renderBase = this.renderBase.bind(this); 115 | this.renderFrontface = this.renderFrontface.bind(this); 116 | this.setBackFaceRef = this.setBackFaceRef.bind(this); 117 | this.setBaseRef = this.setBaseRef.bind(this); 118 | this.setFrontFaceRef = this.setFrontFaceRef.bind(this); 119 | 120 | 121 | if (!this.isRoot) { 122 | const blacklistedProps = [ 123 | 'collapse', 124 | 'expand', 125 | 'expanded', 126 | 'onAnimationEnd', 127 | 'onAnimationStart', 128 | 'perspective', 129 | ]; 130 | 131 | const invalidProps = blacklistedProps.reduce((invalid, key) => { 132 | if (this.props[key]) { 133 | invalid.push(key); 134 | } 135 | return invalid; 136 | }, []); 137 | 138 | invariant( 139 | invalidProps.length === 0, 140 | `${invalidProps.join(', ')} cannot be set on a nested FoldView`, 141 | ); 142 | } 143 | } 144 | 145 | componentDidMount() { 146 | this.state.rotateXfront.addListener(({ value }) => { 147 | this.flushTransform(this.frontFaceRef, value, this.state.frontFaceOriginY); 148 | }); 149 | 150 | this.state.rotateXback.addListener(({ value }) => { 151 | this.flushTransform(this.backFaceRef, value, this.state.backFaceOriginY); 152 | }); 153 | 154 | // Only expose a subset of self `ref` 155 | const pseudoRef = { 156 | expand: this.expand, 157 | collapse: this.collapse, 158 | rasterize: this.rasterize, 159 | getBaseHeight: this.getBaseHeight, 160 | getFlipDuration: this.getFlipDuration, 161 | }; 162 | 163 | if (this.isRoot) { 164 | this.managedComponents.push(pseudoRef); 165 | } else { 166 | this.context.registerComponent(pseudoRef); 167 | } 168 | } 169 | 170 | componentWillReceiveProps(nextProps) { 171 | if (this.isRoot) { 172 | if (nextProps.expanded !== this.props.expanded) { 173 | this.flip(nextProps.expanded); 174 | } 175 | } 176 | } 177 | 178 | componentWillUnmount() { 179 | // FIXME(jmurzy) Possible memory leak in the very unlikely case where non-root FoldViews 180 | // unmount independently of the root. If so, they should remove themselves from 181 | // `managedComponents`. 182 | this.managedComponents = null; 183 | } 184 | 185 | setFrontFaceRef(ref) { 186 | this.frontFaceRef = ref; 187 | } 188 | 189 | setBackFaceRef(ref) { 190 | this.backFaceRef = ref; 191 | } 192 | 193 | setBaseRef(ref) { 194 | this.baseRef = ref; 195 | } 196 | 197 | getBaseHeight() { 198 | const baseLayout = this.state.baseLayout; 199 | if (!baseLayout) { 200 | return 0; 201 | } 202 | 203 | return baseLayout.height; 204 | } 205 | 206 | getFlipDuration() { 207 | return this.props.flipDuration; 208 | } 209 | 210 | flushTransform(ref, dx, y) { 211 | // Matrix multiplication is not commutative 212 | const matrix = transformUtil.createIdentityMatrix(); 213 | const rotate = transformUtil.rotateX(dx); 214 | transformUtil.origin(matrix, { x: 0, y, z: 0 }); 215 | transformUtil.applyPerspective( 216 | matrix, 217 | this.props.perspective || rootDefaultProps.perspective, 218 | ); 219 | transformUtil.multiplyInto(matrix, matrix, rotate); 220 | 221 | ref.setNativeProps({ 222 | style: { 223 | transform: [ 224 | { 225 | matrix, 226 | }, 227 | ], 228 | }, 229 | }); 230 | } 231 | 232 | expand() { 233 | const duration = this.props.flipDuration; 234 | 235 | const animations = Animated.parallel([ 236 | Animated.timing(this.state.rotateXfront, { 237 | toValue: 180, 238 | duration, 239 | }), 240 | Animated.timing(this.state.rotateXback, { 241 | toValue: 0, 242 | duration, 243 | }), 244 | ]); 245 | 246 | return new Promise(resolve => animations.start(resolve)); 247 | } 248 | 249 | collapse() { 250 | const duration = this.props.flipDuration; 251 | 252 | const animations = Animated.parallel([ 253 | Animated.timing(this.state.rotateXfront, { 254 | toValue: 0, 255 | duration, 256 | }), 257 | Animated.timing(this.state.rotateXback, { 258 | toValue: -180, 259 | duration, 260 | }), 261 | ]); 262 | 263 | return new Promise(resolve => animations.start(resolve)); 264 | } 265 | 266 | rasterize(shouldRasterize) { 267 | return new Promise(resolve => { 268 | this.setState({ 269 | rasterize: shouldRasterize, 270 | }, resolve); 271 | }); 272 | } 273 | 274 | async flip(expanded) { 275 | if (!this.isRoot) { 276 | return; 277 | } 278 | 279 | const totalDuration = this.managedComponents.reduce( 280 | (total, pseudoRef) => total + pseudoRef.getFlipDuration(), 281 | 0, 282 | ); 283 | 284 | let height = this.state.baseLayout.height; 285 | if (expanded) { 286 | height = this.managedComponents.reduce( 287 | (total, pseudoRef) => total + pseudoRef.getBaseHeight(), 288 | height, 289 | ); 290 | } 291 | 292 | if (this.props.onAnimationStart) { 293 | this.props.onAnimationStart(totalDuration, height); 294 | } 295 | 296 | if (expanded) { 297 | /* eslint-disable no-restricted-syntax, no-await-in-loop */ 298 | for (const pseudoRef of this.managedComponents) { 299 | await pseudoRef.rasterize(true); 300 | } 301 | /* eslint-enable */ 302 | 303 | const expand = this.props.expand || rootDefaultProps.expand; 304 | await expand(this.managedComponents); 305 | } else { 306 | const collapse = this.props.collapse || rootDefaultProps.collapse; 307 | await collapse(this.managedComponents); 308 | 309 | // Conserve memory by turning off rasterization on collapse 310 | /* eslint-disable no-restricted-syntax, no-await-in-loop */ 311 | for (const pseudoRef of this.managedComponents) { 312 | await pseudoRef.rasterize(false); 313 | } 314 | /* eslint-enable */ 315 | } 316 | 317 | if (this.props.onAnimationEnd) { 318 | this.props.onAnimationEnd(totalDuration, height); 319 | } 320 | } 321 | 322 | handleBaseLayout(e) { 323 | const layout = e.nativeEvent.layout; 324 | 325 | this.setState({ 326 | baseLayout: layout, 327 | frontFaceOriginY: layout.height / 2, 328 | backFaceOriginY: -layout.height / 2, 329 | }, () => { 330 | this.flushTransform( 331 | this.frontFaceRef, 332 | /* eslint-disable no-underscore-dangle */ 333 | this.state.rotateXfront.__getValue(), 334 | /* eslint-enable */ 335 | this.state.frontFaceOriginY, 336 | ); 337 | 338 | this.flushTransform( 339 | this.backFaceRef, 340 | /* eslint-disable no-underscore-dangle */ 341 | this.state.rotateXback.__getValue(), 342 | /* eslint-enable */ 343 | this.state.backFaceOriginY, 344 | ); 345 | }); 346 | } 347 | 348 | renderFrontface() { 349 | if (this.state.baseLayout) { 350 | const { height, width, y, x } = this.state.baseLayout; 351 | const faceStyle = { 352 | height, 353 | width, 354 | top: y, 355 | left: x, 356 | ...Platform.select({ 357 | ios: { 358 | zIndex: 0, 359 | }, 360 | }), 361 | }; 362 | 363 | const pointerEvents = this.props.expanded ? 'box-none' : 'auto'; 364 | 365 | return ( 366 | 371 | { 372 | this.props.renderFrontface() 373 | } 374 | 375 | ); 376 | } 377 | 378 | return null; 379 | } 380 | 381 | renderBackface() { 382 | if (this.state.baseLayout) { 383 | const { height, width, y, x } = this.state.baseLayout; 384 | const faceStyle = { 385 | height, 386 | width, 387 | top: y + height, 388 | left: x, 389 | ...Platform.select({ 390 | ios: { 391 | zIndex: 1, 392 | }, 393 | }), 394 | }; 395 | 396 | const rasterize = this.state.rasterize; 397 | 398 | let pointerEvents = this.props.expanded ? 'auto' : 'box-none'; 399 | 400 | if (this.isRoot) { 401 | pointerEvents = this.props.expanded ? 'auto' : 'none'; 402 | } 403 | 404 | return ( 405 | 412 | { 413 | this.props.renderBackface() 414 | } 415 | 416 | ); 417 | } 418 | 419 | return null; 420 | } 421 | 422 | renderBase() { 423 | let children = this.props.children; 424 | 425 | if (this.isRoot && !this.state.baseLayout) { 426 | // Unless `renderLoading` is provided, temporarily render `frontFace` as placeholder 427 | // to avoid shutter when layout is done. 428 | const renderPlaceholder = this.props.renderLoading || this.props.renderFrontface; 429 | if (renderPlaceholder) { 430 | children = renderPlaceholder(); 431 | } 432 | } 433 | 434 | const baseStyle = this.state.baseLayout ? { 435 | height: this.state.baseLayout.height, 436 | flex: 1, 437 | } : styles.base; 438 | 439 | return ( 440 | 445 | {children} 446 | 447 | ); 448 | } 449 | 450 | render() { 451 | return ( 452 | 453 | {this.renderBase()} 454 | {this.renderBackface()} 455 | {this.renderFrontface()} 456 | 457 | ); 458 | } 459 | } 460 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import FoldView from './FoldView'; 2 | 3 | export default FoldView; 4 | -------------------------------------------------------------------------------- /src/transformUtil.js: -------------------------------------------------------------------------------- 1 | import MatrixMath from 'react-native/Libraries/Utilities/MatrixMath'; 2 | 3 | function transformOrigin(matrix, origin) { 4 | const { x, y, z } = origin; 5 | 6 | const translate = MatrixMath.createIdentityMatrix(); 7 | MatrixMath.reuseTranslate3dCommand(translate, x, y, z); 8 | MatrixMath.multiplyInto(matrix, translate, matrix); 9 | 10 | const untranslate = MatrixMath.createIdentityMatrix(); 11 | MatrixMath.reuseTranslate3dCommand(untranslate, -x, -y, -z); 12 | MatrixMath.multiplyInto(matrix, matrix, untranslate); 13 | } 14 | 15 | function rotateX(deg) { 16 | const rad = (Math.PI / 180) * deg; 17 | const cos = Math.cos(rad); 18 | const sin = Math.sin(rad); 19 | return [ 20 | 1, 0, 0, 0, 21 | 0, cos, -sin, 0, 22 | 0, sin, cos, 0, 23 | 0, 0, 0, 1, 24 | ]; 25 | } 26 | 27 | function applyPerspective(matrix, value) { 28 | const perspective = MatrixMath.createIdentityMatrix(); 29 | MatrixMath.reusePerspectiveCommand(perspective, value); 30 | MatrixMath.multiplyInto(matrix, matrix, perspective); 31 | } 32 | 33 | export default { 34 | rotateX, 35 | applyPerspective, 36 | createIdentityMatrix: MatrixMath.createIdentityMatrix, 37 | multiplyInto: MatrixMath.multiplyInto, 38 | origin: transformOrigin, 39 | }; 40 | --------------------------------------------------------------------------------