Files
bw-expo-app/components/ui/icon-symbol.tsx
imeepos af64049c69 feat: 完整应用重构 - 优化界面架构与用户体验
主要变更:
- 重构应用界面:优化首页、登录、认证流程
- 新增用户档案模块:包含完整的档案管理组件
- 优化路由结构:重新组织页面布局和导航
- 改进API集成:新增活动、内容分类等API模块
- 删除冗余组件:清理不必要的文件和依赖

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-03 12:44:12 +08:00

51 lines
1.6 KiB
TypeScript

// Fallback for using MaterialIcons on Android and web.
import MaterialIcons from '@expo/vector-icons/MaterialIcons';
import { SymbolWeight, SymbolViewProps } from 'expo-symbols';
import { ComponentProps } from 'react';
import { OpaqueColorValue, type StyleProp, type TextStyle } from 'react-native';
type IconMapping = Record<SymbolViewProps['name'], ComponentProps<typeof MaterialIcons>['name']>;
export type IconSymbolName = keyof typeof MAPPING;
/**
* Add your SF Symbols to Material Icons mappings here.
* - see Material Icons in the [Icons Directory](https://icons.expo.fyi).
* - see SF Symbols in the [SF Symbols](https://developer.apple.com/sf-symbols/) app.
*/
const MAPPING = {
'house.fill': 'home',
'paperplane.fill': 'send',
'chevron.left.forwardslash.chevron.right': 'code',
'chevron.right': 'chevron-right',
'person.fill': 'person',
'person': 'person',
'gearshape': 'settings',
'person.circle': 'person-outline',
'bell': 'notifications',
'lock': 'lock',
'info.circle': 'info',
'exclamationmark.bubble': 'feedback',
'arrow.right.square': 'logout',
} as IconMapping;
/**
* An icon component that uses native SF Symbols on iOS, and Material Icons on Android and web.
* This ensures a consistent look across platforms, and optimal resource usage.
* Icon `name`s are based on SF Symbols and require manual mapping to Material Icons.
*/
export function IconSymbol({
name,
size = 24,
color,
style,
}: {
name: IconSymbolName;
size?: number;
color: string | OpaqueColorValue;
style?: StyleProp<TextStyle>;
weight?: SymbolWeight;
}) {
return <MaterialIcons color={color} size={size} name={MAPPING[name]} style={style} />;
}