1
0
mirror of https://github.com/tooot-app/app synced 2025-06-05 22:19:13 +02:00

Use svg icons instead of expo ones

Possibility to control `strokeWidth`
This commit is contained in:
Zhiyuan Zheng
2021-01-03 02:00:26 +01:00
parent 5a80359739
commit dceaf8d25c
62 changed files with 495 additions and 427 deletions

45
src/components/Icon.tsx Normal file
View File

@ -0,0 +1,45 @@
import React, { createElement } from 'react'
import { StyleProp, View, ViewStyle } from 'react-native'
import * as FeatherIcon from 'react-native-feather'
export interface Props {
name: string
size: number
color: string
strokeWidth?: number
inline?: boolean // When used in line of text, need to drag it down
style?: StyleProp<ViewStyle>
}
const Icon: React.FC<Props> = ({
name,
size,
color,
strokeWidth = 2,
inline = false,
style
}) => {
return (
<View
style={[
style,
{
width: size,
height: size,
justifyContent: 'center',
alignItems: 'center',
marginBottom: inline ? -size * 0.125 : undefined
}
]}
>
{createElement(FeatherIcon[name], {
width: size,
height: size,
color,
strokeWidth
})}
</View>
)
}
export default Icon