Comments (15)
We have the following right now, but they are of varying degrees of completeness.
AxialGradient
CameraIOS
DatePickerIOS
GeoMapIOS
Image
NavigationIOS
PickerIOS
ScrollView
SliderIOS
SpinnerIOS
SwitchIOS
TabBarIOS
Text
TextInput
View
WebViewIOS
from react-native.
Is there a reason why Button is not on the list? (just curious :-))
from react-native.
Yeah, there's a cost of bridging elements, it turns out that reimplementing a button in pure JS is easier than trying to fit the iOS button api with React.
Also, since the new iOS, a button is just a label with no real styling associated. We do have TouchableHighlight and TouchableOpacity components to make sure interactions are working correctly.
from react-native.
What's the approach with non-UI libraries? How should I for instance expose something like UIDevice (which gives device information)?
I could imagine something like:
var Device = require('react-native/Device');
console.log('orientation:', Device.currentDevice().orientation);
from react-native.
We are working on a lightweight store for device APIs, which we call Subscribable
. It comes with a mixin, and this is how you would use it in a component:
var myComponent = React.createClass({
mixins: [Subscribable.Mixin],
getInitialState: function() {
return {
isConnected: AppState.networkReachability.get() !== 'none'
};
},
componentDidMount: function() {
this._reachSubscription = this.subscribeTo(
AppState.networkReachability,
(reachability) => {
this.setState({ isConnected: reachability !== 'none' })
}
);
},
render: function() {
return (
<Text>
{this.state.isConnected ? 'Network Connected' : 'No network'}
<Text onPress={() => this._reachSubscription.remove()}>
End reachability subscription
</Text>
</Text>
);
}
});
A subscribable is created with an event emitter. For device events, we wrap an internal EventEmitter called RCTDeviceEventEmitter
which emits a 'reachabilityDidChange' event. We also provide the subscribable with a mapping function which you can use to transform the emitted value, and a function which subscribable can call to populate the initial data.
AppState.networkReachability = new Subscribable(
RCTDeviceEventEmitter,
'reachabilityDidChange',
(resp) => resp.network_reachability,
RCTReachability.getCurrentReachability
);
Why are we wrapping EventEmitter with this new thing? A few reasons:
- It is very easy to use EventEmitter improperly and forget to remove the subscription on component unmounting.
Subscribable
andSubscribable.Mixin
adds protection against this - If we expose a public event emitter, anything can
emit
data from it - EventEmitter requires a string name for each event, which would encourage hardcoded strings and make static analysis more difficult
Feedback is welcome- this API isn't final!
Subscribable
will be available for you in a couple weeks. We will have a few device events exposed and the community can help add the rest. We're actively working on our code syncing process so we can release new things and upstream your pull requests.
from react-native.
Looks sensible. I like the general rule of avoiding string literals.
What about non-event based non-visuals, like the NSKeyedArchiver
? How would the serialization work for that? Maybe just send back JSON using JSONModel?
from react-native.
We have a mechanism for exporting constants for JS to consume which can be trivially used to provide device info like screen dimensions, number of processor cores, etc. We'll probably migrate over our internal RCTDevice module soon.
On Feb 24, 2015, at 5:59 PM, Joe Wood [email protected] wrote:
Looks sensible. I like the general rule of avoiding string literals.
What about non-event based non-visuals, like the NSKeyedArchiver? How would the serialization work for that? Maybe just send back JSON using JSONModel?—
Reply to this email directly or view it on GitHub.
from react-native.
@vjeux do you know if the CameraIOS component will be released anytime soon? I wanted to use the native camera but wasn't sure if I should implement something in the meanwhile or wait for the CameraIOS you mentioned. Thanks!
from react-native.
We don't have any Camera implementation inside of Facebook and don't have any project lined up that needs it. Hopefully someone from the community will be able to build it :)
from react-native.
@vjeux Thanks for the heads up! In that case, maybe I should go ahead and build a component and share it :)
from react-native.
We do have a camera component internally, but it's not longer used so is probably pretty crusty.
On Mar 28, 2015, at 11:04 AM, potsypantsy [email protected] wrote:
@vjeux Thanks for the heads up! In that case, maybe I should go ahead and build a component and share it :)
—
Reply to this email directly or view it on GitHub.
from react-native.
If you're looking for ideas, would be cool if I could open a share dialog (UIActivityViewController) using js.
from react-native.
+1 for CameraIOS
from react-native.
@ericvicenti - I like that! I assume that calling subscribeTo
will add the subscription to some array that will then be removed upon unmount? Looking forward to seeing that released!
from react-native.
Most of the components on this list have been exported, will close this one. Let's recreate an issue
from react-native.
Related Issues (20)
- network request failed when fetch in release build HOT 8
- want java file instead of kotlin [email protected] HOT 2
- C++17 function cannot be found by dependency with React Native 0.73.5 on Android HOT 1
- 'folly/portability/Config.h' file not found HOT 5
- cassert.h, iosfwd.h and memory.h file not found HOT 5
- Android emulator is not opening in automatically, but manually it is opening . HOT 18
- Cant build on ios, HOT 2
- [Fixed & Shipped in latest releases] Upgrading Xcode to 15.3 results in build error - `Called object type 'facebook::flipper::SocketCertificateProvider' (aka 'int') is not a function or function pointer` HOT 56
- Yarn installs latest version of dependency instead of downloading the one defined in my package.json HOT 2
- iOS Wrapping react-native into dynamic library caused Fabric exception HOT 5
- iOS Wrapping react-native into dynamic library caused Fabric components not displayed HOT 3
- Can not Build from Source , error when building with cmake, Looking for pthread_create in pthreads - not found HOT 5
- RCTThirdPartyFabricComponentsProvider always generated in React-Fabric filepath HOT 2
- [Codegen] Optional parameters in spec are not annotated as `@Nullable` in the Android generated code HOT 6
- launchPackager.command is not found HOT 3
- TextInput value flickers when adding new lines HOT 3
- tsconfig custom paths not working in 0.73.x HOT 11
- Xcode 15.3 YogaKit/YGLayout.m Incompatible function pointer types passing 'YGSize (YGNodeRef, float, YGMeasureMode, float, YGMeasureMode)' HOT 5
- `react-native run-ios` tries to run on a non-existent device/simulator HOT 2
- No haptic feedback when using RefreshControl with a tintColor prop
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native.