**EZSwiper：React Native下平滑易用的轮播组件**

import React from 'react';
import {
  View,
  StyleSheet,
  Dimensions,
  Image,
  Text,
} from 'react-native';
import Swiper from 'react-native-swiper';
 
const { width: viewportWidth } = Dimensions.get('window');
 
const sliderContent = [
  { id: 1, title: 'Banner 1', image: require('./images/banner-1.jpg') },
  { id: 2, title: 'Banner 2', image: require('./images/banner-2.jpg') },
  { id: 3, title: 'Banner 3', image: require('./images/banner-3.jpg') },
];
 
const EZSwiper = () => (
  <Swiper style={styles.wrapper} showsButtons>
    {sliderContent.map((item) => (
      <View style={styles.slide} key={item.id}>
        <Image style={styles.image} source={item.image} />
        <Text style={styles.text}>{item.title}</Text>
      </View>
    ))}
  </Swiper>
);
 
const styles = StyleSheet.create({
  wrapper: {
    width: viewportWidth,
  },
  slide: {
    justifyContent: 'center',
    backgroundColor: 'transparent',
  },
  image: {
    width: viewportWidth,
    height: 200,
  },
  text: {
    color: '#fff',
    fontSize: 20,
    fontWeight: 'bold',
  },
});
 
export default EZSwiper;

这个代码实例展示了如何在React Native应用中使用react-native-swiper库来创建一个简单的轮播组件。它定义了一个名为EZSwiper的组件，该组件使用sliderContent数组中的数据来渲染轮播项。每个轮播项都包含一张图片和一个标题，并使用StyleSheet.create来定义样式。这个例子简洁明了，并且可以作为创建类似功能的开发者的一个很好的参考。