flutter - 모달창 띄우기 - dialog

2025-02-10 14:49
19
0
0
0
본문
접기
[ ▼ 작성자 참고 Source ]
import 'package:flutter/material.dart'; void main() { runApp( MaterialApp( home: Suse_App() ) ); } class Suse_App extends StatefulWidget { Suse_App({super.key}); @override StatecreateState() => _Suse_AppState(); } class _Suse_AppState extends State { var a = 1; var name = ['Suse', 'Redhat', 'Ubuntu']; var like = [0,0,0]; @override Widget build(BuildContext context) { return Scaffold( floatingActionButton: FloatingActionButton( onPressed: (){ showDialog(context: context, builder: (context){ return Dialog(child: Text('Hello Wolrd Flutter'),); }); }, ), appBar: AppBar(), body: ListView.builder( itemCount: 3, itemBuilder: (c, i){ return ListTile( leading: Image.asset('assets/images/3.png'), title: Text(name[i]), ); }, ) ); } }
본문
1. 버튼을 클릭하면 다이얼로그 띄우기
다이얼로그를 버튼 클릭 시 띄우려면 FloatingActionButton의 onPressed 속성에 showDialog를 추가합니다.
2. 코드 예제
showDialog 필수 파라미터는 context: 현재 화면의 빌드 컨텍스트, builder: 다이얼로그의 UI를 반환하는 함수 입니다
3. 내용 정리
showDialog 사용 시 context와 builder가 필요하며, 다이얼로그 안에 Dialog 위젯을 사용하여 원하는 UI 구성 가능이 있으며, FloatingActionButton을 클릭하면 다이얼로그가 나타납니다
0
0
로그인 후 추천 또는 비추천하실 수 있습니다.
댓글목록0