Zenn
📸

flutter camera

2024/08/12に公開
Flutter
Dart
tech

📸カメラパッケージを使ってみた

cameraというパッケージを使ってみた。使ってみたと言っても公式のコードをそのまま使ってみただけ。写真撮影はできなかったです。もう少し改良が必要。

add package:

flutter pub add camera

YouTubeの動画を参考に、iOS, Androidの設定をしていきましょう。
https://www.youtube.com/watch?v=g0JoDZmzlEk

iOS
Add two rows to the ios/Runner/Info.plist:

one with the key Privacy - Camera Usage Description and a usage description.
and one with the key Privacy - Microphone Usage Description and a usage description.
If editing Info.plist as text, add:

<key>NSCameraUsageDescription</key>
<string>your usage description here</string>
<key>NSMicrophoneUsageDescription</key>
<string>your usage description here</string>

Android
Change the minimum Android sdk version to 21 (or higher) in your android/app/build.gradle file.

minSdkVersion 21

CameraControllerの設定ができれば、カメラは使えます。実機でないと試せないかとやってみましたが、撮影するボタンがない罠があった😅
ちょっと機能追加が必要みたいすね。image_pickerだと、カメラ機能ついていたような？？？

example

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

late List<CameraDescription> _cameras;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  _cameras = await availableCameras();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  late CameraController controller;

  @override
  void initState() {
    super.initState();
    controller = CameraController(_cameras[0], ResolutionPreset.max);
    controller.initialize().then((_) {
      if (!mounted) {
        return;
      }
      setState(() {});
    }).catchError((Object e) {
      if (e is CameraException) {
        switch (e.code) {
          case 'CameraAccessDenied':
            // Handle access errors here.
           
          default:
            // Handle other errors here.
            
        }
      }
    });
  }

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

  @override
  Widget build(BuildContext context) {
    if (!controller.value.isInitialized) {
      return Container();
    }
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: CameraPreview(
        controller
        ),
    );
  }
}

感想

カメラのプレビューを試すぐらいのサンプルのようですね。もし何かカメラアプリを作りたい人がいたらこちらの記事を参考にした方が良いと思われます。

https://flutter.salon/plugin/camera/

Discussion