type 'List<Widget>' is not a subtype of type

来源:6-16 拍照APP开发-图片获取与图片展示【实战尝鲜】

慕数据4337654

2020-04-22

解决了,原来是引用那写错了,应该直接调用函数就行了。

图片描述
代码照着你视频搞的。
import ‘dart:io’;

import ‘package:flutter/material.dart’;
import ‘package:flutter_color_plugin/flutter_color_plugin.dart’;
import ‘package:image_picker/image_picker.dart’;

class PhotoApp extends StatefulWidget {
// This widget is the root of your application.
@override
State createState() => _PhotoApp();
}

class _PhotoApp extends State {
List _images = [];

Future getImage(bool isTakePhoto) async {
var image = await ImagePicker.pickImage(
source: isTakePhoto ? ImageSource.camera : ImageSource.gallery);
Navigator.pop(context);
setState(() {
_images.add(image);
});
}

TextStyle textStyle = TextStyle(fontSize: 20);

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(‘Image Picker Example’),
),
body: Center(
child: Wrap(
spacing: 5,
runSpacing: 5,
children: [_genImages()],
)),
floatingActionButton: FloatingActionButton(
onPressed: _PickImage,
tooltip: ‘Pick Image’,
child: Icon(Icons.add_a_photo),
),
);
}

_PickImage() {
showModalBottomSheet(
context: context,
builder: (context) => Container(
height: 120,
child: Column(
children: [
_item(‘拍照’, true),
_item(‘从相册选择’, false),
],
),
));
}

_item(String title, bool isTakePhoto) {
return GestureDetector(
child: ListTile(
leading: Icon(isTakePhoto ? Icons.camera_alt : Icons.photo),
title: Text(title),
onTap: () => getImage(isTakePhoto),
));
}

_genImages() {
return _images.map((file) {
return Stack(
children: [
ClipRRect(
//圆角效果
borderRadius: BorderRadius.circular(5),
child: Image.file(file, width: 120,height: 90,fit: BoxFit.fill,),//BoxFit.fill填充满容器
),
Positioned(
right: 5,
top: 5,
child: GestureDetector(
onTap: (){
setState(() {
_images.remove(file);
});
},
child: ClipOval(
//圆角删除按钮
child: Container(
padding: EdgeInsets.all(3),
decoration: BoxDecoration(color: Colors.black54),
child: Icon(Icons.close, size: 18,color: Colors.white,),
),
),
),
)
],
);
}).toList();
}
}

写回答

2回答

CrazyCodeBoy

2020-04-23

嗯,好的。

0
1
慕数据4337654
非常感谢!
2020-04-24
共1条回复

昨日转身离开

2021-06-16

_genImages()  方法得到的本身就是一个数组, 例如: [Text('1'),Text('2')], 

所以 children: <Widget>[ _genImages() ] 
这样的写法最终的结果是:children: <Widget>[ [ Text('1'),Text('2') ] ]

而实际运行的话是这样的 children: <Widget>[ Text('1'),Text('2')], 
可以使用数组的扩展运算符...平铺数组的每一项

children: <Widget>[ ..._genImages() ] 就得到了 children: <Widget>[ Text('1'),Text('2')]

PS: ...我是想到JS的ES6数组方法,Dart居然也支持, 查文档没看到有这个方法


正确写法: children: _genImages()


0
0

Flutter从入门到进阶 实战携程网App 一网打尽核心技术

解锁Flutter开发新姿势,,系统掌握Flutter开发核心技术。

4788 学习 · 3270 问题

查看课程