신승민 / pocketMovie

Go to a project
Toggle navigation Toggle navigation pinning
“Hojin
5f449598 1 parent 37be0be4

merge search and movieranking

Inline Side-by-side
Showing 1 changed file with 108 additions and 25 deletions
import React, { Component } from "react";
import { View, Text, StyleSheet, Image } from "react-native";
import {
View,
Text,
StyleSheet,
Image,
SafeAreaView,
ScrollView,
Alert,
TouchableOpacity,
TouchableHighlight,
TouchableWithoutFeedback
} from "react-native";
import { Icon } from "native-base";
import { AsyncStorage } from "react-native";
import axios from "axios";
const API_KEY = "2bf00f660b1a6a3ffeb6e06ac270cce3";
const NAVER_CLIENT_ID = "KqPsntd1hcPJ8FUPBGqN";
const NAVER_CLIENT_SECRET = "0GRb3uya1U";
let uri1 = "";
export default class MovieRankingTab extends Component {
state = {
isLoading: true,
info: [],
date: "",
name0: [],
name1: [],
name2: [],
......@@ -39,10 +50,10 @@ export default class MovieRankingTab extends Component {
)
};
getMovieList = async () => {
getMovieList = async date => {
axios
.get(
`http://www.kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchDailyBoxOfficeList.json?key=${API_KEY}&targetDt=20191129`
`http://www.kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchDailyBoxOfficeList.json?key=${API_KEY}&targetDt=${date}`
)
.then(
response => {
......@@ -234,78 +245,150 @@ export default class MovieRankingTab extends Component {
});
};
componentDidMount() {
this.getMovieList();
var day = new Date().getDate() - 1; // 어제 날짜
if (day == 1) {
day = 30;
} else if (day < 10) {
day = "0" + day;
}
var month = new Date().getMonth() + 1; //Current Month
var year = new Date().getFullYear(); //Current Year
var date = year + "" + month + day;
this.getMovieList(date);
}
_onPressButton = () => {
Alert.alert("image pressed the car");
};
render() {
return (
<View style={style.container}>
<Text>MovieRanking</Text>
<SafeAreaView style={style.container}>
<ScrollView style={style.scrollView}>
<Text style={style.title}>MovieRanking</Text>
<View style={style.lowContainer}>
<TouchableOpacity onPress={this._onPressButton}>
<View>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl0}` }}
/>
<Text>{this.state.name0}</Text>
</View>
</TouchableOpacity>
<TouchableOpacity
style={style.button}
onPress={this._onPressButton}
>
<View>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl1}` }}
/>
<Text>{this.state.name1}</Text>
</View>
</TouchableOpacity>
</View>
<View style={style.lowContainer}>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl2}` }}
/>
<Text>{this.state.name2}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl3}` }}
/>
<Text>{this.state.name3}</Text>
</View>
</View>
<View style={style.lowContainer}>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl4}` }}
/>
<Text>{this.state.name4}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl5}` }}
/>
<Text>{this.state.name5}</Text>
</View>
</View>
<View style={style.lowContainer}>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl6}` }}
/>
<Text>{this.state.name6}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl7}` }}
/>
<Text>{this.state.name7}</Text>
</View>
</View>
<View style={style.lowContainer}>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl8}` }}
/>
<Text>{this.state.name8}</Text>
</View>
<View style={style.halfContainer}>
<Image
style={{ height: "25%", width: "25%" }}
source={{ uri: `${this.state.imgurl9}` }}
/>
<Image
style={{ height: "25%", width: "25%" }}
style={style.poster}
source={{ uri: `${this.state.imgurl9}` }}
/>
<Text>{this.state.name9}</Text>
</View>
</View>
</ScrollView>
</SafeAreaView>
);
}
}
const style = StyleSheet.create({
container: {
flex: 1
},
scrollView: {
// backgroundColor: "black",
// justifyContent: "center",
// alignItems: "center"
},
title: {
fontSize: 20,
justifyContent: "center",
alignItems: "center"
},
lowContainer: {
flex: 1,
alignItems: "center",
justifyContent: "center"
flexDirection: "row",
justifyContent: "center",
alignItems: "center"
},
splitContainer: {
flex: 1
poster: {
// resizeMode: "cover",
flex: 10,
width: "90%",
height: 200,
paddingHorizontal: 50
// alignItems: "stretch"
},
halfContainer: {
flex: 1,
// justifyContent: "center",
alignItems: "center"
}
});
......