|
|
@@ -0,0 +1,42 @@
|
|
|
+/**
|
|
|
+ * 轮播图指示器
|
|
|
+ * @邠心vbe on 2024/02/07
|
|
|
+ */
|
|
|
+import React from 'react';
|
|
|
+import { StyleSheet, Text, View } from 'react-native';
|
|
|
+
|
|
|
+export const PagerView = ({index=0,total=0}) => (
|
|
|
+ <View style={styles.pagerView}>
|
|
|
+ <View style={styles.pagerContent}>
|
|
|
+ <Text style={styles.pagerText} numberOfLines={1}>{index}</Text>
|
|
|
+ <Text style={styles.pagerText} numberOfLines={1}>{"/"}</Text>
|
|
|
+ <Text style={styles.pagerText} numberOfLines={1}>{total}</Text>
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
+);
|
|
|
+
|
|
|
+const styles = StyleSheet.create({
|
|
|
+ pagerView: {
|
|
|
+ left: 0,
|
|
|
+ right: 0,
|
|
|
+ bottom: 8,
|
|
|
+ alignItems: 'center',
|
|
|
+ position: 'absolute',
|
|
|
+ },
|
|
|
+ pagerContent: {
|
|
|
+ paddingTop: 2,
|
|
|
+ paddingLeft: 8,
|
|
|
+ paddingRight: 8,
|
|
|
+ paddingBottom: 2,
|
|
|
+ borderRadius: 30,
|
|
|
+ alignItems: 'center',
|
|
|
+ flexDirection: 'row',
|
|
|
+ justifyContent: 'center',
|
|
|
+ backgroundColor: 'rgba(0,0,0,.4)'
|
|
|
+ },
|
|
|
+ pagerText: {
|
|
|
+ color: textLight,
|
|
|
+ fontSize: 12,
|
|
|
+ padding: 1
|
|
|
+ }
|
|
|
+})
|