mirror of
https://github.com/status-im/react-native.git
synced 2025-01-10 09:35:48 +00:00
c1aff6b116
Summary: Creating a view instance just to get the default view size is quite expensive, and affects startup time for the bridge as it must be done on the main thread. I've removed these cases and simply hard-coded the sizes in the JS file. This will need to be updated if the view sizes ever change, but in practice that's very unlikely. Reviewed By: javache Differential Revision: D3218917 fb-gh-sync-id: 91a21dabb6046c5d4d5d0bec0845415cb3628ec3 fbshipit-source-id: 91a21dabb6046c5d4d5d0bec0845415cb3628ec3
132 lines
3.2 KiB
JavaScript
132 lines
3.2 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule SegmentedControlIOS
|
|
* @flow
|
|
*/
|
|
'use strict';
|
|
|
|
var NativeMethodsMixin = require('NativeMethodsMixin');
|
|
var PropTypes = require('ReactPropTypes');
|
|
var React = require('React');
|
|
var StyleSheet = require('StyleSheet');
|
|
var View = require('View');
|
|
|
|
var requireNativeComponent = require('requireNativeComponent');
|
|
|
|
type DefaultProps = {
|
|
values: Array<string>;
|
|
enabled: boolean;
|
|
};
|
|
|
|
var SEGMENTED_CONTROL_REFERENCE = 'segmentedcontrol';
|
|
|
|
type Event = Object;
|
|
|
|
/**
|
|
* Use `SegmentedControlIOS` to render a UISegmentedControl iOS.
|
|
*
|
|
* #### Programmatically changing selected index
|
|
*
|
|
* The selected index can be changed on the fly by assigning the
|
|
* selectIndex prop to a state variable, then changing that variable.
|
|
* Note that the state variable would need to be updated as the user
|
|
* selects a value and changes the index, as shown in the example below.
|
|
*
|
|
* ````
|
|
* <SegmentedControlIOS
|
|
* values={['One', 'Two']}
|
|
* selectedIndex={this.state.selectedIndex}
|
|
* onChange={(event) => {
|
|
* this.setState({selectedIndex: event.nativeEvent.selectedSegmentIndex});
|
|
* }}
|
|
* />
|
|
* ````
|
|
*/
|
|
var SegmentedControlIOS = React.createClass({
|
|
mixins: [NativeMethodsMixin],
|
|
|
|
propTypes: {
|
|
...View.propTypes,
|
|
/**
|
|
* The labels for the control's segment buttons, in order.
|
|
*/
|
|
values: PropTypes.arrayOf(PropTypes.string),
|
|
|
|
/**
|
|
* The index in `props.values` of the segment to be (pre)selected.
|
|
*/
|
|
selectedIndex: PropTypes.number,
|
|
|
|
/**
|
|
* Callback that is called when the user taps a segment;
|
|
* passes the segment's value as an argument
|
|
*/
|
|
onValueChange: PropTypes.func,
|
|
|
|
/**
|
|
* Callback that is called when the user taps a segment;
|
|
* passes the event as an argument
|
|
*/
|
|
onChange: PropTypes.func,
|
|
|
|
/**
|
|
* If false the user won't be able to interact with the control.
|
|
* Default value is true.
|
|
*/
|
|
enabled: PropTypes.bool,
|
|
|
|
/**
|
|
* Accent color of the control.
|
|
*/
|
|
tintColor: PropTypes.string,
|
|
|
|
/**
|
|
* If true, then selecting a segment won't persist visually.
|
|
* The `onValueChange` callback will still work as expected.
|
|
*/
|
|
momentary: PropTypes.bool
|
|
},
|
|
|
|
getDefaultProps: function(): DefaultProps {
|
|
return {
|
|
values: [],
|
|
enabled: true
|
|
};
|
|
},
|
|
|
|
_onChange: function(event: Event) {
|
|
this.props.onChange && this.props.onChange(event);
|
|
this.props.onValueChange && this.props.onValueChange(event.nativeEvent.value);
|
|
},
|
|
|
|
render: function() {
|
|
return (
|
|
<RCTSegmentedControl
|
|
{...this.props}
|
|
ref={SEGMENTED_CONTROL_REFERENCE}
|
|
style={[styles.segmentedControl, this.props.style]}
|
|
onChange={this._onChange}
|
|
/>
|
|
);
|
|
}
|
|
});
|
|
|
|
var styles = StyleSheet.create({
|
|
segmentedControl: {
|
|
height: 28,
|
|
},
|
|
});
|
|
|
|
var RCTSegmentedControl = requireNativeComponent(
|
|
'RCTSegmentedControl',
|
|
SegmentedControlIOS
|
|
);
|
|
|
|
module.exports = SegmentedControlIOS;
|