Proje: Okul B2B App · Hub: Okul B2B App — Decisions

react-native-sortables Galeri Sıralama Kararı

Seçim: Galeri fotoğraf sıralama için react-native-sortables kütüphanesi kullanılır.

Why: Okul yöneticileri galeri fotoğraflarını sürükle-bırak ile sıralayabilmeli. React Native Reanimated 4 tabanlı bu kütüphane; Grid ve SortableList destekli, gesture handling entegrasyonu sorunsuz.

How to apply:

// ZORUNLU: customHandle={true} — olmadan sıralama çalışmaz
<Sortable.Grid customHandle={true}>
  <Sortable.Handle mode="fixed">
    <AddPhotoCard />       // Sabit elemanlar (ekle butonu)
  </Sortable.Handle>
  <Sortable.Handle mode="draggable">
    <PhotoCard />          // Sürüklenebilir fotoğraflar
  </Sortable.Handle>
</Sortable.Grid>

customHandle={false} geçilirse tüm kartlar tıklanamaz hale gelir, sıralama gestureları kaybolur.

Sürüm: react-native-sortables@^1.9.2

Bağımlılık: react-native-reanimated ~4.1.1, react-native-gesture-handler ~2.28.0, react-native-worklets 0.5.1

Alternatifler:

  • @shopify/flash-list ile DraggableFlatList: Performanslı ama Grid layout için karmaşık
  • react-native-draggable-flatlist: FlatList bazlı, Grid desteği zayıf