[flutter] 플러터에서의 디바이스 카메라 사용 방법

30 Nov 2023

flutter

이번에는 플러터(Flutter)에서 디바이스의 카메라를 사용하는 방법에 대해 알아보겠습니다. 플러터는 멀티플랫폼 앱 개발 프레임워크로서, iOS와 Android에서 동작하는 앱을 동시에 개발할 수 있습니다.

카메라 패키지 설치

플러터에서는 camera 패키지를 사용하여 디바이스의 카메라에 접근할 수 있습니다. 먼저, pubspec.yaml 파일에 다음과 같이 camera 패키지를 추가해주세요:

dependencies:
  camera: ^0.8.1

프로젝트의 루트 디렉토리에서 터미널을 열고 flutter pub get 명령을 실행하여 패키지를 다운로드 받아주세요.

카메라 접근 권한 설정

Android와 iOS에서는 카메라에 접근할 수 있는 권한을 설정해야 합니다.

Android 설정

AndroidManifest.xml 파일에 다음 권한을 추가해주세요:

<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />

iOS 설정

Info.plist 파일에 다음 키와 값을 추가해주세요:

<key>NSCameraUsageDescription</key>
<string>카메라 사용 권한에 대한 설명</string>

카메라 사용 코드 예시

이제, 다음과 같은 코드를 사용하여 카메라를 사용할 수 있습니다:

import 'package:flutter/material.dart';
import 'package:camera/camera.dart';

void main() async {
  // 사용 가능한 카메라 목록을 가져옵니다.
  WidgetsFlutterBinding.ensureInitialized();
  final cameras = await availableCameras();

  // 첫 번째 카메라를 이용해서 앱을 시작합니다.
  runApp(MyApp(cameras[0]));
}

class MyApp extends StatelessWidget {
  final CameraDescription camera;

  MyApp(this.camera);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '카메라 앱',
      home: CameraScreen(camera),
    );
  }
}

class CameraScreen extends StatefulWidget {
  final CameraDescription camera;

  CameraScreen(this.camera);

  @override
  _CameraScreenState createState() => _CameraScreenState();
}

class _CameraScreenState extends State<CameraScreen> {
  late CameraController _controller;
  late Future<void> _initializeControllerFuture;

  @override
  void initState() {
    super.initState();
    _controller = CameraController(
      widget.camera,
      ResolutionPreset.medium,
    );

    _initializeControllerFuture = _controller.initialize();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('카메라')),
      body: FutureBuilder<void>(
        future: _initializeControllerFuture,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return CameraPreview(_controller);
          } else {
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.camera_alt),
        onPressed: () async {
          try {
            await _initializeControllerFuture;

            final image = await _controller.takePicture();
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => PreviewScreen(imagePath: image.path),
              ),
            );
          } catch (e) {
            print('사진 찍기 오류: $e');
          }
        },
      ),
    );
  }
}

class PreviewScreen extends StatelessWidget {
  final String imagePath;

  PreviewScreen({required this.imagePath});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('미리보기')),
      body: Image.file(File(imagePath)),
    );
  }
}

위 코드는 첫 번째 카메라를 사용하여 카메라 화면을 보여주고, 사용자가 floatingActionButton을 클릭하면 사진을 찍고 미리보기 화면으로 이동합니다.

이제, 플러터에서 디바이스의 카메라를 사용하는 방법을 알아보셨습니다. 이를 기반으로 원하는 기능을 추가하고 앱을 개발해보세요.