我想在图库/相机中的图像上添加简单图像。行为应该是这样。
打开应用程序,选择照片或使用浮动按钮制作一张照片,然后显示图像,然后将我们的徽标放在左下角。现在一切正常。
然后,我想将两个图像都保存在一个图像中,但是我不知道如何调用此过程或如何实现它。
import 'package:share/share.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Image Picker Demo', home: MyHomePage(title: 'Image Picker Example'), ); } } class MyHomePage extends StatefulWidget { MyHomePage({Key key, this.title}) : super(key: key); final String title; @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { File _imageFile; dynamic _pickImageError; String _retrieveDataError; void _onImageButtonPressed(ImageSource source) async { try { _imageFile = await ImagePicker.pickImage(source: source); } catch (e) { _pickImageError = e; } setState(() {}); } Widget _previewImage() { final Text retrieveError = _getRetrieveErrorWidget(); if (retrieveError != null) { return retrieveError; } if (_imageFile != null) { print('La imagen ha sido puesta en la pantalla?'); return Image.file(_imageFile); } else if (_pickImageError != null) { return Text( 'Pick image error: $_pickImageError', textAlign: TextAlign.center, ); } else { return const Text( 'You have not yet picked an image.', textAlign: TextAlign.center, ); } } Future<void> retrieveLostData() async { final LostDataResponse response = await ImagePicker.retrieveLostData(); if (response.isEmpty) { return; } if (response.file != null) { setState(() { _imageFile = response.file; }); } else { _retrieveDataError = response.exception.code; } } @override Widget build(BuildContext context) { return Scaffold( body: SafeArea( child: Center( child: Stack(children: <Widget>[ Container( color: Colors.amber, child: Platform.isAndroid ? FutureBuilder<void>( future: retrieveLostData(), builder: (BuildContext context, AsyncSnapshot<void> snapshot) { switch (snapshot.connectionState) { case ConnectionState.none: case ConnectionState.waiting: return const Text( 'You have not yet picked an image.', textAlign: TextAlign.center, ); case ConnectionState.done: return _previewImage(); default: if (snapshot.hasError) { return Text( 'Pick image/video error: ${snapshot.error}}', textAlign: TextAlign.center, ); } else { return const Text( 'You have not yet picked an image.', textAlign: TextAlign.center, ); } } }, ) : (_previewImage())), // Positioned( bottom: 16, left: 16, width: 100, height: 100, child: Image.network( 'http://father-home.ru/wp-content/uploads/2018/05/cropped-logo8.png')) ]))), floatingActionButton: Column( mainAxisAlignment: MainAxisAlignment.end, children: <Widget>[ FloatingActionButton( onPressed: () { _onImageButtonPressed(ImageSource.gallery); }, heroTag: 'image0', tooltip: 'Pick Image from gallery', child: const Icon(Icons.photo_library), ), Padding( padding: const EdgeInsets.only(top: 16.0), child: FloatingActionButton( onPressed: () { _onImageButtonPressed(ImageSource.camera); }, heroTag: 'image1', tooltip: 'Take a Photo', child: const Icon(Icons.camera_alt), ), ), Padding( padding: const EdgeInsets.only(top: 16.0), child: FloatingActionButton( onPressed: () { _onShare(); }, tooltip: 'Share', child: const Icon(Icons.share), ), ), ], ), ); } void _onShare(){ //TODO: save the two images into one and share } Text _getRetrieveErrorWidget() { if (_retrieveDataError != null) { final Text result = Text(_retrieveDataError); _retrieveDataError = null; return result; } return null; } }
具有此代码的小部件看起来像:
我想在图库/相机中的图像上添加简单图像。行为应该是这样。打开应用程序,选择照片或使用浮动按钮制作一张照片,然后显示图像并显示...
您可以使用RepaintBoundary
我相信您将需要使用位图。