#android #flutter #pageviews
#Android #flutter #просмотры страниц
Вопрос:
Я создаю приложение для комиксов. Чтобы главы комиксов загружались быстрее. Я хочу, чтобы изображения загружались последовательно одно за другим. Когда загрузка изображения завершается, оно отображается непосредственно в режиме просмотра страницы. Я не знаю, как загружать изображения одно за другим и редактировать вид страницы, чтобы представить их.
Комментарии:
1. использование streambuilder api.flutter.dev/flutter/widgets/StreamBuilder-class.html
2. Не могли бы вы подробнее рассказать. Как простой пример того, как установить это для изображений.
Ответ №1:
Чтобы ускорить загрузку изображения, вы можете попробовать использовать пакет cached_network_image, подобный этому:
CachedNetworkImage(
imageUrl: "http://via.placeholder.com/350x150",
placeholder: (context, url) => CircularProgressIndicator(),
errorWidget: (context, url, error) => Icon(Icons.error),
),
Он будет показывать заполнитель до тех пор, пока изображение не загрузится, чтобы пользователь мог видеть, сколько изображений существует, и ждать, пока оно загрузится, а errorWidget покажет, возникли ли проблемы с каким-либо изображением. Поэтому я предлагаю использовать его, это проще. Если вам не нужен какой-то сложный код, вы можете попробовать использовать, ScrollController
поместив его в свой ListView.builder
. Инициализируйте свой контроллер прокрутки в initState следующим образом :
final _scrollController = ScrollController();
@override
void initState() {
super.initState();
_scrollController.addListener(() {
if (_scrollController.position.pixels ==
_scrollController.position.maxScrollExtent) {
// scroll has reach end, now load more images.
loadMore();
}
});
}
Вы не можете использовать setState
inside initState
, поэтому я создаю другой метод, чтобы вызвать его следующим образом:
Future<void> loadMore() async {
final response = await api.get("curated?per_page=50amp;page=$_currentPage");
if (response.statusCode == 200) {
var tempList = Pages.fromJson(response.data);
setState(() {
isLoading = false;
wallpaper.addAll(tempList.photos);
});
}
return null;
}
Итак, я надеюсь, вы сможете понять, и да, это сложнее, поэтому, как я уже сказал, я предлагаю вам использовать CachedNetworkImage
.
Комментарии:
1. Спасибо, например, но я не могу использовать кэшированное сетевое изображение, потому что мои изображения имеют динамический URL.
2. Хорошо, тогда вы можете использовать контроллер прокрутки или создать кнопку для загрузки следующего изображения или чего-то еще
Ответ №2:
используйте StreamBuilder, он сделает всю работу за вас.
Комментарии:
1. Не могли бы вы подробнее рассказать. Как простой пример того, как установить это для изображений. извините за поздний ответ
2. getImageFunction(){ …………. ………. } StreamBuilder( поток: getImageFunction, builder: …………….. ) Каждый раз, когда функция getImageFunction получает изображение из Интернета или откуда бы вы ни извлекали из stream builder, соответственно создается новый виджет. Если это то, что вы хотите,