subtracks/app/components/Button.tsx
2021-07-08 12:21:44 +09:00

32 lines
821 B
TypeScript

import React, { useState } from 'react'
import { GestureResponderEvent, Pressable, Text } from 'react-native'
import colors from '@app/styles/colors'
import text from '@app/styles/text'
const Button: React.FC<{
title: string
onPress: (event: GestureResponderEvent) => void
}> = ({ title, onPress }) => {
const [opacity, setOpacity] = useState(1)
return (
<Pressable
onPress={onPress}
onPressIn={() => setOpacity(0.6)}
onPressOut={() => setOpacity(1)}
onLongPress={() => setOpacity(1)}
style={{
backgroundColor: colors.accent,
paddingHorizontal: 24,
minHeight: 42,
justifyContent: 'center',
borderRadius: 1000,
opacity,
}}>
<Text style={{ ...text.button }}>{title}</Text>
</Pressable>
)
}
export default Button