[flutter] ListView에서 아이템을 선택하여 다른 작업 수행하기

08 Dec 2023

flutter

Flutter 앱을 개발할 때, 사용자가 ListView에서 아이템을 선택하고 선택한 아이템에 대해 다른 작업을 수행해야 할 때가 있습니다. 예를 들어, 사용자가 목록에서 특정 아이템을 선택하면 그에 해당하는 상세 정보를 표시하거나, 수정 또는 삭제 작업을 수행해야 할 수 있습니다.

이번 포스트에서는 Flutter에서 ListView에서 아이템을 선택하여 다른 작업을 수행하는 방법에 대해 설명하겠습니다.

ListView 생성

우선, ListView를 생성하고 아이템 목록을 표시해야 합니다. 아래는 ListView를 생성하고 아이템을 표시하는 예제 코드입니다.

ListView.builder(
  itemCount: items.length,
  itemBuilder: (context, index) {
    return ListTile(
      title: Text(items[index]),
      onTap: () {
        // 선택한 아이템에 대한 작업 수행
      },
    );
  },
)

위의 예제 코드에서는 ListView.builder를 사용하여 아이템 목록을 표시하고, 각 아이템은 ListTile을 사용하여 표시하였습니다. 또한, ListTile에는 onTap 콜백을 등록하여 아이템을 선택했을 때 수행할 작업을 정의할 수 있습니다.

선택한 아이템에 대한 작업 수행

이제 선택한 아이템에 대한 작업을 수행하는 방법에 대해 알아보겠습니다. onTap 콜백에서 선택한 아이템에 대해 필요한 작업을 수행하면 됩니다. 예를 들어, 선택한 아이템에 해당하는 데이터를 가져와 상세 화면을 표시하거나, 수정 또는 삭제 작업을 수행할 수 있습니다.

ListView.builder(
  itemCount: items.length,
  itemBuilder: (context, index) {
    return ListTile(
      title: Text(items[index]),
      onTap: () {
        // 선택한 아이템에 대한 작업 수행
        String selectedItem = items[index];
        // 선택한 아이템에 대한 작업 수행
      },
    );
  },
)

위의 예제 코드에서는 onTap 콜백에서 선택한 아이템에 해당하는 데이터를 가져와 ‘selectedItem’ 변수에 저장하는 예제를 보여주고 있습니다.

이제 ListView에서 아이템을 선택하여 다른 작업을 수행하는 방법에 대해 알아보았습니다. 사용자가 ListView에서 아이템을 선택하여 다양한 작업을 수행할 때 이러한 방법을 활용하여 원하는 기능을 구현할 수 있을 것입니다.

ListView 생성

선택한 아이템에 대한 작업 수행

참고 자료