Android?ListView列表怎么優化

這篇文章主要講解了“Android ListView列表怎么優化”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“Android ListView列表怎么優化”吧！

優化點1：使用 builder構建列表

當你的列表元素是動態增長的時候（比如上拉加載更多），請不要直接用children 的方式，一直往children 的數組增加組件，那樣會很糟糕。

//糟糕的用法
ListView(
  children: [
    item1,
    item2,
    item3,
    ...
  ],
)

//正確的用法
ListView.builder(
  itemBuilder: (context, index) => ListItem(),
  itemCount: itemCount,
)

對于 ListView.builder 是按需構建列表元素，也就是只有那些可見的元素才會調用itemBuilder 構建元素，這樣對于大列表而言性能開銷自然會小很多。

Creates a scrollable, linear array of widgets that are created on demand. This constructor is appropriate for list views with a large (or infinite) number of children because the builder is called only for those children that are actually visible.

優化點2：禁用 addAutomaticKeepAlives 和 addRepaintBoundaries 特性

這兩個屬性都是為了優化滾動過程中的用戶體驗的。addAutomaticKeepAlives 特性默認是 true，意思是在列表元素不可見后可以保持元素的狀態，從而在再次出現在屏幕的時候能夠快速構建。這其實是一個拿空間換時間的方法，會造成一定程度的內存開銷。可以設置為 false 關閉這一特性。缺點是滑動過快的時候可能會出現短暫的白屏（實際會很少發生）。

addRepaintBoundaries 是將列表元素使用一個重繪邊界（Repaint Boundary）包裹，從而使得滾動的時候可以避免重繪。而如果列表很容易繪制（列表元素布局比較簡單的情況下）的時候，可以關閉這個特性來提高滾動的流暢度。

addAutomaticKeepAlives: false,
addRepaintBoundaries: false,

優化點3：盡可能將列表元素中不變的組件使用 const 修飾

使用 const 相當于將元素緩存起來實現共用，若列表元素某些部分一直保持不變，那么可以使用 const 修飾。

return Padding(
  child: Row(
    children: [
      const ListImage(),
      const SizedBox(
        width: 5.0,
      ),
      Text('第$index 個元素'),
    ],
  ),
  padding: EdgeInsets.all(10.0),
);

優化點4：使用 itemExtent 確定列表元素滾動方向的尺寸

對于很多列表，我們在滾動方向上的尺寸是提前可以根據 UI設計稿知道的，如果能夠知道的話，那么使用 itemExtent 屬性制定列表元素在滾動方向的尺寸，可以提升性能。這是因為，如果不指定的話，在滾動過程中，會需要推算每個元素在滾動方向的尺寸從而消耗計算資源。

itemExtent: 120,

優化實例

下面是一開始未改造的列表，嗯，可以認為是垃圾代碼。

class LargeListView extends StatefulWidget {
  const LargeListView({Key? key}) : super(key: key);

  @override
  _LargeListViewState createState() => _LargeListViewState();
}

class _LargeListViewState extends State<LargeListView> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('大列表'),
        brightness: Brightness.dark,
      ),
      body: ListView(
        children: List.generate(
          1000,
          (index) => Padding(
            padding: EdgeInsets.all(10.0),
            child: Row(
              children: [
                Image.network(
                  'https://cache.yisu.com/upload/information/20220517/112/2097.jpg',
                  width: 200,
                ),
                const SizedBox(
                  width: 5.0,
                ),
                Text('第$index 個元素'),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

當然，實際不會是用 List.generate 來生成列表元素，但是也不要用一個 List<Widget> 列表對象一直往里面加列表元素，然后把這個列表作為 ListView 的 children！改造后的代碼如下所示，因為將列表元素拆分得更細，代碼量是多一些，但是性能上會好很多。

import 'package:flutter/material.dart';

class LargeListView extends StatefulWidget {
  const LargeListView({Key? key}) : super(key: key);

  @override
  _LargeListViewState createState() => _LargeListViewState();
}

class _LargeListViewState extends State<LargeListView> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('大列表'),
        brightness: Brightness.dark,
      ),
      body: ListView.builder(
        itemBuilder: (context, index) => ListItem(
          index: index,
        ),
        itemCount: 1000,
        addAutomaticKeepAlives: false,
        addRepaintBoundaries: false,
        itemExtent: 120.0,
      ),
    );
  }
}

class ListItem extends StatelessWidget {
  final int index;
  ListItem({Key? key, required this.index}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Padding(
      child: Row(
        children: [
          const ListImage(),
          const SizedBox(
            width: 5.0,
          ),
          Text('第$index 個元素'),
        ],
      ),
      padding: EdgeInsets.all(10.0),
    );
  }
}

class ListImage extends StatelessWidget {
  const ListImage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Image.network(
      'https://cache.yisu.com/upload/information/20220517/112/2097.jpg',
      width: 200,
    );
  }
}

感謝各位的閱讀，以上就是“Android ListView列表怎么優化”的內容了，經過本文的學習后，相信大家對Android ListView列表怎么優化這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！