Obanana_test/app/components/main/home/Swiper.jsx

import React from "react";
import { StyleSheet, View, Text, Image } from "react-native";
import Swiper from "react-native-swiper";
import obnBanner1 from"./../../../../assets/obnBanner1.png"
import obnBanner12 from"./../../../../assets/obnBanner12png.png"


const SwiperCon = () => {
  const slider = [
    {
      img: obnBanner1,
    },
    {
      img: obnBanner12,
    },
    // {
    //   img: "https://obanana.com/wp-content/uploads/2023/04/Banner-04_compressed-scaled-1.jpg",
    // },
  ];
  return (
    <View style={styles.container}>
      <Swiper style={styles.wrapper} autoplay >
        {slider.map((e, index) => (
          <View style={styles.slide1} key={index}>
            <Image source={ e.img } style={styles.image} />
          </View>
        ))}
      </Swiper>
    </View>
  );
};
const styles = StyleSheet.create({
  wrapper: {
    height: 150,
    borderRadius: 15,
    overflow: 'hidden',
    // marginHorizontal:10
  },
  container: {
    height: 150,
  },
  slide1: { justifyContent: "center", alignItems: "center" },
  slide2: { justifyContent: "center", alignItems: "center" },
  text: {
    color: "#0a0a0a",
    fontSize: 25,
    fontWeight: "bold",
  },
  image: {
    width: "100%",
    height: '100%', // You can adjust the resizeMode as needed
    margin:'auto'
  },
});
export default SwiperCon;