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

53 lines
1.3 KiB
React
Raw Normal View History

2023-09-26 14:33:01 +08:00
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;