ListView는 많은 양의 데이터를 화면에 표시하는 데 유용한 위젯입니다. 때때로 ListView에 표시되는 항목을 필터링해야 할 수도 있습니다. 예를 들어, 사용자가 입력한 검색어에 따라 항목을 동적으로 필터링하여 보여주는 기능을 구현해야 할 때가 있습니다. Flutter에서 ListView에 아이템을 필터링하는 방법에 대해 알아보겠습니다.

ListView.builder 사용하기

ListView.builder는 ListView의 항목을 동적으로 생성할 수 있는 위젯입니다. 이를 사용하여 ListView에 필터링된 아이템을 표시할 수 있습니다.

ListView.builder(
  itemCount: _filteredItems.length,
  itemBuilder: (BuildContext context, int index) {
    return ListTile(
      title: Text(_filteredItems[index]),
    );
  },
)

위의 예시에서 _filteredItems는 현재 필터링된 아이템들의 목록을 가리킵니다.

검색어에 따라 필터링하기

사용자가 입력한 검색어에 따라 아이템을 필터링하려면, TextField 위젯을 통해 검색어를 입력받고 해당 검색어에 맞는 아이템들을 보여주어야 합니다.

TextField(
  onChanged: (String value) {
    setState(() {
      _filterBySearch(value);
    });
  },
)

위의 예시에서 _filterBySearch는 검색어에 따라 아이템을 필터링하는 함수를 가리킵니다.

아이템 필터링 함수 구현하기

검색어에 따라 아이템을 필터링하기 위한 함수를 구현해야 합니다. 이 함수에서는 검색어와 일치하는 아이템들을 추려내는 작업을 수행해야 합니다.

void _filterBySearch(String searchKeyword) {
  _filteredItems = _allItems.where((item) => item.contains(searchKeyword)).toList();
}

위의 예시에서 _allItems는 전체 아이템 목록을, _filteredItems는 현재 필터링된 아이템 목록을 가리킵니다.

이제 ListView에서 아이템을 필터링하는 기능을 구현하는 방법에 대해 알아보았습니다. 사용자가 입력한 검색어에 따라 동적으로 아이템을 필터링하여 표시하는 기능을 구현하고자 한다면, 위의 내용을 참고하여 구현해 보시기 바랍니다.

[참고 자료]

• Flutter ListView.builder: https://api.flutter.dev/flutter/widgets/ListView-class.html
• Flutter TextField: https://api.flutter.dev/flutter/material/TextField-class.html