A framework for building native apps with React. http://facebook.github.io/react-native/
Go to file
John Shelley 2d9e2f30e1 Android - Fix Drawable v4 paths in Android Artifact Resources (Libraries)
Summary:
_Quick apologies for the lengthiness of this description. Want to make sure I'm clear and it is understood what is being altered._

Thanks for submitting a PR! Please read these instructions carefully:

- [x] Explain the **motivation** for making this change.
- [x] Provide a **test plan** demonstrating that the code is solid.
- [x] Match the **code formatting** of the rest of the codebase.
- [x] Target the `master` branch, NOT a "stable" branch.

https://github.com/facebook/react-native/issues/5787
```
Unknown source file : /home/tom/projects/blueprint-native/android/app/build/intermediates/res/merged/release/drawable-mdpi-v4/images_google.png: error: Duplicate file.

Unknown source file : /home/tom/projects/blueprint-native/android/app/build/intermediates/res/merged/release/drawable-mdpi/images_google.png: Original is here. The version qualifier may be implied.
```

At Hudl, we've been attempting to package our React Native code into Library Dependencies _(Cocoapods / Android Artifact Resource (aar))_. Recently in React Native 0.42.0, there was an upgrade to the Android Project's gradle plugin from 1.3.1 to 2.2.3. This update drastically effected the outcome of drawable resources in Android without anyone noticing.

**There are 4 outcomes to consider with this change:**
1. You are developing in an Android Application using Gradle 1.3.1 or lower
2. You are developing in an Android Application using Gradle 2.2.3 or higher
3. You are developing in an Android Library Module using Gradle 1.3.1 or lower
4. You are developing in an Android Library Module using Gradle 2.2.3 or higher

With the upgrade to 2.2.3, Android changed the way aapt builds its resources. Any Library created with 2.2.3, has its resources ending with a `v4` suffix. The reasoning behind this I'm not sure of but assume it deals with Vector support that was added around that time.

The change I've added checks if React Native is being ran in an Android Library vs an Application, and appends the v4 suffix to the merged asset folders.

Multiple test were performed.

