You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
29 lines
1.0 KiB
29 lines
1.0 KiB
import { ActivityIndicator, Pressable, StyleSheet, Text } from 'react-native';
|
|
import { colors } from '../../../src/theme';
|
|
|
|
interface Props {
|
|
label: string;
|
|
active?: boolean;
|
|
onPress?: () => void;
|
|
loading?: boolean;
|
|
}
|
|
|
|
/** 主按钮：active=高亮可点；false=置灰(未激活) */
|
|
export function PrimaryButton({ label, active = true, onPress, loading = false }: Props) {
|
|
return (
|
|
<Pressable
|
|
style={[styles.btn, active ? styles.btnActive : styles.btnDisabled]}
|
|
onPress={active && !loading ? onPress : undefined}
|
|
disabled={!active || loading}
|
|
>
|
|
{loading ? <ActivityIndicator color={colors.textInverse} /> : <Text style={styles.btnText}>{label}</Text>}
|
|
</Pressable>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
btn: { height: 50, borderRadius: 12, alignItems: 'center', justifyContent: 'center' },
|
|
btnActive: { backgroundColor: colors.primary },
|
|
btnDisabled: { backgroundColor: colors.textDisabled },
|
|
btnText: { fontSize: 17, fontWeight: '700', color: colors.textInverse },
|
|
});
|
|
|