css

app/(tabs)/index.tsx

@@ -20,6 +20,7 @@ import { screenWidth, storage } from '@/utils'
 import { cn } from '@/utils/cn'
 import ParallelogramButton from '@/components/ParallelogramButton'
 import ParallelogramShape from '@/components/ParallelogramShape'
+import ParallelogramGridItem from '@/components/ParallelogramGridItem'
 
 const CATEGORY_ID = process.env.EXPO_PUBLIC_INDEX_GROUP_ID
 const ITEM_WIDTH = Math.floor((screenWidth - 24 - 12 * 2) / 3)
@@ -430,7 +431,15 @@ const Index = observer(function Index() {
 
   const renderItem = useCallback(
     ({ item, index }: { item: MediaItem; index: number }) => (
-      <GridItem
+      // <GridItem
+      //   isSelected={selectedId === item.id}
+      //   item={item}
+      //   itemWidth={ITEM_WIDTH}
+      //   // 页面失焦时不渲染，减少内存占用
+      //   isVisible={isFocused && (index < 9 || visibleIdsRef.current.has(item.id))}
+      //   onSelect={() => setSelectedItem(item)}
+      // />
+      <ParallelogramGridItem
         isSelected={selectedId === item.id}
         item={item}
         itemWidth={ITEM_WIDTH}