060664fd3d
Summary: public The `bridge.modules` dictionary provides access to all native modules, but this API requires that every module is initialized in advance so that any module can be accessed. This diff introduces a better API that will allow modules to be initialized lazily as they are needed, and deprecates `bridge.modules` (modules that use it will still work, but should be rewritten to use `bridge.moduleClasses` or `-[bridge moduleForName/Class:` instead. The rules are now as follows: * Any module that overrides `init` or `setBridge:` will be initialized on the main thread when the bridge is created * Any module that implements `constantsToExport:` will be initialized later when the config is exported (the module itself will be initialized on a background queue, but `constantsToExport:` will still be called on the main thread. * All other modules will be initialized lazily when a method is first called on them. These rules may seem slightly arcane, but they have the advantage of not violating any assumptions that may have been made by existing code - any module written under the original assumption that it would be initialized synchronously on the main thread when the bridge is created should still function exactly the same, but modules that avoid overriding `init` or `setBridge:` will now be loaded lazily. I've rewritten most of the standard modules to take advantage of this new lazy loading, with the following results: Out of the 65 modules included in UIExplorer: * 16 are initialized on the main thread when the bridge is created * A further 8 are initialized when the config is exported to JS * The remaining 41 will be initialized lazily on-demand Reviewed By: jspahrsummers Differential Revision: D2677695 fb-gh-sync-id: 507ae7e9fd6b563e89292c7371767c978e928f33 |
||
---|---|---|
.. | ||
AnimatedGratuitousApp | ||
Navigator | ||
Thumbnails | ||
UIExplorer | ||
UIExplorer.xcodeproj | ||
UIExplorerIntegrationTests | ||
UIExplorerUnitTests | ||
android/app | ||
AccessibilityAndroidExample.android.js | ||
AccessibilityIOSExample.js | ||
ActionSheetIOSExample.js | ||
ActivityIndicatorIOSExample.js | ||
AdSupportIOSExample.js | ||
AlertIOSExample.js | ||
AnimatedExample.js | ||
AppStateIOSExample.js | ||
AssetScaledImageExample.js | ||
AsyncStorageExample.js | ||
BorderExample.js | ||
CameraRollExample.ios.js | ||
CameraRollView.ios.js | ||
DatePickerIOSExample.js | ||
ExampleTypes.js | ||
GeolocationExample.js | ||
ImageCapInsetsExample.js | ||
ImageEditingExample.js | ||
ImageExample.js | ||
IntentAndroidExample.android.js | ||
LayoutEventsExample.js | ||
LayoutExample.js | ||
ListViewExample.js | ||
ListViewGridLayoutExample.js | ||
ListViewPagingExample.js | ||
MapViewExample.js | ||
ModalExample.js | ||
NavigatorIOSColorsExample.js | ||
NavigatorIOSExample.js | ||
NetInfoExample.js | ||
PanResponderExample.js | ||
PickerIOSExample.js | ||
PointerEventsExample.js | ||
ProgressBarAndroidExample.android.js | ||
ProgressViewIOSExample.js | ||
PullToRefreshLayoutAndroidExample.android.js | ||
PushNotificationIOSExample.js | ||
RCTRootViewIOSExample.js | ||
README.md | ||
ScrollViewExample.js | ||
ScrollViewSimpleExample.js | ||
SegmentedControlIOSExample.js | ||
SetPropertiesExampleApp.js | ||
SliderIOSExample.js | ||
StatusBarIOSExample.js | ||
SwitchAndroidExample.android.js | ||
SwitchIOSExample.js | ||
TabBarIOSExample.js | ||
TextExample.android.js | ||
TextExample.ios.js | ||
TextInputExample.android.js | ||
TextInputExample.ios.js | ||
TimerExample.js | ||
ToastAndroidExample.android.js | ||
ToolbarAndroidExample.android.js | ||
TouchableExample.js | ||
TransformExample.js | ||
TransparentHitTestExample.js | ||
UIExplorerApp.android.js | ||
UIExplorerApp.ios.js | ||
UIExplorerBlock.js | ||
UIExplorerButton.js | ||
UIExplorerList.android.js | ||
UIExplorerList.ios.js | ||
UIExplorerListBase.js | ||
UIExplorerPage.js | ||
UIExplorerTitle.js | ||
VibrationIOSExample.js | ||
ViewExample.js | ||
ViewPagerAndroidExample.android.js | ||
WebViewExample.js | ||
XHRExample.android.js | ||
XHRExample.ios.js | ||
XHRExampleCookies.js | ||
XHRExampleHeaders.js | ||
bunny.png | ||
createExamplePage.js | ||
flux@3x.png | ||
hawk.png | ||
uie_thumb_big.png |
README.md
UIExplorer
The UIExplorer is a sample app that showcases React Native views and modules.
Running this app
Before running the app, make sure you ran:
git clone https://github.com/facebook/react-native.git
cd react-native
npm install
Running on iOS
Mac OS and Xcode are required.
- Open
Examples/UIExplorer/UIExplorer.xcodeproj
in Xcode - Hit the Run button
See Running on device if you want to use a physical device.
Running on Android
You'll need to have all the prerequisites (SDK, NDK) for Building React Native installed.
Start an Android emulator (Genymotion is recommended).
cd react-native
./gradlew :Examples:UIExplorer:android:app:installDebug
./packager/packager.sh
Note: Building for the first time can take a while.
Open the UIExplorer app in your emulator.
See Running on Device in case you want to use a physical device.
Built from source
Building the app on both iOS and Android means building the React Native framework from source. This way you're running the latest native and JS code the way you see it in your clone of the github repo.
This is different from apps created using react-native init
which have a dependency on a specific version of React Native JS and native code, declared in a package.json
file (and build.gradle
for Android apps).