Réagir au problème de navigation de la liste plate native

2020-06-02 android reactjs react-native react-native-flatlist recyclerlistview

J'utilise la liste plate comme conteneur racine pour faire défiler. La liste plate contient RecyclerListView. Chaque ligne de liste plate est RecyclerListView. Chaque ligne de Flatlist n'a pas de hauteur fixe. j'utilise donc getItemLayout pour renvoyer la valeur de décalage correcte.

const getItemLayout = (dat, index) => {
    let offset
    let dataItem
    if (index === 1) {
      offset = Constants.BrowseSettings.REGULAR_LAYOUT_HEIGHT + Constants.BrowseSettings.CAROUSEL_TITLE_HEIGHT
      dataItem = { length: getDimensions(index).height, offset, index }
    } else if (index === 0) {
      offset = 0
      dataItem = { length: 0, offset, index }
    } else {
      console.log(Constants.BrowseSettings.MIXED_LAYOUT_HEIGHT + Constants.BrowseSettings.CAROUSEL_TITLE_HEIGHT)
      console.log(Constants.BrowseSettings.REGULAR_LAYOUT_HEIGHT + Constants.BrowseSettings.CAROUSEL_TITLE_HEIGHT)

      const multipleBlock = Math.floor((index - 1) / 4)
      const remainingBlock = (index - 1) % 4
      let totalOffset = BLOCK_SIZE_OFFSET * multipleBlock
      if (remainingBlock > 0) {
        switch (remainingBlock) {
          case 1:
            totalOffset += DOUBLE_SIZE
            break
          case 2:
            totalOffset += DOUBLE_SIZE + REGULAR_SIZE
            break
          case 3:
            totalOffset += DOUBLE_SIZE + REGULAR_SIZE + REGULAR_SIZE
            break
          default:
            // ignore
            break
        }
      }
      totalOffset += REGULAR_SIZE
      dataItem = { length: getDimensions(index).height, offset: totalOffset, index }
    }
    return dataItem
  }

Cela fonctionne bien en cas de défilement vertical vers le bas, mais lorsque je monte parfois, cela provoque deux clics pour changer la mise au point, un pour mettre l'élément au point et un autre pour changer la mise au point et faire défiler l'élément complet qui est au point. Comment puis-je résoudre ce problème?

Si le premier élément de ma première ligne a deux fois la largeur de la ligne en dessous et lorsque j'appuie sur le bouton Bas, le focus passe au deuxième élément de la ligne suivante et non au premier. Le natif de React a-t-il toujours le focus? Est-il possible de démarrer la navigation à partir de la gauche

Merci

Answers

Related