Last active
January 25, 2020 17:34
-
-
Save fachryansyah/f6303af34460f2e0dbdfa91a62e3e3cc to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { Component } from 'react' | |
import { | |
View, | |
StyleSheet, | |
Dimensions, | |
Text, | |
Image, | |
ScrollView | |
} from 'react-native' | |
class DetailScreen extends Component { | |
constructor(props) { | |
super(props) | |
} | |
render() { | |
const { navigation } = this.props; | |
const item = navigation.getParam('item', 'NO ITEM') | |
return ( | |
<> | |
<View> | |
<ScrollView> | |
<Image style={styles.imageCover} source={{ uri: item.cover }} /> | |
<View style={styles.card}> | |
<Text style={styles.textSerial}>{item.serial}</Text> | |
<Text style={styles.textChara}>{item.title}</Text> | |
<Text style={styles.textSubTitle}>Pengisi suara: {item.dubber}</Text> | |
<Text style={styles.textSubTitle}>Diperankan oleh: Suzu Hirose</Text> | |
<Text style={styles.textHeader}>Description: </Text> | |
<Text style={styles.textDescription}> | |
{item.description} | |
</Text> | |
</View> | |
</ScrollView> | |
</View> | |
</> | |
) | |
} | |
} | |
const SCREEN_WIDTH = Dimensions.get('window').width | |
const SCREEN_HEIGHT = Dimensions.get('window').height | |
const styles = StyleSheet.create({ | |
imageCover: { | |
resizeMode: 'cover', | |
height: SCREEN_HEIGHT / 2, | |
}, | |
card: { | |
backgroundColor: 'white', | |
padding: 26, | |
paddingTop: 46, | |
borderTopLeftRadius: 28, | |
borderTopRightRadius: 28, | |
width: SCREEN_WIDTH, | |
top: -26, | |
}, | |
textChara: { | |
fontSize: 28, | |
fontWeight: '700', | |
color: '#353535' | |
}, | |
textSerial: { | |
fontSize: 20, | |
marginBottom: 16, | |
fontWeight: '700', | |
color: '#7e7f7c' | |
}, | |
textSubTitle: { | |
fontSize: 16, | |
color: '#212121' | |
}, | |
textHeader: { | |
fontSize: 24, | |
marginTop: 28, | |
fontWeight: '700', | |
color: '#353535' | |
}, | |
textDescription: { | |
fontSize: 16, | |
color: '#212121' | |
} | |
}) | |
export default DetailScreen |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment