Бесконечный список в приложении Flutter - PullRequest
Новая
       24

Бесконечный список в приложении Flutter

0 голосов
/ 02 ноября 2018

Я перевожу свое приложение с Android на флаттер, и до сих пор я использовал ListView в флаттере. мой вопрос, есть ли какой-либо специализированный метод для обработки большого количества данных в флаттере? Для справки, вы можете посмотреть на Android RecyclerView. это обрабатывает в представлениях памяти и перерабатывает это время выполнения. Так как же добиться функциональности, такой как RecyclerView во Flutter? или это не обязательно в флаттере?

1 Ответ

0 голосов
/ 02 ноября 2018

Самый простой способ - использовать ListView.builder без указания параметра itemCount.

Вот самый простой пример: 

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Infinite List"),
      ),
      body: ListView.builder(
        itemBuilder: (context, index) {
          return Text("$index");
        },
      ),
    );
  }
}

Позже вы можете улучшить это, извлекая реальные данные. Вы можете отобразить CircularProgressIndicator в последнем элементе списка, ожидая новых данных. 

  body: ListView.builder(
    itemBuilder: (context, index) {
      if (index < data.length) {
        // Show your info
        Text("$index");
      } else {
        getMoreData();
        return Center(child: CircularProgressIndicator());
      }
    },
    itemCount: data.length + 1,
  ),

Вы можете видеть, что мы обманули список, добавив индекс и запросив дополнительные данные при отображении этого окончательного индекса.

getMoreData() будет включать вызов setState() для принудительного восстановления и учета новых данных.

...