【Flutter】" NoSuchMethodError ", " The getter 'length' was called on null " を解決したいです

Question

前提・実現したいこと

Flutterでカメラアプリを作っているFlutter初心者の者です。
「カメラを起動」を押すと文字通りカメラが起動する機能を実装中にエラーメッセージが発生しました。
![]

こちらに記載されているソースコードを参考にさせて頂きました。
https://github.com/aftercider/camera-app-2018/blob/master/lib/main.dart

発生している問題・エラーメッセージ

======== Exception caught by widgets library =======================================================
The following NoSuchMethodError was thrown building CameraWidget(dirty, state: _CameraWidgetState#ae112):
The getter 'length' was called on null.
Receiver: null
Tried calling: length

main.dart

import 'dart:async';
import 'dart:io';

import 'package:flutter/material.dart';
import 'package:camera/camera.dart';
import 'package:path_provider/path_provider.dart';
import 'package:image_picker_saver/image_picker_saver.dart';
import 'package:simple_permissions/simple_permissions.dart';
import 'camera.dart';


void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build (BuildContext context){
    return MaterialApp(
        title: 'Sort cam',
        theme: ThemeData(
          primarySwatch:Colors.blue,
        ),
        home: MyHomePage()
    );
  }
}
class MyHomePage extends StatelessWidget{
  Widget build(BuildContext context){
    return Scaffold(
      appBar:AppBar(
          title: const Text('Sort cam'),
          actions: <Widget>[
            IconButton(icon: Icon(Icons.settings),
            onPressed:(){},
          )
          ]
      ),
      body: Center(
        child: RaisedButton(onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => CameraApp()),
          );
        }, child: Text('カメラを起動'))
      ),
    );
  }
}

該当のソースコード(camera.dart)

import 'dart:async'; // 非同期処理(async/await)
import 'dart:io'; // ファイルの入出力

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

List<CameraDescription> cameras; // 使用できるカメラのリスト

// ここから始まる
Future<void> main() async {
  cameras = await availableCameras();
  runApp(CameraApp());
}

// 親玉のApp
class CameraApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CameraWidget(),
    );
  }
}

// 親玉の中身
class CameraWidget extends StatefulWidget {
  @override
  _CameraWidgetState createState() {
    return _CameraWidgetState();
  }
}

// 実際はこれがやることやる
class _CameraWidgetState extends State<CameraWidget> {
  CameraController controller;
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  String timestamp() =>
      DateTime.now().millisecondsSinceEpoch.toString(); // ファイル名にはタイムスタンプ入れる。
  void showInSnackBar(String message) => _scaffoldKey.currentState
      .showSnackBar(SnackBar(content: Text(message))); // SnackBarでメッセージ表示

  @override
  Widget build(BuildContext context) {
    Scaffold sc = Scaffold(
      key: _scaffoldKey,
      body: Column(
        children: <Widget>[
          Expanded(
            child: Container(
              child: Padding(
                padding: const EdgeInsets.all(1.0),
                child: Center(
                  child: _cameraPreviewWidget(), // カメラのプレビューを表示するWidget
                ),
              ),
            ),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
              IconButton(
                // カメラの撮影ボタン
                icon: const Icon(Icons.camera_alt),
                onPressed: controller != null && controller.value.isInitialized
                    ? onTakePictureButtonPressed // 撮影ボタンを押された時にコールバックされる関数
                    : null,
              ),
            ],
          )
        ],
      ),
    );

    // カメラのセットアップ。セットアップが終わったらもう一回buildが走るので、
    // controllerがnullかどうかで処理実施有無を判定。
    if (controller == null) {
      if (cameras.length == 0) {
        throw Exception("使用できるカメラがありません");
      }
      setUpCamera(cameras[0]);
    }
    return sc;
  }

  /// カメラプレビューを表示するWidget
  Widget _cameraPreviewWidget() {
    if (controller == null || !controller.value.isInitialized) {
      // カメラの準備ができるまではテキストを表示
      return const Text('Tap a camera');
    } else {
      // 準備ができたらプレビュー表示
      return AspectRatio(
        aspectRatio: controller.value.aspectRatio,
        child: CameraPreview(controller),
      );
    }
  }

  // カメラを準備する
  void setUpCamera(CameraDescription cameraDescription) async {
    if (controller != null) {
      await controller.dispose();
    }
    controller = CameraController(cameraDescription, ResolutionPreset.high);

    // カメラの情報が更新されたら呼ばれるリスナー設定
    controller.addListener(() {
      if (mounted) setState(() {}); // 準備終わったらbuildし直す。
      if (controller.value.hasError) {
        showInSnackBar('Camera error ${controller.value.errorDescription}');
      }
    });

    await controller.initialize();

    // パーミッションの確認・要求
    if (Platform.isAndroid &&
        !await SimplePermissions.checkPermission(Permission.WriteExternalStorage)) {
      SimplePermissions.requestPermission(Permission.WriteExternalStorage);
    } else if (Platform.isIOS &&
        !await SimplePermissions.checkPermission(Permission.PhotoLibrary)) {
      SimplePermissions.requestPermission(Permission.PhotoLibrary);
    }

    if (mounted) {
      setState(() {});
    }
  }

  // 撮影ボタンが押されたら撮影して、画像を保存する
  void onTakePictureButtonPressed() {
    takePicture().then((String filePath) {
      if (mounted) {
        setState(() {});
        if (filePath != null) showInSnackBar('Picture saved to $filePath');
      }
    });
  }

  // 画像撮影・保存処理
  Future<String> takePicture() async {
    if (!controller.value.isInitialized) {
      return null;
    }

    Directory dir;
    if (Platform.isAndroid) {
      dir = await getExternalStorageDirectory(); // 外部ストレージに保存
    } else if (Platform.isIOS) {
      dir = await getTemporaryDirectory(); // 一時ディレクトリに保存
    } else {
      return null;
    }

    final String dirPath = '${dir.path}/Pictures/flutter_test';
    await Directory(dirPath).create(recursive: true);
    String filePath = '$dirPath/${timestamp()}.jpg';

    if (controller.value.isTakingPicture) {
      return null;
    }

    await controller.takePicture(filePath);

    // filePathに保存されたデータをiOSならPhotoLibrary領域にコピーする
    if (Platform.isIOS) {
      String tmpPath = filePath;
      var savedFile = File.fromUri(Uri.file(tmpPath));
      filePath = await ImagePickerSaver.saveFile(
          fileData: savedFile.readAsBytesSync());
    }

    return filePath;
  }
}

試したこと

解決方法として"Get Upgrade"をしていなかったのでしてみたりしましたが、状況は変わりませんでした。

Comments

[hoshi-takanori]

cameras が null ってことですよね。Flutter よく分かってませんが、main.dart と camera.dart の両方に main 函数があるようですが、camera.dart の main　は呼ばれてますか？

[cocona15531]

コメントありがとうございます。恐らく呼ばれていると思います。

Answer 1

errorメッセージ自体は、lengthが存在しないのに呼ばれているというエラーメッセージなので、

  if (controller == null) {
      if (cameras.length == 0) {
        throw Exception("使用できるカメラがありません");
      }
      setUpCamera(cameras[0]);
    }
    return sc;

のcameras.length == 0の部分を省くか別の書き方をして試してみるのはどうでしょう。

Answer 2

参考にされたafterciderさんのcamera-app-2018のQiita記事を見てみましたが、2018年の記事でありflutterやlibraryの情報が古そうな印象を受けました。
まずは2020年以降でcamera appを作っている方の記事を参考にされると良いのかなと思います。
例：
https://tech-blog.rakus.co.jp/entry/20200929/flutter