| 123456789101112131415161718192021222324252627282930313233343536373839404142 |
- /**
- * 轮播图指示器
- * @邠心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
- }
- })
|