diff --git a/Examples/UIExplorer/SwitchAndroidExample.android.js b/Examples/UIExplorer/SwitchAndroidExample.android.js deleted file mode 100644 index 7b6f38e16..000000000 --- a/Examples/UIExplorer/SwitchAndroidExample.android.js +++ /dev/null @@ -1,70 +0,0 @@ -/** - * Copyright 2004-present Facebook. All Rights Reserved. - */ -'use strict'; - -var React = require('React'); - -var SwitchAndroid = require('SwitchAndroid'); -var Text = require('Text'); -var UIExplorerBlock = require('UIExplorerBlock'); -var UIExplorerPage = require('UIExplorerPage'); - -var SwitchAndroidExample = React.createClass({ - statics: { - title: '', - description: 'Standard Android two-state toggle component.' - }, - - getInitialState : function() { - return { - trueSwitchIsOn: true, - falseSwitchIsOn: false, - colorTrueSwitchIsOn: true, - colorFalseSwitchIsOn: false, - eventSwitchIsOn: false, - }; - }, - - render: function() { - return ( - - - this.setState({falseSwitchIsOn: value})} - style={{marginBottom: 10}} - value={this.state.falseSwitchIsOn} /> - this.setState({trueSwitchIsOn: value})} - value={this.state.trueSwitchIsOn} /> - - - - - - - this.setState({eventSwitchIsOn: value})} - style={{marginBottom: 10}} - value={this.state.eventSwitchIsOn} /> - this.setState({eventSwitchIsOn: value})} - style={{marginBottom: 10}} - value={this.state.eventSwitchIsOn} /> - {this.state.eventSwitchIsOn ? 'On' : 'Off'} - - - - - - - ); - } -}); - -module.exports = SwitchAndroidExample; diff --git a/Examples/UIExplorer/SwitchIOSExample.js b/Examples/UIExplorer/SwitchExample.js similarity index 91% rename from Examples/UIExplorer/SwitchIOSExample.js rename to Examples/UIExplorer/SwitchExample.js index feedfbff3..5ab41fe15 100644 --- a/Examples/UIExplorer/SwitchIOSExample.js +++ b/Examples/UIExplorer/SwitchExample.js @@ -17,7 +17,7 @@ var React = require('react-native'); var { - SwitchIOS, + Switch, Text, View } = React; @@ -32,11 +32,11 @@ var BasicSwitchExample = React.createClass({ render() { return ( - this.setState({falseSwitchIsOn: value})} style={{marginBottom: 10}} value={this.state.falseSwitchIsOn} /> - this.setState({trueSwitchIsOn: value})} value={this.state.trueSwitchIsOn} /> @@ -48,11 +48,11 @@ var DisabledSwitchExample = React.createClass({ render() { return ( - - @@ -70,14 +70,14 @@ var ColorSwitchExample = React.createClass({ render() { return ( - this.setState({colorFalseSwitchIsOn: value})} onTintColor="#00ff00" style={{marginBottom: 10}} thumbTintColor="#0000ff" tintColor="#ff0000" value={this.state.colorFalseSwitchIsOn} /> - this.setState({colorTrueSwitchIsOn: value})} onTintColor="#00ff00" thumbTintColor="#0000ff" @@ -99,22 +99,22 @@ var EventSwitchExample = React.createClass({ return ( - this.setState({eventSwitchIsOn: value})} style={{marginBottom: 10}} value={this.state.eventSwitchIsOn} /> - this.setState({eventSwitchIsOn: value})} style={{marginBottom: 10}} value={this.state.eventSwitchIsOn} /> {this.state.eventSwitchIsOn ? 'On' : 'Off'} - this.setState({eventSwitchRegressionIsOn: value})} style={{marginBottom: 10}} value={this.state.eventSwitchRegressionIsOn} /> - this.setState({eventSwitchRegressionIsOn: value})} style={{marginBottom: 10}} value={this.state.eventSwitchRegressionIsOn} /> @@ -125,10 +125,7 @@ var EventSwitchExample = React.createClass({ } }); -exports.title = ''; -exports.displayName = 'SwitchExample'; -exports.description = 'Native boolean input'; -exports.examples = [ +var examples = [ { title: 'Switches can be set to true or false', render(): ReactElement { return ; } @@ -137,16 +134,24 @@ exports.examples = [ title: 'Switches can be disabled', render(): ReactElement { return ; } }, - { - title: 'Custom colors can be provided', - render(): ReactElement { return ; } - }, { title: 'Change events can be detected', render(): ReactElement { return ; } }, { title: 'Switches are controlled components', - render(): ReactElement { return ; } + render(): ReactElement { return ; } } ]; + +if (React.Platform.OS === 'ios') { + examples.push({ + title: 'Custom colors can be provided', + render(): ReactElement { return ; } + }); +} + +exports.title = ''; +exports.displayName = 'SwitchExample'; +exports.description = 'Native boolean input'; +exports.examples = examples; diff --git a/Examples/UIExplorer/UIExplorerIntegrationTests/ReferenceImages/Examples-UIExplorer-UIExplorerApp.ios/testSwitchExample_1@2x.png b/Examples/UIExplorer/UIExplorerIntegrationTests/ReferenceImages/Examples-UIExplorer-UIExplorerApp.ios/testSwitchExample_1@2x.png index a1d8b69dc..f57db959a 100644 Binary files a/Examples/UIExplorer/UIExplorerIntegrationTests/ReferenceImages/Examples-UIExplorer-UIExplorerApp.ios/testSwitchExample_1@2x.png and b/Examples/UIExplorer/UIExplorerIntegrationTests/ReferenceImages/Examples-UIExplorer-UIExplorerApp.ios/testSwitchExample_1@2x.png differ diff --git a/Examples/UIExplorer/UIExplorerList.android.js b/Examples/UIExplorer/UIExplorerList.android.js index 81442e0b9..607f581fb 100644 --- a/Examples/UIExplorer/UIExplorerList.android.js +++ b/Examples/UIExplorer/UIExplorerList.android.js @@ -27,7 +27,7 @@ var COMPONENTS = [ require('./ListViewExample'), require('./ProgressBarAndroidExample'), require('./ScrollViewSimpleExample'), - require('./SwitchAndroidExample'), + require('./SwitchExample'), require('./RefreshControlExample'), require('./PullToRefreshViewAndroidExample.android'), require('./TextExample.android'), diff --git a/Examples/UIExplorer/UIExplorerList.ios.js b/Examples/UIExplorer/UIExplorerList.ios.js index 1d96b2d49..512b033ac 100644 --- a/Examples/UIExplorer/UIExplorerList.ios.js +++ b/Examples/UIExplorer/UIExplorerList.ios.js @@ -46,7 +46,7 @@ var COMPONENTS = [ require('./ScrollViewExample'), require('./SegmentedControlIOSExample'), require('./SliderIOSExample'), - require('./SwitchIOSExample'), + require('./SwitchExample'), require('./TabBarIOSExample'), require('./TextExample.ios'), require('./TextInputExample.ios'),