32 lines
886 B
React
32 lines
886 B
React
|
import { Text, View, Dimensions } from "react-native";
|
||
|
|
import React from "react";
|
||
|
|
import Swiper from "react-native-swiper";
|
||
|
|
import { Image } from "expo-image";
|
||
|
|
import { useTailwind } from "tailwind-rn";
|
||
|
|
|
||
|
|
export default function Banner({ urls }) {
|
||
|
|
const tailwind = useTailwind();
|
||
|
|
const screenWidth = Dimensions.get("window").width;
|
||
|
|
return (
|
||
|
|
<Swiper
|
||
|
|
autoplay
|
||
|
|
width={screenWidth}
|
||
|
|
height={(screenWidth * 2) / 7}
|
||
|
|
paginationStyle={tailwind("bottom-2")}
|
||
|
|
activeDotStyle={tailwind("bg-fuchsia-400")}
|
||
|
|
>
|
||
|
|
{urls.map((url) => (
|
||
|
|
<View key={url} style={tailwind("px-2 py-1")}>
|
||
|
|
<Image
|
||
|
|
source={url}
|
||
|
|
contentFit="cover"
|
||
|
|
transition={1000}
|
||
|
|
cachePolicy="disk"
|
||
|
|
style={tailwind("w-full h-full rounded-lg overflow-hidden")}
|
||
|
|
/>
|
||
|
|
</View>
|
||
|
|
))}
|
||
|
|
</Swiper>
|
||
|
|
);
|
||
|
|
}
|