본문 바로가기
Flutter/Flutter FAQ

Flutter 플러터에서 ListTile을 선택할 때 배경색을 변경하세요., Change background color of ListTile upon selection in Flutter

by 베타코드 2023. 9. 28.
반응형

질문


나는 플러터에서 ListView를 만들었는데, 이제 이 ListView에는 선택할 수 있는 몇 가지 ListTile이 있습니다. 선택하면 배경색을 내가 선택한 색상으로 변경하고 싶습니다. 그러나 그 방법을 모르겠습니다. 문서에서는 ListTilestyle 속성이 있다고 언급합니다. 그러나 나는 이 속성을 추가하려고 할 때 (아래 코드의 세 번째에서 마지막 줄처럼), 이 style 속성에 붉은 물결선이 생기고 컴파일러가 이름 지정된 매개변수 'style'이(가) 정의되지 않았다고 말합니다.

Widget _buildRow(String string){
  return new ListTile(
    title: new Text(string),
    onTap: () => setState(() => toggleSelection(string)),
    selected: selectedFriends.contains(string),
    style: new ListTileTheme(selectedColor: Colors.white,),
  );
}

답변


스크린샷:

enter image description here


단답:

ListTile(
  tileColor: isSelected ? Colors.blue : null, 
)

전체 코드:

// 단순함을 위해 두 개의 별도 'List'를 사용하지만 'Map'도 사용할 수 있습니다.
final List<int> _list = List.generate(20, (i) => i);
final List<bool> _selected = List.generate(20, (i) => false); // 처음에는 false로 채워집니다.
  
Widget build(BuildContext context) {
  return Scaffold(
    body: ListView.builder(
      itemBuilder: (_, i) {
        return ListTile(
          tileColor: _selected[i] ? Colors.blue : null, // 현재 항목이 선택되었으면 파란색 표시
          title: Text('Item ${_list[i]}'),
          onTap: () => setState(() => _selected[i] = !_selected[i]), // 불리언 값 반전
        );
      },
    ),
  );
}
반응형

댓글