maartenvr98/Kliko
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix empty images explore

Browse source
This commit is contained in:
Maarten 2024-08-09 14:17:31 +02:00
parent 77b118b9e1
commit 967cb7a60f
1 changed files with 21 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

29
app/(tabs)/explore.tsx
View file

@ -116,7 +116,14 @@ export default function ExploreScreen() {
data={types} data={types}
renderItem={(item: any, index: any) => ( renderItem={(item: any, index: any) => (
<TouchableOpacity style={styles.listItem} key={index} onPress={() => viewItem( item )}> <TouchableOpacity style={styles.listItem} key={index} onPress={() => viewItem( item )}>
{item.image != null ?
(
<Image source={{ uri: item.image }} style={styles.listImage}/> <Image source={{ uri: item.image }} style={styles.listImage}/>
) :
(
<ThemedView style={styles.listImage}/>
)
}
<ThemedText type="defaultSemiBold">{item.name}</ThemedText> <ThemedText type="defaultSemiBold">{item.name}</ThemedText>
</TouchableOpacity> </TouchableOpacity>
)} )}
@ -129,15 +136,19 @@ export default function ExploreScreen() {
<ThemedView style={{ ...styles.modalView, backgroundColor: Colors[ colorScheme ].background }}> <ThemedView style={{ ...styles.modalView, backgroundColor: Colors[ colorScheme ].background }}>
<ThemedText type="subtitle" style={{ marginBottom: 30, textAlign: 'center' }}>{activeCategory?.name}</ThemedText> <ThemedText type="subtitle" style={{ marginBottom: 30, textAlign: 'center' }}>{activeCategory?.name}</ThemedText>
<View style={styles.modalType}> {activeCategory?.type &&
<Image source={{ uri: activeCategory?.type.image }} style={styles.modalTypeImage}/> <ThemedView style={styles.modalType}>
<ThemedText>{activeCategory?.type?.name}</ThemedText> {activeCategory?.type?.image &&
</View> <Image source={{ uri: activeCategory?.type?.image }} style={styles.modalTypeImage}/>
}
<ThemedText type="defaultSemiBold">{activeCategory?.type?.name}</ThemedText>
</ThemedView>
}
<View style={{ alignItems: 'center' }}> <ThemedView style={{ alignItems: 'center' }}>
<ThemedText type="defaultSemiBold">Opmerking:</ThemedText> <ThemedText type="defaultSemiBold">Beschrijving:</ThemedText>
<ThemedText>{activeCategory?.description}</ThemedText> <ThemedText>{activeCategory?.description}</ThemedText>
</View> </ThemedView>
<TouchableOpacity <TouchableOpacity
onPress={() => setActiveCategory( null )} onPress={() => setActiveCategory( null )}
@ -196,13 +207,11 @@ const styles = StyleSheet.create( {
textAlign: 'center', textAlign: 'center',
}, },
modalType: { modalType: {
flex: 1,
display: 'flex',
gap: 8, gap: 8,
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
paddingBottom: 10, paddingBottom: 10,
marginBottom: 30, marginBottom: 15,
}, },
modalTypeImage: { modalTypeImage: {
width: 40, width: 40,