53 lines
1.3 KiB
React
53 lines
1.3 KiB
React
|
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;
|