如何使用shoutem/ui和react原生创建内联facepile

npm install @shoutem/ui

import React from 'react';
import { View, Image, Text } from 'react-native';
import { InlineGallery } from '@shoutem/ui';

const facepileData = [
  { image: { uri: 'https://example.com/avatar1.jpg' } },
  { image: { uri: 'https://example.com/avatar2.jpg' } },
  { image: { uri: 'https://example.com/avatar3.jpg' } },
];

const App = () => {
  return (
    <View>
      <InlineGallery
        data={facepileData}
        renderImage={(item) => (
          <Image
            style={{ width: 50, height: 50, borderRadius: 25 }}
            source={item.image}
          />
        )}
        renderOverlay={(item) => (
          <View style={{ backgroundColor: 'rgba(0, 0, 0, 0.5)', padding: 5 }}>
            <Text style={{ color: 'white' }}>Username</Text>
          </View>
        )}
      />
    </View>
  );
};

export default App;