728x90
플러터에서 제공하는 Camera 라이브러리를 사용하여 앱 내에서 핸드폰의 카메라를 볼 수 있다.
1. 플러터 제공 Camera 라이브러리 의존성 추가
dependencies:
camera: ^0.10.5+9- 해당 코드 추가 후 flutter pub get 실행
2. main 함수 내에 카메라를 가져오는 코드 작성
void main() async{
WidgetsFlutterBinding.ensureInitialized();
final cameras = await availableCameras(); // 현재 사용 가능한 카메라 목록을 가져옴.
final firstCamera = cameras.first; // 핸드폰 기기의 후면카메라를 선택
runApp(
MaterialApp(
home: MyApp(
camera: firstCamera, // 이 곳에서 만든 카메라를 앱 내에 state로 전송
),
)
);
}- main 함수 내에 앱을 실행하기 전에 카메라를 가져오는 코드를 작성한다.
3. 카메라를 표출할 위젯에서 initState 함수 내에 카메라 컨트롤러 설정
class CameraScreen extends StatefulWidget {
const CameraScreen({super.key, required this.camera});
final CameraDescription camera; // main 함수에서 만든 카메라를 전달 받음
@override
State<CameraScreen> createState() => _CameraScreenState();
}
class _CameraScreenState extends State<CameraScreen> {
late CameraController _controller;
late Future<void> _initializeControllerFuture;
@override
void initState() {
super.initState();
_controller = CameraController( // 전달받은 카메라를 이용하여 카메라 컨트롤러 설정
widget.camera, // 설정할 카메라 지정
ResolutionPreset.high, // 카메라 화면의 화질 설정
);
_initializeControllerFuture = _controller.initialize(); // 지정해준 설정으로 초기화
}- main 함수에서 만든 카메라를 state로 전달 받아 CameraController를 이용하여 카메라에 대한 설정을 한다.
4. 설정된 카메라의 화면을 최종적으로 앱 내 표출
@override
Widget build(BuildContext context) {
return FutureBuilder<void>(
future: _initializeControllerFuture, // 카메라 설정 초기화 진행 (비동기)
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
// 카메라 설정 초기화가 완료가 되었는지 판단
return CameraPreview(_controller); // 카메라 화면 표출
} else {
return Center(child: CircularProgressIndicator()); // 로딩화면 표출
}
},
),
);
}
}- 앞서 카메라 설정을 초기화 해주는 부분 _initializeControllerFuture = _controller.initialize(); 이 부분이
비동기식으로 작동하여 Future를 반환하기 때문에 FutureBuilder를 이용하여 동기식으로 변환하여 표출한다.
728x90
'앱개발 > Flutter' 카테고리의 다른 글
| [Flutter] Flutter 웹 소켓 클라이언트 구축 (0) | 2024.02.05 |
|---|---|
| [Flutter] WebView로 앱 내에 웹사이트 출력 (0) | 2024.02.01 |
| [Flutter] 플러터에 대해서 간단히 알아보자! (1) | 2024.01.15 |
