[flutter개발 #2] button을 만들어보자

d

---

Flutter 2.0으로 버전업되면서 버튼 종류들이 바뀌었다.

FlatButton => TextButton

OutlineButton => OutlinedButton

RaisedButton => ElevatedButton

 

문법도 기존이랑 바뀌었는데

ElevatedButton를 예시로 들어보겠다.

child: Center(
	child: ElevatedButton(
		onPressed: () {}, #버튼 클릭 시 동작
		style: ElevatedButton.styleFrom( #엘베버튼 스타일
		shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)), # 버튼 라운딩처리
		foregroundColor: Colors.white, # 글자 색상
		backgroundColor: Colors.purple, # 버튼 색상
		minimumSize: const Size(250,50), # 버튼 크기
		),
		child: const Text(
			'asdfasdfasdf', # 버튼 텍스트 내용
			style:TextStyle(fontSize: 17), # 버튼 텍스트 크기
		),
	),
),

 

추가 기능

# 버튼 클릭 시 동작
onPressed: (){
print('cliiiiiiick');
},

# 버튼 길게 누르면 동작
onLongPress: (){
print('Lonnnnnnnnng');
},

# 버튼 비활성화
onpressd: null

 

참고함 : https://velog.io/@meibinlee/Flutter-Buttons-Elevated-Text-Outlined

 

---