Files
roomscan-ai/src/screens/ResultScreen.tsx
2026-04-28 11:43:56 +02:00

131 lines
3.3 KiB
TypeScript

import type { NativeStackScreenProps } from '@react-navigation/native-stack';
import { StyleSheet, Text, View } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { PrimaryButton } from '../components/PrimaryButton';
import type { RootStackParamList } from '../navigation/types';
import { colors } from '../theme/colors';
type ResultScreenProps = NativeStackScreenProps<RootStackParamList, 'Result'>;
export function ResultScreen({ navigation }: ResultScreenProps) {
return (
<SafeAreaView style={styles.safeArea} edges={['bottom']}>
<View style={styles.container}>
<View style={styles.modelPreview}>
<View style={styles.floorPlan}>
<View style={styles.wallLong} />
<View style={styles.wallShort} />
<View style={styles.roomBlockLarge} />
<View style={styles.roomBlockSmall} />
</View>
<Text style={styles.previewLabel}>Mock 3D Modell</Text>
</View>
<View style={styles.summaryCard}>
<Text style={styles.title}>Scan bereit zur Auswertung</Text>
<Text style={styles.body}>
Diese Ansicht ist ein Platzhalter fuer das spaetere RoomPlan-Ergebnis. Nach der nativen iOS
Integration werden hier erkannte Waende, Tueren, Fenster und Moebel angezeigt.
</Text>
</View>
<View style={styles.actions}>
<PrimaryButton label="Neuen Scan starten" onPress={() => navigation.navigate('Scan')} />
<PrimaryButton label="Zur Startseite" variant="secondary" onPress={() => navigation.navigate('Home')} />
</View>
</View>
</SafeAreaView>
);
}
const styles = StyleSheet.create({
safeArea: {
flex: 1,
},
container: {
flex: 1,
gap: 20,
padding: 20,
},
modelPreview: {
alignItems: 'center',
backgroundColor: colors.surface,
borderColor: colors.border,
borderRadius: 30,
borderWidth: 1,
flex: 1,
justifyContent: 'center',
minHeight: 360,
padding: 24,
},
floorPlan: {
borderColor: colors.primary,
borderRadius: 24,
borderWidth: 3,
height: 220,
transform: [{ rotateX: '58deg' }, { rotateZ: '-18deg' }],
width: 220,
},
wallLong: {
backgroundColor: colors.primary,
borderRadius: 10,
height: 14,
left: 20,
position: 'absolute',
top: 72,
width: 150,
},
wallShort: {
backgroundColor: colors.accent,
borderRadius: 10,
height: 110,
position: 'absolute',
right: 48,
top: 54,
width: 14,
},
roomBlockLarge: {
backgroundColor: 'rgba(98, 214, 255, 0.24)',
borderRadius: 18,
bottom: 28,
height: 70,
left: 34,
position: 'absolute',
width: 88,
},
roomBlockSmall: {
backgroundColor: 'rgba(181, 240, 109, 0.28)',
borderRadius: 14,
height: 52,
position: 'absolute',
right: 32,
top: 24,
width: 58,
},
previewLabel: {
color: colors.textSecondary,
fontSize: 15,
marginTop: 32,
},
summaryCard: {
backgroundColor: colors.surfaceRaised,
borderRadius: 24,
padding: 20,
},
title: {
color: colors.textPrimary,
fontSize: 21,
fontWeight: '900',
},
body: {
color: colors.textSecondary,
fontSize: 15,
lineHeight: 23,
marginTop: 10,
},
actions: {
gap: 12,
},
});