반응형
import 'package:flutter/material.dart';
void main() {
runApp(App());
}
class App extends StatelessWidget {
const App({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(primarySwatch: Colors.blue), home: Page());
}
}
class Page extends StatelessWidget {
const Page({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Buttons')),
body: Center(
child:
Column(mainAxisAlignment: MainAxisAlignment.center, children: [
TextButton(
onPressed: () {
//print('text button..');
},
onLongPress: () {
print('text button..');
},
child: Text('Text Button', style: TextStyle(fontSize: 20)),
style: TextButton.styleFrom(primary: Colors.red
// backgroundColor: Colors.blue
)),
ElevatedButton(
onPressed: () {
print('elevated button..');
},
child: Text('Elevated Button'),
style: ElevatedButton.styleFrom(
primary: Colors.orangeAccent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)),
elevation: 0.0)),
ButtonBar(
alignment: MainAxisAlignment.center,
buttonPadding: EdgeInsets.all(20.0),
children: [
OutlinedButton(
onPressed: () {
print('outlined button..');
},
child: Text('Outlined Button'),
style: OutlinedButton.styleFrom(
primary: Colors.green,
side: BorderSide(color: Colors.black87, width: 2.0),
)),
TextButton.icon(
onPressed: null,
icon: Icon(Icons.home, size: 30.0, color: Colors.black87),
label: Text('Go to home'),
style: TextButton.styleFrom(
onSurface: Colors.pink,
primary: Colors.purple,
minimumSize: Size(200, 50)))
],
)
])));
}
}
1. TextButton
2. ElevatedButton
3. OutlinedButton
*아이콘 있는 버튼을 만드려면?
TextButton.icon()
ElevatedButton.icon()
OutlinedButton.icon()
*버튼 그룹으로 만드려면?
ButtonBar(
children: [..buttons]
)
반응형
': IT > Flutter' 카테고리의 다른 글
Final & Const 변수 (0) | 2022.05.21 |
---|---|
Focus (0) | 2022.05.21 |
Collection and Generic (0) | 2022.03.03 |
Navigator.pushNamed와 routes로 페이지 이동 (0) | 2022.03.01 |
Widget (0) | 2022.02.12 |