Android 7 React Собственное количество компонентов ограничено?

Я делаю свое первое приложение React Native, пока без редукса, просто RN. Дело в том, что на Android 7 не так много компонентов, но на более поздних версиях Android оно отлично работает на устройствах ввода-вывода.

Вот скриншоты моей проблемы, на Android вы можете увидеть много пустого пространства, но на iOs оно заполнено данными:

Android 7:

IOS:

Вот структура и CSS:

<ScrollView contentContainerStyle={mainView}>
  <View style={sectionStyle}>...</View>
  <View style={sectionStyle}>...</View>
  ...
  <View style={sectionStyle}>...</View>
</ScrollView>
  mainView: {
    backgroundColor: colors.backgroundGray,
    justifyContent: 'flex-start'
  },
  sectionStyle: {
    paddingTop: 15,
    paddingBottom: 15,
    backgroundColor: colors.mainWhite,
    margin: 5,
    borderWidth: 1,
    borderColor: colors.borderGray,
    borderRadius: 5,
    shadowOpacity: 0.5,
    shadowRadius: 2,
    shadowOffset: {
      width: 0,
      height: 2
    },
    shadowColor: colors.shadowColor,
    elevation: 5
}

Что может вызвать эту проблему и что можно сделать, чтобы это исправить?

UPD: после нескольких дней отладки я обнаружил, что проблема может быть вызвана ограничением числа компонентов Android 7, отображаемых на экране, потому что их много на этой странице, например, 10-15 экранов с иконками, комментариями, ползунки и выпадающие. Если я отображаю только фиктивный текст вместо них - все отображается, и то же самое происходит, если я отображаю почти все из них, за исключением, например, раскрывающихся списков. Есть идеи?

1 ответ

Решение

Ну, еще раз я отвечаю на свой собственный вопрос, это похоже на медитативный монолийский сервис:D

Я решил эту проблему. На этой странице действительно огромное количество сложных компонентов, таких как ~30 сложных видов, сгруппированных по другим представлениям (это потому, что эта часть страницы должна быть одинаковой для всех продуктов, поэтому она жестко закодирована) + массивный плоский список одинаковых структурированных представлений (это потому что продукты имеют уникальную структуру, поэтому они динамические), и все это находится внутри ScrollView для включения прокрутки (в противном случае не имеет смысла иметь 20+ экранов длинной страницы без возможности прокручивать ее). Поэтому я поместил эти статические жестко закодированные компоненты в массив, объединил их с массивом динамических компонентов и отобразил только один FlatList, заменив им весь ScrollView.

Другие вопросы по тегам