fix: add real images to ImageTestScreen in web example

The ImageTestScreen was only showing colored boxes instead of actual images.
Now it includes:
- 3 random images from Picsum Photos API
- 1 colored box for comparison
- Updated description to reflect real image testing
- Added testImage style for proper image rendering

This makes the ImageTestScreen actually test image capture functionality.

Author: greweb

example-web/src/screens/ImageTestScreen.tsx

@@ -51,9 +51,9 @@ const ImageTestScreen: React.FC<Props> = ({goBack}) => {
         <View style={styles.infoCard}>
           <Text style={styles.infoTitle}>📸 About Image Capture</Text>
           <Text style={styles.infoText}>
-            This test demonstrates capturing views that contain images. The
-            library can capture both inline data URIs and styled elements
-            containing images.
+            This test demonstrates capturing views that contain real images from external URLs.
+            The library can capture both inline images and styled elements containing images.
+            Test with different formats (PNG/JPG) to see how images are rendered in the output.
           </Text>
         </View>
 
@@ -62,18 +62,41 @@ const ImageTestScreen: React.FC<Props> = ({goBack}) => {
             <Text style={styles.title}>🖼️ Image Gallery</Text>
 
             <View style={styles.imageCard}>
-              <View style={styles.colorBox} />
-              <Text style={styles.cardText}>Colored Box</Text>
+              <Image
+                source={{
+                  uri: "https://picsum.photos/100/100?random=1",
+                }}
+                style={styles.testImage}
+                resizeMode="cover"
+              />
+              <Text style={styles.cardText}>Random Image 1</Text>
+            </View>
+
+            <View style={styles.imageCard}>
+              <Image
+                source={{
+                  uri: "https://picsum.photos/100/100?random=2",
+                }}
+                style={styles.testImage}
+                resizeMode="cover"
+              />
+              <Text style={styles.cardText}>Random Image 2</Text>
             </View>
 
             <View style={styles.imageCard}>
-              <View style={[styles.colorBox, {backgroundColor: "#E91E63"}]} />
-              <Text style={styles.cardText}>Another Color</Text>
+              <Image
+                source={{
+                  uri: "https://picsum.photos/100/100?random=3",
+                }}
+                style={styles.testImage}
+                resizeMode="cover"
+              />
+              <Text style={styles.cardText}>Random Image 3</Text>
             </View>
 
             <View style={styles.imageCard}>
-              <View style={[styles.colorBox, {backgroundColor: "#9C27B0"}]} />
-              <Text style={styles.cardText}>Third Color</Text>
+              <View style={styles.colorBox} />
+              <Text style={styles.cardText}>Colored Box (for comparison)</Text>
             </View>
 
             <View style={styles.gradientBox}>
@@ -238,6 +261,12 @@ const styles = StyleSheet.create({
     borderRadius: 8,
     marginRight: 16,
   },
+  testImage: {
+    width: 50,
+    height: 50,
+    borderRadius: 8,
+    marginRight: 16,
+  },
   cardText: {
     fontSize: 16,
     color: "#333",