Flutter 아래에서 선택 버튼 표시 (showModalBottomSheet)

3149 단어 DartFlutter
이번에는 아래에서 나오는 이미지와 같은 버튼(showModalBottomSheet)을 만들어 갑니다.



설명 코드



void bottomSheet(BuildContext context) {
  showModalBottomSheet<void>(
      context: context,
      builder: (BuildContext context) {
        return SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ListTile(
                leading: const Icon(Icons.photo),
                title: const Text('写真'),
                onTap: () {},
              ),
              ListTile(
                  leading: const Icon(Icons.camera),
                  title: const Text('カメラ'),
                  onTap: () {}
              ),
            ],
          ),
        );
      });
}
SingleChildScrollView 에서 옵션이 증가하면 스크롤할 수 있도록 합니다.leading 에서 아이콘 부분 선택, title 에서 ListTile 에 표시할 텍스트를 쓰고 있습니다.onTap 그럼 이번은 공란입니다만, 탭시의 움직임을 추가하는 것이 가능합니다.

기사에는 쓰고 있지 않지만 showModalBottomSheet는 then으로 쓰는 방식과 async, await를 사용한 방식이 있는 것 같습니다.

수고하셨습니다.
여기까지 봐 주셔서 감사합니다.

좋은 웹페이지 즐겨찾기