1import React from 'react'; 2import {StyleProp, StyleSheet, TouchableOpacity, ViewStyle} from 'react-native'; 3import rpx from '@/utils/rpx'; 4import Image from './image'; 5import {ImgAsset} from '@/constants/assetsConst'; 6import ThemeText from './themeText'; 7 8interface IImageBtnProps { 9 uri?: string; 10 title?: string; 11 onPress?: () => void; 12 style?: StyleProp<ViewStyle>; 13} 14export default function ImageBtn(props: IImageBtnProps) { 15 const {onPress, uri, title, style: _style} = props ?? {}; 16 return ( 17 <TouchableOpacity 18 activeOpacity={0.5} 19 onPress={onPress} 20 style={[style.wrapper, _style]}> 21 <Image 22 style={style.image} 23 uri={uri} 24 emptySrc={ImgAsset.albumDefault} 25 /> 26 <ThemeText 27 fontSize="subTitle" 28 numberOfLines={2} 29 ellipsizeMode="tail"> 30 {title ?? ''} 31 </ThemeText> 32 </TouchableOpacity> 33 ); 34} 35 36const style = StyleSheet.create({ 37 wrapper: { 38 width: rpx(210), 39 height: rpx(290), 40 flexGrow: 0, 41 flexShrink: 0, 42 }, 43 image: { 44 width: rpx(210), 45 height: rpx(210), 46 borderRadius: rpx(12), 47 marginBottom: rpx(16), 48 }, 49}); 50