You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
1.6 KiB
55 lines
1.6 KiB
import React from 'react';
|
|
import {ScrollView, StyleSheet, Text, View} from 'react-native';
|
|
import {RouteProp} from '@react-navigation/native';
|
|
import {RootStackParamList} from "../navigation/navigationTypes";
|
|
import TypeTacticsInfoList from "../components/TypeTacticsInfoList"
|
|
|
|
type MoveDetailScreenRouteProp = RouteProp<RootStackParamList, 'MoveDetail'>;
|
|
|
|
type Props = {
|
|
route: MoveDetailScreenRouteProp;
|
|
};
|
|
|
|
const MoveDetailScreen = ({route}: Props) => {
|
|
const {move} = route.params;
|
|
|
|
return (
|
|
<ScrollView style={styles.container}>
|
|
<Text style={styles.title}>{move.name}</Text>
|
|
<Text>Name: {move.name}</Text>
|
|
<Text>Category: {move.category}</Text>
|
|
<Text>Power: {move.power}</Text>
|
|
<Text>Accuracy: {move.accuracy}</Text>
|
|
<Text>Type: {move.type.name}</Text>
|
|
<View style={styles.typeListsContainer}>
|
|
<TypeTacticsInfoList isWeakness={true} types={move.type.weakAgainst}/>
|
|
<TypeTacticsInfoList isWeakness={false} types={move.type.effectiveAgainst}/>
|
|
</View>
|
|
</ScrollView>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: '#FFFFFF',
|
|
padding: 20,
|
|
},
|
|
title: {
|
|
fontSize: 24,
|
|
fontWeight: 'bold',
|
|
},
|
|
list: {
|
|
backgroundColor: '#F0F0F0',
|
|
borderRadius: 5,
|
|
padding: 10,
|
|
marginBottom: 10,
|
|
},
|
|
typeListsContainer: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
},
|
|
});
|
|
|
|
export default MoveDetailScreen;
|