overview.
- TextEditingController 란?
- 예제
<> 문서
https://api.flutter.dev/flutter/widgets/TextEditingController-class.html
1. TextEditingController 란?
TextEditingController는 TextField 위젯에서 사용자 입력을 관리하는데 사용되는 클래스입니다. 이를 통해 TextField에서 사용자가 입력한 값에 접근하거나, TextField의 값을 변경하거나, TextField를 초기화하는 등 다양한 작업을 수행할 수 있습니다.
- 입력값 접근:
- TextEditingController는 _controller.text 프로퍼티를 통해 현재 TextField에 입력된 값을 가져올 수 있습니다. 사용자가 **TextField*에 입력한 내용을 가져와서 로직에 활용하거나 다른 곳에 표시할 수 있습니다.
- 입력값 변경:
- _controller.text = 'newValue'와 같이 TextEditingController의 text 프로퍼티를 통해 TextField의 값을 프로그래밍 방식으로 변경할 수 있습니다.
- 입력값 초기화:
- TextEditingController의 clear 메서드를 사용하여 TextField의 내용을 쉽게 지울 수 있습니다. 이 기능은 사용자가 입력을 완료한 후 입력 필드를 초기화할 때 유용합니다.
- 입력 변경 감지:
- TextEditingController*에 리스너를 추가하여 TextField의 값이 변경될 때마다 알림을 받을 수 있습니다. 이를 통해 입력값이 변경될 때 특정 동작을 수행하도록 설정할 수 있습니다.
2. 예제
import 'package:flutter/material.dart';
// View 클래스
class TodoListView extends StatefulWidget {
const TodoListView({super.key});
@override
State<TodoListView> createState() => _TodoListViewState();
} // end of class
class _TodoListViewState extends State<TodoListView> {
final TextEditingController _controller = TextEditingController();
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(15.0),
child: Column(
children: [
TextField(
controller: _controller, // 컨트롤러 연결
decoration: InputDecoration(
hintText: "Enter todo item..",
suffix: IconButton(
icon: Icon(Icons.add),
onPressed: () {
setState(() {
// 화면을 재 빌드 - build() 재 호출
_controller.clear();
});
},
)),
),
],
),
);
}
}
'flutter & dart' 카테고리의 다른 글
flutter & dart - RichText (0) | 2024.04.01 |
---|---|
flutter & dart - ListView.builder (0) | 2024.03.21 |
flutter & dart - Flutter MVVM 패턴 (0) | 2024.03.19 |
flutter & dart - dart:convert 파싱 (parsing) (0) | 2024.03.15 |
flutter & dart - dart 비동기 프로그래밍 , Future 타입 (0) | 2024.03.14 |