Build RoomScan AI starter app

2026-04-28 11:43:56 +02:00
parent 306c93fb47
commit bdc0c97431
16 changed files with 1071 additions and 18 deletions
--- a/src/screens/ResultScreen.tsx
+++ b/src/screens/ResultScreen.tsx
@@ -0,0 +1,130 @@
+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,
+  },
+});