如何使用Image.memory()
或MemoryImage()
flutter缓存内存图像?
我有一个数据列表,但图像类型是字节。我在Gridview.builder
中使用的是Image.memory()
或MemoryImage()
,但当分页(新数据即将到来)或滚动时,它每次重新渲染网格示例时都会闪烁。
感谢你的帮助?
代码:
StreamBuilder<List<Datum>>(
stream: _provider.promotionsStream,
builder: (BuildContext context, AsyncSnapshot<List<Datum>> snapshot) {
return Padding(
padding: EdgeInsets.only(top: 16.0),
child: NotificationListener<ScrollEndNotification>(
onNotification: (scrollEnd) {
if (scrollEnd.metrics.pixels >=
scrollEnd.metrics.maxScrollExtent * .45) {
_provider.nextPage();
}
return true;
},
child: SingleChildScrollView(
child: Column(
children: [
GridView.builder(
shrinkWrap: true,
physics: BouncingScrollPhysics(),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
),
itemCount:
_provider.dataLentgh > 16 ? _provider.dataLentgh : 18,
itemBuilder: (ctx, idx) {
Datum? _data = snapshot.data == null
? null
: _provider.dataLentgh > idx
? snapshot.data![idx]
: null;
return AspectRatio(
aspectRatio: 1.0,
child: Container(
padding: EdgeInsets.all(2.0),
alignment: Alignment.center,
width: 60,
decoration: BoxDecoration(
color: Colors.white,
border:
Border.all(color: Colors.grey, width: 0.5),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 60,
height: 60,
decoration: BoxDecoration(
image: _data == null
? null
: _data.imageUrl.isEmpty
? null
: DecorationImage(
fit: BoxFit.contain,
image: Image.memory(
Uint8List.fromList(
_data.imageBytes),
).image,
),
color: Colors.transparent,
),
),
],
),
),
);
},
),
],
),
),
),
);
},
),
数据来自字节类型的API,需要在网格视图中显示为图像。但问题是数据更新或滚动时会闪烁
发布于 2021-06-14 17:31:09
最终找到了解决方案,我只需自定义Image Provider来缓存Image with bytes类型。以下是代码
https://gist.github.com/darmawan01/9be266df44594ea59f07032e325ffa3b
也许还有另一种方法,你们想要与任何阅读这篇文章的人分享。我会很感激的。
希望这能对?有所帮助
https://stackoverflow.com/questions/67963713
复制相似问题