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.
31 lines
981 B
31 lines
981 B
import { Pressable, StyleSheet, View } from 'react-native';
|
|
import { colors } from '../../../src/theme';
|
|
import { Illustration } from './Illustration';
|
|
import type { AssetName } from '../assets';
|
|
|
|
interface Props {
|
|
name?: AssetName;
|
|
size?: number;
|
|
selected?: boolean;
|
|
onPress?: () => void;
|
|
}
|
|
|
|
/** 圆形头像占位：默认头像剪影 / 真实图；选中态加主色描边 */
|
|
export function Avatar({ name = 'defaultAvatar', size = 64, selected = false, onPress }: Props) {
|
|
const content = (
|
|
<View
|
|
style={[
|
|
styles.wrap,
|
|
{ width: size, height: size, borderRadius: size / 2, borderColor: selected ? colors.primary : colors.border },
|
|
]}
|
|
>
|
|
<Illustration name={name} size={size} circle />
|
|
</View>
|
|
);
|
|
if (onPress) return <Pressable onPress={onPress} hitSlop={6}>{content}</Pressable>;
|
|
return content;
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
wrap: { borderWidth: 2, overflow: 'hidden', backgroundColor: colors.white },
|
|
});
|
|
|