diff --git a/Examples/Movies/MovieCell.js b/Examples/Movies/MovieCell.js
index 341460e58..62062cb2a 100644
--- a/Examples/Movies/MovieCell.js
+++ b/Examples/Movies/MovieCell.js
@@ -19,9 +19,11 @@ var React = require('react-native');
var {
Image,
PixelRatio,
+ Platform,
StyleSheet,
Text,
TouchableHighlight,
+ TouchableNativeFeedback,
View
} = React;
@@ -32,9 +34,13 @@ var getTextFromScore = require('./getTextFromScore');
var MovieCell = React.createClass({
render: function() {
var criticsScore = this.props.movie.ratings.critics_score;
+ var TouchableElement = TouchableHighlight;
+ if (Platform.OS === 'android') {
+ TouchableElement = TouchableNativeFeedback;
+ }
return (
-
@@ -59,7 +65,7 @@ var MovieCell = React.createClass({
-
+
);
}
diff --git a/Examples/Movies/MoviesApp.js b/Examples/Movies/MoviesApp.ios.js
similarity index 100%
rename from Examples/Movies/MoviesApp.js
rename to Examples/Movies/MoviesApp.ios.js
diff --git a/Examples/Movies/SearchBar.ios.js b/Examples/Movies/SearchBar.ios.js
new file mode 100644
index 000000000..f4a2354ef
--- /dev/null
+++ b/Examples/Movies/SearchBar.ios.js
@@ -0,0 +1,66 @@
+/**
+ * The examples provided by Facebook are for non-commercial testing and
+ * evaluation purposes only.
+ *
+ * Facebook reserves all rights not expressly granted.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
+ * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
+ * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
+ * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ *
+ * @providesModule SearchBar
+ * @flow
+ */
+'use strict';
+
+var React = require('react-native');
+var {
+ ActivityIndicatorIOS,
+ TextInput,
+ StyleSheet,
+ View,
+} = React;
+
+var SearchBar = React.createClass({
+ render: function() {
+ return (
+
+
+
+
+ );
+ }
+});
+
+var styles = StyleSheet.create({
+ searchBar: {
+ marginTop: 64,
+ padding: 3,
+ paddingLeft: 8,
+ flexDirection: 'row',
+ alignItems: 'center',
+ },
+ searchBarInput: {
+ fontSize: 15,
+ flex: 1,
+ height: 30,
+ },
+ spinner: {
+ width: 30,
+ },
+});
+
+module.exports = SearchBar;
diff --git a/Examples/Movies/SearchScreen.js b/Examples/Movies/SearchScreen.js
index 477ed6a50..4fd36790b 100644
--- a/Examples/Movies/SearchScreen.js
+++ b/Examples/Movies/SearchScreen.js
@@ -19,6 +19,8 @@ var React = require('react-native');
var {
ActivityIndicatorIOS,
ListView,
+ Platform,
+ ProgressBarAndroid,
StyleSheet,
Text,
TextInput,
@@ -27,9 +29,11 @@ var {
var TimerMixin = require('react-timer-mixin');
var invariant = require('invariant');
+var dismissKeyboard = require('dismissKeyboard');
var MovieCell = require('./MovieCell');
var MovieScreen = require('./MovieScreen');
+var SearchBar = require('SearchBar');
/**
* This is for demo purposes only, and rate limited.
@@ -219,11 +223,20 @@ var SearchScreen = React.createClass({
},
selectMovie: function(movie: Object) {
- this.props.navigator.push({
- title: movie.title,
- component: MovieScreen,
- passProps: {movie},
- });
+ if (Platform.OS === 'ios') {
+ this.props.navigator.push({
+ title: movie.title,
+ component: MovieScreen,
+ passProps: {movie},
+ });
+ } else {
+ dismissKeyboard();
+ this.props.navigator.push({
+ title: movie.title,
+ name: 'movie',
+ movie: movie,
+ });
+ }
},
onSearchChange: function(event: Object) {
@@ -237,7 +250,15 @@ var SearchScreen = React.createClass({
if (!this.hasMore() || !this.state.isLoadingTail) {
return ;
}
- return ;
+ if (Platform.OS === 'ios') {
+ return ;
+ } else {
+ return (
+
+
+
+ );
+ }
},
renderSeparator: function(
@@ -295,7 +316,8 @@ var SearchScreen = React.createClass({
this.refs.listview.getScrollResponder().scrollTo(0, 0)}
+ onFocus={() =>
+ this.refs.listview && this.refs.listview.getScrollResponder().scrollTo(0, 0)}
/>
{content}
@@ -323,27 +345,6 @@ var NoMovies = React.createClass({
}
});
-var SearchBar = React.createClass({
- render: function() {
- return (
-
-
-
-
- );
- }
-});
-
var styles = StyleSheet.create({
container: {
flex: 1,
@@ -356,25 +357,10 @@ var styles = StyleSheet.create({
marginTop: 80,
color: '#888888',
},
- searchBar: {
- marginTop: 64,
- padding: 3,
- paddingLeft: 8,
- flexDirection: 'row',
- alignItems: 'center',
- },
- searchBarInput: {
- fontSize: 15,
- flex: 1,
- height: 30,
- },
separator: {
height: 1,
backgroundColor: '#eeeeee',
},
- spinner: {
- width: 30,
- },
scrollSpinner: {
marginVertical: 20,
},