如何將從我的畫廊中選擇的影像或我的顫振應用程式中的相機快照轉換為base64，在我堅持到資料庫之前顯示它

這真的讓我很難受。Api 端點僅接收二進制格式。我可以選擇影像，將其編碼為 base64，然后在持久化到資料庫之前預覽它，但在我將其持久化到發布請求之前，我無法預覽它以查看我選擇的內容，請有人幫我嗎？

這是選擇影像的代碼：

  Widget bottomSheet() {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(16.0), topRight: Radius.circular(16.0)),
      ),
      child: Wrap(
        alignment: WrapAlignment.end,
        crossAxisAlignment: WrapCrossAlignment.end,
        children: [
          ListTile(
            leading: Icon(
              Icons.camera,
              color: Colors.orange,
            ),
            title: Text(
              'Camera',
              style: TextStyle(
                color: Colors.green,
              ),
            ),
            onTap: () {
              Get.back();

              takePhoto(ImageSource.camera);
            },
          ),
          ListTile(
            leading: Icon(
              Icons.image,
              color: Colors.orange,
            ),
            title: Text(
              'Gallery',
              style: TextStyle(
                color: Colors.green,
              ),
            ),
            onTap: () {
              Get.back();
              takePhoto(ImageSource.gallery);

              // profilerController.uploadImage(ImageSource.gallery);
            },
          ),
        ],
      ),
    );
  }

這是轉換影像的代碼：

import 'dart:convert';
import 'dart:typed_data';
import 'package:image_picker/image_picker.dart';

String _imageFile;
Uint8List bytes;
final ImagePicker _picker = ImagePicker();

void takePhoto(ImageSource source) async {
    // ignore: deprecated_member_use
    final pickedFile = await _picker.getImage( source: source );

    //Encodeding the File
    List<int> imageBytes = await pickedFile.readAsBytes();
    print('Avatar: ${imageBytes}');

    _imageFile =  base64Encode(imageBytes);
    if(mounted) {
      setState(() { 
         bytes = Base64Codec().decode(_imageFile);

      });


    }
  }

這是顯示影像的代碼

                  Padding(
                    padding: const EdgeInsets.fromLTRB(30, 0, 30, 0),
                    child: Stack(
                      children: <Widget>[
                        Image(
                          image: _imageFile == null
                              ? AssetImage("assets/images/user2.png")
                              : Image.memory(bytes)

                        ),
                        Positioned(
                          bottom: 1,
                          right: 1,
                          child: Container(
                            height: 40,
                            width: 40,
                            child: InkWell(
                              child: Icon(
                                Icons.add_a_photo,
                                color: Colors.white,
                              ),
                              onTap: () {
                                {
                                  showModalBottomSheet(
                                    context: context,
                                    builder: ((builder) => bottomSheet()),
                                  );
                                }
                              },
                            ),
                            decoration: BoxDecoration(
                              color: Colors.orange[500],
                              borderRadius:
                                  BorderRadius.all(Radius.circular(20)),
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                

選擇后我不斷得到：

Another exception was thrown: type 'Image' is not a subtype of type 'ImageProvider<Object>'[1]][1]

任何幫助或建議將不勝感激。謝謝

應用程式界面

uj5u.com熱心網友回復：

只需將影像的 ImageProvider 獲取為：

     Image(
                          image: _imageFile == null
                              ? AssetImage("assets/images/user2.png")
                              : Image.memory(bytes).image

                        ),

標籤：扑 镖 颤振布局 颤振依赖

上一篇：可滾動列和ListView.builder

下一篇：當另一個被按下RaisedButton時鎖定一個RaisedButton