flutter - 모달창 띄우기 - dialog

2025-02-10 14:49
497
0
0
0
본문
접기
[ ▼ 작성자 참고 Source ]
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 | import 'package:flutter/material.dart' ; void main() { runApp( MaterialApp( home: Suse_App() ) ); } class Suse_App extends StatefulWidget { Suse_App({super.key}); @override State<suse_app> createState() => _Suse_AppState(); } class _Suse_AppState extends State<suse_app> { 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]), ); }, ) ); } }< /suse_app >< /suse_app > |
본문
1. 버튼을 클릭하면 다이얼로그 띄우기
다이얼로그를 버튼 클릭 시 띄우려면 FloatingActionButton의 onPressed 속성에 showDialog를 추가합니다.
2. 코드 예제
showDialog 필수 파라미터는 context: 현재 화면의 빌드 컨텍스트, builder: 다이얼로그의 UI를 반환하는 함수 입니다
3. 내용 정리
showDialog 사용 시 context와 builder가 필요하며, 다이얼로그 안에 Dialog 위젯을 사용하여 원하는 UI 구성 가능이 있으며, FloatingActionButton을 클릭하면 다이얼로그가 나타납니다
0
0
로그인 후 추천 또는 비추천하실 수 있습니다.
댓글목록0