feat: 更新教练页面和布局,优化用户体验
- 将教练页面中的“Bot”名称更改为“Seal”,提升品牌一致性 - 在布局文件中调整标签标题和图标,确保与新名称一致 - 新增使用次数显示功能,优化用户对使用情况的了解 - 更新日期选择器样式,增强未来日期的禁用效果 - 优化压力分析模态框的颜色和文本,提升可读性
This commit is contained in:
@@ -13,7 +13,6 @@ import { useColorScheme } from '@/hooks/useColorScheme';
|
||||
import { calculateNutritionSummary, getDietRecords, NutritionSummary } from '@/services/dietRecords';
|
||||
import { getMonthDaysZh, getMonthTitleZh, getTodayIndexInMonth } from '@/utils/date';
|
||||
import { ensureHealthPermissions, fetchHealthDataForDate } from '@/utils/health';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { useBottomTabBarHeight } from '@react-navigation/bottom-tabs';
|
||||
import { useFocusEffect } from '@react-navigation/native';
|
||||
import dayjs from 'dayjs';
|
||||
@@ -271,15 +270,29 @@ export default function ExploreScreen() {
|
||||
>
|
||||
{days.map((d, i) => {
|
||||
const selected = i === selectedIndex;
|
||||
const isFutureDate = d.date.isAfter(dayjs(), 'day');
|
||||
return (
|
||||
<View key={`${d.dayOfMonth}`} style={styles.dayItemWrapper}>
|
||||
<TouchableOpacity
|
||||
style={[styles.dayPill, selected ? styles.dayPillSelected : styles.dayPillNormal]}
|
||||
onPress={() => onSelectDate(i)}
|
||||
activeOpacity={0.8}
|
||||
style={[
|
||||
styles.dayPill,
|
||||
selected ? styles.dayPillSelected : styles.dayPillNormal,
|
||||
isFutureDate && styles.dayPillDisabled
|
||||
]}
|
||||
onPress={() => !isFutureDate && onSelectDate(i)}
|
||||
activeOpacity={isFutureDate ? 1 : 0.8}
|
||||
disabled={isFutureDate}
|
||||
>
|
||||
<Text style={[styles.dayLabel, selected && styles.dayLabelSelected]}> {d.weekdayZh} </Text>
|
||||
<Text style={[styles.dayDate, selected && styles.dayDateSelected]}>{d.dayOfMonth}</Text>
|
||||
<Text style={[
|
||||
styles.dayLabel,
|
||||
selected && styles.dayLabelSelected,
|
||||
isFutureDate && styles.dayLabelDisabled
|
||||
]}> {d.weekdayZh} </Text>
|
||||
<Text style={[
|
||||
styles.dayDate,
|
||||
selected && styles.dayDateSelected,
|
||||
isFutureDate && styles.dayDateDisabled
|
||||
]}>{d.dayOfMonth}</Text>
|
||||
</TouchableOpacity>
|
||||
{selected && <View style={styles.selectedDot} />}
|
||||
</View>
|
||||
@@ -319,9 +332,6 @@ export default function ExploreScreen() {
|
||||
|
||||
<View style={[styles.masonryCard, styles.stepsCard]}>
|
||||
<View style={styles.cardHeaderRow}>
|
||||
<View style={styles.iconSquare}>
|
||||
<Ionicons name="footsteps-outline" size={18} color="#192126" />
|
||||
</View>
|
||||
<Text style={styles.cardTitle}>步数</Text>
|
||||
</View>
|
||||
{stepCount != null ? (
|
||||
@@ -367,9 +377,6 @@ export default function ExploreScreen() {
|
||||
|
||||
<View style={[styles.masonryCard, styles.sleepCard]}>
|
||||
<View style={styles.cardHeaderRow}>
|
||||
<View style={styles.iconSquare}>
|
||||
<Ionicons name="moon-outline" size={18} color="#192126" />
|
||||
</View>
|
||||
<Text style={styles.cardTitle}>睡眠</Text>
|
||||
</View>
|
||||
{sleepDuration != null ? (
|
||||
@@ -443,6 +450,10 @@ const styles = StyleSheet.create({
|
||||
dayPillSelected: {
|
||||
backgroundColor: lightColors.datePickerSelected,
|
||||
},
|
||||
dayPillDisabled: {
|
||||
backgroundColor: '#F5F5F5',
|
||||
opacity: 0.5,
|
||||
},
|
||||
dayLabel: {
|
||||
fontSize: 12,
|
||||
fontWeight: '700',
|
||||
@@ -452,6 +463,9 @@ const styles = StyleSheet.create({
|
||||
dayLabelSelected: {
|
||||
color: '#FFFFFF',
|
||||
},
|
||||
dayLabelDisabled: {
|
||||
color: '#9AA3AE',
|
||||
},
|
||||
dayDate: {
|
||||
fontSize: 12,
|
||||
fontWeight: '800',
|
||||
@@ -460,6 +474,9 @@ const styles = StyleSheet.create({
|
||||
dayDateSelected: {
|
||||
color: '#FFFFFF',
|
||||
},
|
||||
dayDateDisabled: {
|
||||
color: '#9AA3AE',
|
||||
},
|
||||
selectedDot: {
|
||||
width: 5,
|
||||
height: 5,
|
||||
|
||||
Reference in New Issue
Block a user