可点击图像的颤振列表
flutter list of clickable images
我有一个很好的列表视图,可以使用前导图像、标题和可点击的。我想尝试让它只是一个图像列表,上面有文字。我看过 gridview,但实际上每行只需要一张图片。这是我的列表视图代码。这可以更改还是我需要重写它才能使其正常工作。
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new RefreshIndicator(
child: new ListView.builder(
itemBuilder: _itemBuilder,
itemCount: mylist.length,
),
onRefresh: _onRefresh,
));
}
Widget _itemBuilder (BuildContext context, int index) {
Specialties spec = getSpec(index);
return new SpecialtyWidget(spec: spec,);
}
Specialties getSpec(int index) {
return new Specialties(mylist[index]['id'], mylist[index]['name'], mylist[index]['details'], new Photo('lib/images/'+mylist[index]['image'], mylist[index]['name'], mylist[index]['name']));
//return new Specialties.fromMap(mylist[index]);
}
class SpecialtyWidget extends StatefulWidget {
SpecialtyWidget({Key key, this.spec}) : super(key: key);
final Specialties spec;
@override
_SpecialtyWidgetState createState() => new _SpecialtyWidgetState();
}
class _SpecialtyWidgetState extends State<SpecialtyWidget> {
@override
Widget build(BuildContext context) {
return new ListTile(
leading: new Image.asset(widget.spec.pic.assetName),
//title: new Text(widget.spec.name),
onTap: _onTap,
);
}
void _onTap() {
Route route = new MaterialPageRoute(
settings: new RouteSettings(name: "/specs/spec"),
builder: (BuildContext context) => new SpecPage(spec: widget.spec),
);
Navigator.of(context).push(route);
}
}
如果它不适用于列表视图,任何指导都会有所帮助。
提前致谢
我很难理解你的问题,但听起来你希望列表中的条目使用与 ListTile
提供的布局不同的布局。
您可以使用 Stack
to put text on top of your images (compositing them together) or a Column
if you want to put text vertically above your images. You can also use other Flutter layout widgets 来确保文本出现在正确的位置。
我有一个很好的列表视图,可以使用前导图像、标题和可点击的。我想尝试让它只是一个图像列表,上面有文字。我看过 gridview,但实际上每行只需要一张图片。这是我的列表视图代码。这可以更改还是我需要重写它才能使其正常工作。
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new RefreshIndicator(
child: new ListView.builder(
itemBuilder: _itemBuilder,
itemCount: mylist.length,
),
onRefresh: _onRefresh,
));
}
Widget _itemBuilder (BuildContext context, int index) {
Specialties spec = getSpec(index);
return new SpecialtyWidget(spec: spec,);
}
Specialties getSpec(int index) {
return new Specialties(mylist[index]['id'], mylist[index]['name'], mylist[index]['details'], new Photo('lib/images/'+mylist[index]['image'], mylist[index]['name'], mylist[index]['name']));
//return new Specialties.fromMap(mylist[index]);
}
class SpecialtyWidget extends StatefulWidget {
SpecialtyWidget({Key key, this.spec}) : super(key: key);
final Specialties spec;
@override
_SpecialtyWidgetState createState() => new _SpecialtyWidgetState();
}
class _SpecialtyWidgetState extends State<SpecialtyWidget> {
@override
Widget build(BuildContext context) {
return new ListTile(
leading: new Image.asset(widget.spec.pic.assetName),
//title: new Text(widget.spec.name),
onTap: _onTap,
);
}
void _onTap() {
Route route = new MaterialPageRoute(
settings: new RouteSettings(name: "/specs/spec"),
builder: (BuildContext context) => new SpecPage(spec: widget.spec),
);
Navigator.of(context).push(route);
}
}
如果它不适用于列表视图,任何指导都会有所帮助。
提前致谢
我很难理解你的问题,但听起来你希望列表中的条目使用与 ListTile
提供的布局不同的布局。
您可以使用 Stack
to put text on top of your images (compositing them together) or a Column
if you want to put text vertically above your images. You can also use other Flutter layout widgets 来确保文本出现在正确的位置。