chore: clean code

example/package.json

@@ -16,7 +16,9 @@
   },
   "devDependencies": {
     "@babel/core": "^7.12.9",
+    "@types/react": "^18.0.25",
+    "@types/react-native": "^0.70.6",
     "babel-plugin-module-resolver": "^4.1.0"
   },
   "private": true
-}
+}

example/src/App.tsx

@@ -1,43 +1,45 @@
 /* eslint-disable react-native/no-inline-styles */
 import React from 'react';
-import { StyleSheet, View, Text, Alert } from 'react-native';
+import { StyleSheet, View, Text, Alert, ScrollView } from 'react-native';
 import { Image, Avatar } from 'react-native-element-image';
-const img = require('./assets/default.png');
+const img = require('./assets/default.jpg');
 
 const ImageScreen = (_props: any) => {
   return (
-    <View style={styles.container}>
-      <Avatar
-        size={80}
-        containerStyle={styles.avatar}
-        source={img}
-        iconEnable={false}
-        onPressIcon={() => Alert.alert('Click')}
-        nameStyle={{ fontSize: 20 }}
-      />
-      <Avatar
-        size={80}
-        containerStyle={styles.avatar}
-        source={img}
-        iconEnable
-        onPressIcon={() => Alert.alert('Click')}
-        nameStyle={{ fontSize: 20 }}
-      />
+    <ScrollView>
+      <View style={styles.container}>
+        <Avatar
+          size={80}
+          containerStyle={styles.avatar}
+          source={img}
+          iconEnable={false}
+          onPressIcon={() => Alert.alert('Click')}
+          nameStyle={{ fontSize: 20 }}
+        />
+        <Avatar
+          size={80}
+          containerStyle={styles.avatar}
+          source={img}
+          iconEnable
+          onPressIcon={() => Alert.alert('Click')}
+          nameStyle={{ fontSize: 20 }}
+        />
 
-      <Avatar
-        size={100}
-        containerStyle={styles.avatar}
-        source={img}
-        iconEnable
-        onPressIcon={() => Alert.alert('Click')}
-        name="User name"
-        nameStyle={{ fontSize: 20, marginBottom: 20 }}
-      />
-      <Text>Width: 200, Height: Automatic</Text>
-      <Image style={styles.image} source={img} width={200} />
-      <Text style={styles.text}>Width: Automatic, Height: 200</Text>
-      <Image style={styles.image} source={img} height={200} />
-    </View>
+        <Avatar
+          size={100}
+          containerStyle={styles.avatar}
+          source={img}
+          iconEnable
+          onPressIcon={() => Alert.alert('Click')}
+          name="User name"
+          nameStyle={{ fontSize: 20, marginBottom: 20 }}
+        />
+        <Text>Width: 150, Height: Automatic</Text>
+        <Image style={styles.image} source={img} width={150} />
+        <Text style={styles.text}>Width: Automatic, Height: 200</Text>
+        <Image style={styles.image} source={img} height={200} />
+      </View>
+    </ScrollView>
   );
 };
 
@@ -48,6 +50,7 @@ const styles = StyleSheet.create({
     flex: 1,
     justifyContent: 'center',
     alignItems: 'center',
+    paddingVertical: 20,
   },
   image: {
     margin: 20,