This commit is contained in:
郭文文 2026-01-22 11:37:53 +08:00
parent d190b7eeeb
commit 900704dc9e
1 changed files with 18 additions and 12 deletions

View File

@ -5,7 +5,6 @@ import { useFocusEffect, useRouter } from 'expo-router'
import { observer } from 'mobx-react-lite' import { observer } from 'mobx-react-lite'
import React, { memo, useCallback, useEffect, useMemo, useState } from 'react' import React, { memo, useCallback, useEffect, useMemo, useState } from 'react'
import { ActivityIndicator, RefreshControl } from 'react-native' import { ActivityIndicator, RefreshControl } from 'react-native'
import { useAnimatedStyle } from 'react-native-reanimated'
import { useSafeAreaInsets } from 'react-native-safe-area-context' import { useSafeAreaInsets } from 'react-native-safe-area-context'
import { imgPicker } from '@/@share/apis/imgPicker' import { imgPicker } from '@/@share/apis/imgPicker'
@ -511,22 +510,29 @@ type TemplateSectionHeaderProps = {
onRandom: () => void onRandom: () => void
} }
const TemplateSectionHeader = memo<TemplateSectionHeaderProps>(function TemplateSectionHeader({ onRandom }) { const TemplateSectionHeader = memo<TemplateSectionHeaderProps>(function TemplateSectionHeader({ onRandom }) {
const style = useAnimatedStyle(() => ({ const skewOffset = 8
transform: [{ skewX: '-6deg' }], const padding = 2
backgroundColor: '#FFE500', const buttonWidth = 100
})) const buttonHeight = 32
return ( return (
<Block className="my-[16px]"> <Block className="my-[16px]">
<Block className="flex-row items-center justify-between"> <Block className="flex-row items-center justify-between">
<Block <Block className="relative" style={{ width: buttonWidth, height: buttonHeight }}>
animated <ParallelogramShape
className="flex-row items-center gap-[8px] border-2 border-black bg-accent px-[12px] py-[4px]" width={buttonWidth}
style={style} height={buttonHeight}
fillColor="#FFE500"
padding={padding}
skewOffset={skewOffset}
strokeWidth={2}
> >
<Block className="absolute inset-0 flex-row items-center gap-[8px] px-[16px]">
<FontAwesome color="black" name="film" size={16} /> <FontAwesome color="black" name="film" size={16} />
<Text className="text-[10px] font-[900] text-black"></Text> <Text className="text-[10px] font-[900] text-black"></Text>
</Block> </Block>
</ParallelogramShape>
</Block>
<Block <Block
className="-skew-x-6 items-center justify-center border-2 border-black bg-white px-[8px] py-[4px]" className="-skew-x-6 items-center justify-center border-2 border-black bg-white px-[8px] py-[4px]"