[flutter] BottomSheet 리스트뷰 만들기
Flutter에서 BottomSheet를 사용하여 사용자에게 리스트뷰를 제공하는 방법에 대해 알아보겠습니다.
BottomSheet 생성
BottomSheet를 생성하려면 showModalBottomSheet
메서드를 사용합니다. 이 메서드는 해당 플랫폼에 맞게 BottomSheet를 나타냅니다.
void _showBottomSheet(BuildContext context) {
showModalBottomSheet(
context: context,
builder: (BuildContext buildContext) {
return Container(
child: ListView(
children: <Widget>[
ListTile(
title: Text('항목 1'),
onTap: () {
// 항목 1 선택 시 동작
},
),
ListTile(
title: Text('항목 2'),
onTap: () {
// 항목 2 선택 시 동작
},
),
// 추가 항목들
],
),
);
},
);
}
위 코드에서 showModalBottomSheet
메서드를 호출하면 BottomSheet가 표시됩니다. 리스트뷰를 포함한 컨테이너가 반환되어 BottomSheet 내부에 표시됩니다.
이제 showModalBottomSheet
메서드에 builder
속성을 통해 리스트뷰를 구성합니다.
다양한 항목이 포함된 ListView를 생성하여 BottomSheet 내에 나타낼 수 있습니다. ListTile을 사용하여 각 항목을 표시하고 사용자의 상호작용에 대한 동작을 정의할 수 있습니다.
결론
BottomSheet를 사용하여 간단하게 리스트뷰를 제공하는 방법에 대해 살펴보았습니다. BottomSheet를 통해 손쉽게 사용자와 상호작용할 수 있는 UI를 구현할 수 있습니다.