Сетевое изображение не отображается в FlatList? - PullRequest
Новая
       8

Сетевое изображение не отображается в FlatList?

0 голосов
/ 24 марта 2020

Я пытаюсь отобразить сетевое изображение в FlatList. Я знаю, что сетевое изображение должно иметь ширину и высоту, которые я ему дал

Вот мой json 

"templateview": [
            {
                "id": 4,
                "category_name": "Anniversary",
                "template_name": "http://zedexeposter.fbmlive.com/public/template_images/BYXdptf45tRoXQNv.png",
                "deleted": "0",
                "created_at": "2020-03-23 12:27:10",
                "updated_at": "2020-03-24 11:38:02"
            },
            {
                "id": 5,
                "category_name": "Birthday",
                "template_name": "http://zedexeposter.fbmlive.com/public/template_images/3Jkg5AAB2oR5VDz5.png",
                "deleted": "0",
                "created_at": "2020-03-23 12:48:29",
                "updated_at": "2020-03-24 11:38:20"
            }
        ]

Здесь мой код 

<FlatList
            horizontal
            showsHorizontalScrollIndicator={false}
            data={state.data.templateview}
            keyExtractor={(item, index) => index.toString()}
            renderItem={({item, index}) => {
              console.log(item.template_name);
              return (

                  <Image
                    source={{uri: item.template_name}}
                    style={StyleSheet.flatten([
                      styles.image,
                      {
                        borderColor: selectedImage === index ? '#000' : '#fff',
                      },
                    ])}
                  />

              );
            }}
          />

Вот мой стиль 

image: {
    width: width / 1.2,
    height: height / 2,
    resizeMode: 'cover',
    borderWidth: 2,
  },

Я также пробовал жестко задавать ширину и высоту, но та же проблема

Второе изображение в json выиграно отображается неправильно. Вместо этого отображается черное изображение. Когда я беру только компонент Image и передаю второе изображение URI, оно отображается правильно, но когда я беру его внутри FlatList, второе изображение становится черным. Эта проблема возникает только на Android. Я тестировал на iOS симуляторе, и он отображается правильно. Я тестировал только на Android Lollipop и Marshmallow. У меня нет android устройств, и эмулятор android буквально зависает на моем ноутбуке, поэтому тестирование не проводилось. Я также добавил android:largeHeap="true" в AndroidManifest к тегу приложения. URL-адрес изображения правильный, и я протестировал и открыл его в различных браузерах, и он работает.

Это происходит только для горизонтальной прокрутки FlatList, а не для вертикальной прокрутки.

...