Overview.
버튼을 활성화 시키거나 비활성화를 시킬수 있는 AbsorbPointer 를 활용해보자
- AbsorbPointer 란?
0. 문서
https://api.flutter.dev/flutter/widgets/AbsorbPointer-class.html
1. AbsorbPointer 란?
네 말 그대로 터치 이벤트를 제어 할 수 있습니다. 버튼 비활성화나 이럴때 사용할 수 있겠죵?
밑을 보시면 stateful 위젯으로 1번 Elavator 버튼과 2번 Elavator 버튼이 있습니다. 1번 버튼은 AbsorbPointer 가 없고
2번 버튼은 AbsorbPointer 를 감싼 형태를 띄우고 있습니다.
isCheck 를 활용해서 true 와 false 를 지정하여 setState 로 변경이 가능하겠네요!!
처음 2번 버튼을 눌렀을 시 true 값이기 때문에 버튼이 비활성화 되어있지만 1번 버튼 클릭후 2번 버튼을 눌렀을 시 버튼이 눌러지는 효과를 보실 수 있습니다.
바로 코드!! 보고 그냥 넘어가겠습니다.
...
class _Home extends StatefulWidget {
const _Home({super.key});
@override
State<_Home> createState() => _HomeState();
}
class _HomeState extends State<_Home> {
var isCheck = true;
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: Column(
children: [
ElevatedButton(
onPressed: () {
print("1번 안 감싼것");
setState(() {
// 재 빌드
isCheck = false;
});
print("isCheck : $isCheck");
},
child: Text("안녕"),
),
AbsorbPointer(
// true : 버튼 비활성화
// false : 버튼 활성화
absorbing: isCheck, // 실행이 안됨 (setState 활용해야함)
child: ElevatedButton(
onPressed: () {
print("2번 absorbPointer");
},
child: Text("클릭"),
),
),
],
),
),
);
}
}
'flutter & dart' 카테고리의 다른 글
flutter & dart - hero animation (0) | 2024.04.01 |
---|---|
flutter & dart - alert 창과 같은 Dialog (0) | 2024.04.01 |
flutter & dart - 도형을 만드는 ClipRRect , ClipOval , ClipPath (0) | 2024.04.01 |
flutter & dart - ListTile 위젯 (0) | 2024.04.01 |
flutter & dart - RichText (0) | 2024.04.01 |