Commit befaf31
Changed files (2)
app
components
app/components/application-shell.js
@@ -1,48 +1,50 @@
import React, { Component } from 'react';
-import { AppRegistry, Text, ListView, View } from 'react-native';
+import { AppRegistry, Text, ListView, View, Image, TextInput } from 'react-native';
import ViewContainer from './ViewContainer'
import StatusBarBackground from './StatusBarBackground'
import Api from '../services/api'
+import Movie from './movie'
export default class ApplicationShell extends Component {
constructor(props) {
super(props)
-
+ this.ds = new ListView.DataSource({ rowHasChanged: (row, other) => row['title'] != other['title'] });
this.state = {
- dataSource: new ListView.DataSource({
- rowHasChanged: (row1, row2) => {
- debugger
- return row1 != row2;
- }
- })
+ dataSource: this.mapAll([]),
+ showText: true,
+ text: 'WAT?',
};
}
+
componentDidMount() {
var that = this;
var url = 'https://facebook.github.io/react-native/movies.json'
new Api(url).get((json) => {
that.setState({ dataSource: that.mapAll(json.movies) });
});
+ setInterval(() => {
+ that.setState({ showText: !that.state.showText });
+ }, 1000);
}
+
render() {
+ let pic = { uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' };
+ let display = this.state.showText ? this.props.text : ' ';
+
return (
- <ViewContainer>
- <StatusBarBackground style={{backgroundColor: "mistyrose"}} />
+ <View style={{flex: 1, alignItems: 'center'}}>
+ <Image source={pic} style={{width: 193, height: 110}} />
+ <Text>{display}</Text>
<ListView
dataSource={this.state.dataSource}
- renderRow={this.renderMovie}
- />
- </ViewContainer>
- );
- }
- renderMovie(movie) {
- return (
- <View>
- <Text>{movie.title}</Text>
+ renderRow={(row) => <Movie name={row} />}
+ />
</View>
- )
+ );
}
+
mapAll(movies) {
- return this.state.dataSource.cloneWithRows(movies);
+ movies.forEach((item) => console.log(item))
+ return this.ds.cloneWithRows(movies.map((item) => item.title));
}
}
app/components/movie.js
@@ -0,0 +1,10 @@
+import React, { Component } from 'react';
+import { View, Text } from 'react-native';
+
+export default class Movie extends Component {
+ render() {
+ return (
+ <Text style={{flex: 1}}>{this.props.name}</Text>
+ )
+ }
+}