1. I first started out validating my assumption about the asset merger by creating a new Android Project to verify my assumptions above.
   1. [Application +  >= 2.2.3](https://github.com/jpshelley/TestAndroidLibraryDrawables/tree/master/app/build/intermediates/res/merged/debug) -- `hdpi` contains my drawable. `hdpi-v4` contains dependency's drawables.
   2. [Application + <= 1.3.1](https://github.com/jpshelley/TestAndroidLibraryDrawables/tree/Android-LegacyVersion/app/build/intermediates/res/merged/debug) -- Same as above (I expect because deps are compiled against gradle 2.2.3+ themselves.
   3. [Library + >= 2.2.3](https://github.com/jpshelley/TestAndroidLibraryDrawables/tree/Android-UsingAndroidLibrary/library/build/intermediates/res/merged/debug) -- Only `-v4` folders found! Resources from the library are packages in the app's build output in similar `-v4` folder too.
   4. [Library + <= 1.3.1](https://github.com/jpshelley/TestAndroidLibraryDrawables/tree/Android-UsingAndroidLibraryLegacyVersion/library/build/intermediates/res/merged/debug) -- Same as ii. & iii. `-v4` contains other resources, but my resources are located in non -v4 folder.

2. I then wanted to validate against React Native itself. So I updated my react native code using this PR/Branch, and tested against my project locally. Unfortunately I cannot share that code as it is private, but before this change I was getting the same error as mentioned in #5787 and now my build runs as intended with the assets being placed where they should be.

Additional resources:
* https://github.com/facebook/react-native/issues/5787
* http://stackoverflow.com/questions/35700272/android-build-tool-adds-v4-qualifier-to-drawable-folders-by-default-in-generated
* https://github.com/facebook/react-native/issues/12710

Please let me know if more information is needed, further test plans, etc. With this change we should be able to upgrade to Gradle 2.3.0 as well to support the latest version of Android Studio.
Closes https://github.com/facebook/react-native/pull/13128

Differential Revision: D7828618

Pulled By: hramos

fbshipit-source-id: a7ad7b63b1b51cbfd2ea7656e4d77321306ce33a
2018-05-01 04:16:21 -07:00
.circleci Collect unit test results in test_android job 2018-03-28 13:22:58 -07:00
.github Simplify templates 2018-03-16 17:22:05 -07:00
ContainerShip Update Android Docker images 2018-03-29 11:32:42 -07:00
IntegrationTests Remove @providesModule from all modules 2018-04-25 07:37:10 -07:00
Libraries Fix a race condition in AppState that prevents listeners from being notified 2018-04-30 18:01:17 -07:00
RNTester Remove @providesModule from all modules 2018-04-25 07:37:10 -07:00
React Fabric: Managing `LocalData` instances in mounting pipeline 2018-04-26 18:03:07 -07:00
ReactAndroid Fix viewflattening for views with on_layout props 2018-04-27 18:53:27 -07:00
ReactCommon load in platform macros 2018-04-29 16:01:17 -07:00
ReactNative load in platform macros 2018-04-29 16:01:17 -07:00
babel-preset Bump metro@0.34.0 2018-04-20 14:23:23 -07:00
bots Downgrade ES6 import to ES5 compat module.exports 2018-04-05 06:36:53 -07:00
flow Update license headers for MIT license 2018-02-16 18:31:53 -08:00
flow-github Fix ESLint warnings using 'yarn lint --fix' 2018-02-22 07:23:17 -08:00
gradle/wrapper Android - Update Gradle to 2.2.3 2017-01-31 13:13:32 -08:00
jest Blacklist FB RN renderer for RN GitHub OSS tests 2018-04-26 08:58:40 -07:00
keystores Apply auto-formatter for BUCK files in fbandroid. 2017-02-27 14:04:56 -08:00
lib Update license headers for MIT license 2018-02-16 18:31:53 -08:00
local-cli v0.71.0 in xplat/js 2018-04-28 02:19:34 -07:00
react-native-cli Update to MIT license 2018-02-16 18:31:53 -08:00
react-native-git-upgrade Suggest git apply --reject for failed upgrades 2018-04-12 11:57:25 -07:00
scripts Remove shelljs(?) leftover 2018-04-27 07:31:21 -07:00
third-party-podspecs OSS: upgrade Folly 2016.09.26 => 2016.10.31 2018-04-13 17:33:23 -07:00
.buckconfig update gitignore & fix links 2017-05-22 13:03:50 -07:00
.buckjavaargs limiting BUCK's memory for CI 2016-02-01 10:49:33 -08:00
.editorconfig Fix indent of .gradle files 2016-10-19 16:58:36 -07:00
.eslintignore Split out docs to their own repo 2017-12-05 13:02:54 -08:00
.eslintrc Add eslint-plugin-react-native Yarn package and enable no-inline-styles rule for Marketplace 2018-03-07 22:38:46 -08:00
.flowconfig v0.71.0 in xplat/js 2018-04-28 02:19:34 -07:00
.gitattributes Added a .gitattributes file, ensuring that Bash script source files (gradlew and 2015-10-13 23:10:39 -04:00
.gitignore Ignore yarn.lock and package-lock.json in oss 2018-03-08 13:25:10 -08:00
.npmignore Update .npmignore to include generated bundle file 2017-02-03 11:43:31 -08:00
CODE_OF_CONDUCT.md Create CODE_OF_CONDUCT.md 2017-10-26 16:47:27 -07:00
CONTRIBUTING.md Removed last traces of @providesModule from React Native 2018-04-26 08:30:54 -07:00
DockerTests.md Docker Testing Environment for Android & JS 2017-02-24 10:59:53 -08:00
Jenkinsfile Container Testing Updates 2017-04-12 16:31:35 -07:00
LICENSE Update to MIT license 2018-02-16 18:31:53 -08:00
LICENSE-docs More licenses 2015-03-24 19:59:10 -07:00
README.md Update to MIT license 2018-02-16 18:31:53 -08:00
React.podspec Remove extra space in source_files 2018-04-18 17:45:47 -07:00
Releases.md Remove references to Travis 2018-01-24 22:18:34 -08:00
build.gradle Update gradle-download-task from 2.0.0 to 3.1.2 to fix boost zip down… 2016-12-07 16:43:28 -08:00
cli.js Update license headers for MIT license 2018-02-16 18:31:53 -08:00
gradlew Update gradle wrapper binary and scripts 2016-09-09 08:13:59 -07:00
gradlew.bat Update gradle wrapper binary and scripts 2016-09-09 08:13:59 -07:00
jest-preset.json mock mp4 files 2017-10-20 13:05:26 -07:00
package.json v0.71.0 in xplat/js 2018-04-28 02:19:34 -07:00
react.gradle Android - Fix Drawable v4 paths in Android Artifact Resources (Libraries) 2018-05-01 04:16:21 -07:00
rn-cli.config.js Update license headers for MIT license 2018-02-16 18:31:53 -08:00
rn-get-polyfills.js Update license headers for MIT license 2018-02-16 18:31:53 -08:00
runXcodeTests.sh Re-license and rename UIExplorer integration test app as RNTester 2017-05-08 11:31:19 -07:00
settings.gradle Cleanup settings.gradle 2017-07-28 07:51:09 -07:00
setupBabel.js Move `buildRegExps` from `react-native` to `metro-babel-register` 2018-04-23 13:49:58 -07:00

README.md

React Native · Circle CI Status npm version PRs Welcome

Learn once, write anywhere: Build mobile apps with React.

  • Build native mobile apps using JavaScript and React: React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.
  • A React Native app is a real mobile app: With React Native, you don't build a "mobile web app", an "HTML5 app", or a "hybrid app". You build a real mobile app that's indistinguishable from an app built using Objective-C, Java, or Swift. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React.
  • Don't waste time recompiling: React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state. Give it a try - it's a magical experience.
  • Use native code when you need to: React Native combines smoothly with components written in Objective-C, Java, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.

The focus of React Native is on developer efficiency across all the platforms you care about - learn once, write anywhere. Facebook uses React Native in multiple production apps and will continue investing in React Native.

See the official React Native website for an introduction to React Native.

Supported operating systems are >= Android 4.1 (API 16) and >= iOS 8.0.


Getting Started

Follow the Getting Started guide. The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:


Documentation

The websites documentation is divided into multiple sections.

Another great way to learn more about the components and APIs included with React Native is to read their source. Look under the Libraries/Components directory for components like ScrollView and TextInput, for example. The RNTester example is also here to demonstrate some of the ways to use these components. From the source you can get an accurate understanding of each components behavior and API.

The React Native documentation only discusses the components, APIs and topics specific to React Native (React on iOS and Android). For further documentation on the React API that is shared between React Native and React DOM, refer to the React documentation.


Upgrading

React Native is under active development. See the guide on upgrading React Native to keep your project up-to-date.


Contributing

Read below to learn how you can take part in improving React Native.

Code of Conduct

Facebook has adopted a Code of Conduct that we expect project participants to adhere to. Please read the full text so that you can understand what actions will and will not be tolerated.

Contributing Guide

Read our contributing guide to learn about our development process, how to propose bug fixes and improvements, and how to build and test your changes to React Native.

Beginner Friendly Bugs

We have a list of beginner friendly issues to help you get your feet wet in the React Native codebase and familiar with our contribution process. This is a great place to get started.


License

React Native is MIT licensed.

React Native documentation is Creative Commons licensed.