Files
mindfulness/client/app/(app)/settings.tsx
2026-03-03 19:55:53 +08:00

67 lines
2.0 KiB
TypeScript

import Constants from 'expo-constants';
import { Platform, StyleSheet, Text, View, useWindowDimensions } from 'react-native';
import { useTranslation } from 'react-i18next';
import { clampContentWidth, isIPadLike } from '@/src/utils/device';
export default function SettingsScreen() {
const { t } = useTranslation();
const { width, height } = useWindowDimensions();
const isTablet = isIPadLike(width, height);
const contentWidth = isTablet ? clampContentWidth(width, 720, 24) : undefined;
const version =
Constants.expoConfig?.version ??
// 兜底:部分环境下 expoConfig 可能为空
'unknown';
return (
<View style={styles.container}>
<View style={[styles.contentWrap, contentWidth ? { width: contentWidth } : null]}>
<View style={styles.section}>
<Text style={styles.label}>{t('settings.version')}</Text>
<Text style={styles.value}>{version}</Text>
</View>
<View style={styles.card}>
<Text style={styles.cardTitle}>{t('settings.widgetTitle')}</Text>
<Text style={styles.cardText}>{t('settings.widgetDesc')}</Text>
</View>
</View>
</View>
);
}
const styles = StyleSheet.create({
container: { flex: 1, width: '100%', alignSelf: 'stretch', padding: 16 },
contentWrap: {
width: '100%',
alignSelf: 'center',
gap: 16,
},
section: {
borderRadius: 14,
padding: 16,
backgroundColor: '#FFFFFF',
borderWidth: StyleSheet.hairlineWidth,
borderColor: '#E5E7EB',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
},
label: { color: '#374151', fontSize: 16 },
value: {
color: '#111827',
fontSize: 16,
fontWeight: '600',
fontFamily: Platform.OS === 'ios' ? 'STIX Two Text' : undefined,
},
card: {
borderRadius: 16,
padding: 16,
backgroundColor: '#111827',
},
cardTitle: { color: 'white', fontSize: 16, fontWeight: '700', marginBottom: 8 },
cardText: { color: '#E5E7EB', fontSize: 14, lineHeight: 20 },
});