53 lines
1.3 KiB
JavaScript
53 lines
1.3 KiB
JavaScript
import React from "react";
|
|
import { StyleSheet, View, Text, Image } from "react-native";
|
|
import Swiper from "react-native-swiper";
|
|
|
|
const SwiperCon = () => {
|
|
const slider = [
|
|
{
|
|
img: "https://obanana.com/wp-content/uploads/2023/04/banner-05.jpg",
|
|
},
|
|
{
|
|
img: "https://obanana.com/wp-content/uploads/2021/07/new-popup-2022-768x394.png",
|
|
},
|
|
{
|
|
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={{ uri: 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;
|