Flutterで生成した画面をFirebaseに画像として登録

class _PaintPageState extends State<PaintPage> {
  // keyを生成
  static GlobalKey globalkey = new GlobalKey();
 // コントローラ
  PaintController _controller = PaintController();

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      <途中省略>
      /*
       * body
       */
      body: RepaintBoundary(
        key: globalkey,
        child: Painter(
          paintController: _controller,
        ),
      ),
      floatingActionButton: Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          // 画像追加ボタン
          FloatingActionButton(
            // 画像追加用ボタンをタップしたときの処理
            onPressed: () => saveFireBase(),
            child: Icon(Icons.add),
          ),
        ],
      ),
    );
  }

  void saveFireBase() async {
    // スクリーンショットを撮る
    RenderRepaintBoundary boundary = 
           globalkey.currentContext!.findRenderObject()! as RenderRepaintBoundary;
    ui.Image image = await boundary!.toImage();
    ByteData? byteData = await image.toByteData(format: ui.ImageByteFormat.png);
    Uint8List pngBytes = byteData!.buffer.asUint8List();

    final User user = FirebaseAuth.instance.currentUser!;
    final PhotoRepository repository = PhotoRepository(user);
    // データをCloud Firestoreに保存
    // ファイル名をランダムに生成
    const charset = '0123456789ABCDEFGHIJKLMNOPQRSTUVXYZabcdefghijklmnopqrstuvwxyz-._';
    int   length  = 32;
    final random = Random.secure();
    final randomStr =  List.generate(length, (_) => charset[random.nextInt(charset.length)]).join();

    // Firebase Storageに追加
    final TaskSnapshot task = await FirebaseStorage.instance
        .ref()
        .child('users/${user.uid}/photos/${randomStr}.png')
        .putData(data);
  }
}

bodyでRepaintBoundaryの型で定義します。
keyとして、GlobalKey()で定義した値をセットします。

後は、saveFireBaseの中に記載している様に、
RenderRepaintBoundary型でオブジェクトを取得して、Firebase登録用のfunctionを呼び出すのみ

コメントする