Files
digital-pilates/components/statistic/HealthDataCard.tsx
richarjiang be0a8e7393 feat: 优化健康数据相关组件及功能
- 在 CoachScreen 中调整键盘高度计算,移除不必要的 insets.bottom
- 更新 Statistics 组件,移除未使用的健康数据相关函数,简化代码
- 修改多个统计卡片,移除不必要的图标属性,提升组件简洁性
- 优化 HealthDataCard 和其他统计卡片的样式,提升视觉一致性
- 更新健康数据获取逻辑,确保数据处理更为准确
- 移除 MoodCard 中的多余元素,简化心情记录展示
- 调整 StressMeter 和其他组件的样式,提升用户体验
2025-08-25 12:44:40 +08:00

84 lines
1.6 KiB
TypeScript

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import Animated, { FadeIn, FadeOut } from 'react-native-reanimated';
interface HealthDataCardProps {
title: string;
value: string;
unit: string;
style?: object;
}
const HealthDataCard: React.FC<HealthDataCardProps> = ({
title,
value,
unit,
style
}) => {
return (
<Animated.View
entering={FadeIn.duration(300)}
exiting={FadeOut.duration(300)}
style={[styles.card, style]}
>
<View style={styles.content}>
<Text style={styles.title}>{title}</Text>
<View style={styles.valueContainer}>
<Text style={styles.value}>{value}</Text>
<Text style={styles.unit}>{unit}</Text>
</View>
</View>
</Animated.View>
);
};
const styles = StyleSheet.create({
card: {
borderRadius: 16,
shadowColor: '#000',
paddingHorizontal: 16,
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.1,
shadowRadius: 3.84,
elevation: 5,
marginVertical: 8,
flexDirection: 'row',
alignItems: 'center',
},
iconContainer: {
marginRight: 16,
alignItems: 'center',
justifyContent: 'center',
},
content: {
flex: 1,
justifyContent: 'center',
},
title: {
fontSize: 14,
color: '#192126',
marginBottom: 4,
fontWeight: '800',
},
valueContainer: {
flexDirection: 'row',
alignItems: 'flex-end',
},
value: {
fontSize: 24,
fontWeight: '800',
color: '#192126',
},
unit: {
fontSize: 14,
color: '#666',
marginLeft: 4,
marginBottom: 2,
fontWeight: '500',
},
});
export default HealthDataCard;