bowong
/
expo-duooomi-app
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 搜索框

This commit is contained in:
郭文文 2026-01-21 13:26:51 +08:00
parent 9fbb9e785a
commit ce9d57a8a0
1 changed files with 22 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
app/(tabs)/index.tsx
View File

@ -442,7 +442,7 @@ const Index = observer(function Index() {
return (
<Block className="flex-1 bg-black px-[12px]">
<BannerSection />
<HeroCircle onOpenSearch={() => setIsSearchOpen(true)} onQuickGen={handleQuickGen} selectedItem={selectedItem} />
<HeroCircle isSearchOpen={isSearchOpen} onOpenSearch={() => setIsSearchOpen(true)} onQuickGen={handleQuickGen} selectedItem={selectedItem} />
<FilterSection
activeTab={activeTab}
onChange={(tab) => {
@ -522,7 +522,7 @@ const SearchOverlay = memo<SearchOverlayProps>(function SearchOverlay({ isOpen,
if (!isOpen) return null
return (
<Block className="absolute inset-x-0 top-0 z-50 mt-[24px] flex-row items-center gap-[8px] px-[20px]">
<Block className="absolute inset-x-0 top-0 z-50 flex-row items-center gap-[8px] px-[20px]" style={{ marginTop: 16, marginBottom: 26 }}>
<Block
className="flex-1 flex-row items-center border-[3px] border-black bg-white px-[12px] shadow-[4px_4px_0px_#000]"
style={{ height: 48, transform: [{ skewX: '-6deg' }] }}
@ -575,13 +575,6 @@ const GooActions = observer<GooActionsProps>(function GooActions({ gooPoints, on
{isDev && isPolling && <Block className="ml-[4px] size-[6px] rounded-full bg-green-500" />}
</Block>
)}
{/* <Block
className="size-[48px] items-center justify-center rounded-full border-[3px] border-black bg-white shadow-[4px_4px_0px_#000]"
onClick={onOpenSearch}
>
<Ionicons color="black" name="search" size={22} />
</Block> */}
</Block>
</Block>
)
@ -623,7 +616,7 @@ const DuooomiLogo = memo(function DuooomiLogo() {
const width = 200
const height = 40
const textHeight = paragraph.getHeight()
const y = (height - textHeight) / 2
const y = (height - textHeight) / 1.5
return (
<Canvas style={{ width, height }}>
@ -636,8 +629,9 @@ type HeroCircleProps = {
selectedItem: MediaItem | null
onQuickGen: () => void
onOpenSearch: () => void
isSearchOpen: boolean
}
const HeroCircle = observer<HeroCircleProps>(function HeroCircle({ selectedItem, onQuickGen, onOpenSearch }) {
const HeroCircle = observer<HeroCircleProps>(function HeroCircle({ selectedItem, onQuickGen, onOpenSearch, isSearchOpen }) {
const isAuthenticated = userStore.isAuthenticated
const { balance } = userBalanceStore
@ -648,8 +642,8 @@ const HeroCircle = observer<HeroCircleProps>(function HeroCircle({ selectedItem,
return (
<Block className="relative z-10 items-center">
<Block className='flex-row justify-between items-center w-full mx-[16px] mb-[18px]'>
<Block >
<Block className='flex-row justify-between items-center w-full mx-[16px] mb-[18px]' style={{ opacity: isSearchOpen ? 0 : 1, pointerEvents: isSearchOpen ? 'none' : 'auto' }}>
<Block>
<DuooomiLogo />
</Block>
<Block className="flex-shrink-0">
@ -698,12 +692,21 @@ const HeroCircle = observer<HeroCircleProps>(function HeroCircle({ selectedItem,
</Block>
</Block>
</Block>
<Block
className="size-[48px] items-center justify-center rounded-full border-[3px] border-black bg-white shadow-[4px_4px_0px_#000]"
onClick={onOpenSearch}
>
<Ionicons color="black" name="search" size={22} />
</Block>
{!isSearchOpen && (
<Block className='gap-[10px]'>
<Block
className="size-[46px] items-center justify-center rounded-full border-[2px] border-black bg-white shadow-[4px_4px_0px_#000]"
onClick={onOpenSearch}
>
<Ionicons color="black" name="search" size={22} />
</Block>
<Block
className="size-[46px] items-center justify-center rounded-full border-[2px] border-black bg-white shadow-[4px_4px_0px_#000]"
>
<Ionicons color="black" name="settings" size={22} />
</Block>
</Block>
)}
</Block>
</Block>
)