//네비게이션
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(initialRoute: '/', routes: {
'/': (context) => const PageMain(),
'pg': (context) => const PageOne(),
'pr': (context) => const PageTwo(),
});
}
}
Navigator.pushNamed(context, 'pg');
appBar: AppBar(
leading: IconButton(onPressed: () {}, icon: const Icon(Icons.menu)), //햄버거 모양
debugShowCheckedModeBanner: false, //디버그 모드 안보이게 하기
title: const Text('Page'),
//오른쪽 부분
actions: [
IconButton(onPressed: () {Navigator.pushNamed(context, 'pg');},icon: const Icon(Icons.mail)), // 아이콘 추가
IconButton(
onPressed: () {
// 네비게이션 이동
Navigator.pushNamed(context, 'pr');
// Navigator.push(context, MaterialPageRoute(builder: (context) {
// return const ScreenOne();
// }));
},
icon: const Icon(Icons.mail_outline_outlined)),
],
),
// 버튼을 이용한 네비게이션
ElevatedButton(
style: ButtonStyle(backgroundColor: MaterialStateProperty.all(Colors.red)), //버튼 색상
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text('ElevatedButton is clicked.'),duration: Duration(seconds: 1),backgroundColor: Colors.red,),);
Navigator.pushNamed(context, 'pg');
}, child: const Text('BtnGreen'), style: ElevatedButton.styleFrom(primary: Colors.green),)
// 제스쳐
GestureDetector
//버튼 종류
children: [
TextButton(
onLongPress: () {
print('b');
},
onPressed: () {
print('a');
},
child: const Text(
'TextButton',
style: TextStyle(fontSize: 20),
),
style: TextButton.styleFrom(primary: Colors.red),
),
ElevatedButton(
onPressed: () {
//---
},
child: const Text('ElevatedButton'),
style: ElevatedButton.styleFrom(
primary: Colors.orangeAccent,
),
),
ElevatedButton(
onPressed: () {
//---
},
child: const Text('ElevatedButton'),
style: ElevatedButton.styleFrom(
primary: Colors.orangeAccent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10))),
),
OutlinedButton(
onPressed: () {
//---
},
child: const Text('OutlinedButton'),
style: OutlinedButton.styleFrom(
primary: Colors.green,
side: const BorderSide(color: Colors.black, width: 2)),
),
TextButton.icon(
onPressed: () {
//--
},
icon: const Icon(
Icons.home,
size: 30,
color: Colors.black87,
),
label: const Text('TextButton.icon'),
style: TextButton.styleFrom(
primary: Colors.purple,
),
),
ElevatedButton.icon(
onPressed: () {
//--
},
icon: const Icon(
Icons.home,
size: 20,
),
label: const Text('ElevatedButton.icon'),
style: ElevatedButton.styleFrom(
// minimumSize: const Size(200, 50) 고정된 버튼 사이즈
primary: Colors.black,
minimumSize: const Size(200, 50)),
),
OutlinedButton.icon(
onPressed: () {},
icon: Icon(Icons.home),
label: Text('OutlinedButton.icon'),
style: OutlinedButton.styleFrom(
primary: Colors.black,
side: const BorderSide(color: Colors.black87, width: 2)),
),
ButtonBar(
alignment: MainAxisAlignment.center,
buttonPadding: const EdgeInsets.fromLTRB(10, 10, 10, 10),
children: [
TextButton(
onPressed: () {
//--
},
child: const Text('BBar TButton'),
style: TextButton.styleFrom(minimumSize: const Size(50, 50)),
),
ElevatedButton(
onPressed: () {
//--
},
child: const Text('BBar EButton'),
style: TextButton.styleFrom(minimumSize: const Size(50, 50)),
)
],
)
],
'복붙 노트 > 다트,플러터' 카테고리의 다른 글
| 다트 플러터 웹 서버 운영하기 클라우드플레어 편 (0) | 2022.06.06 |
|---|---|
| 플러터 스플래쉬 스크린 첫화면 인트로 화면 셋팅해보기 (0) | 2022.05.16 |
| 플러터 오늘 배운 수업 정리 (0) | 2022.05.10 |
| 플러터 공부한거 정리 노트 (0) | 2022.05.02 |
| 플로터 공부하기전 맥에서 설치 하는 방법 (0) | 2022.04.20 |
댓글0