首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使用Image.memory()或MemoryImage() flutter缓存内存图像?

如何使用Image.memory()或MemoryImage() flutter缓存内存图像?
EN

Stack Overflow用户
提问于 2021-06-14 08:53:32
回答 1查看 632关注 0票数 0

如何使用Image.memory()MemoryImage() flutter缓存内存图像?

我有一个数据列表,但图像类型是字节。我在Gridview.builder中使用的是Image.memory()MemoryImage(),但当分页(新数据即将到来)或滚动时,它每次重新渲染网格示例时都会闪烁。

感谢你的帮助?

代码:

代码语言:javascript
运行
复制
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,需要在网格视图中显示为图像。但问题是数据更新或滚动时会闪烁

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-06-14 17:31:09

最终找到了解决方案,我只需自定义Image Provider来缓存Image with bytes类型。以下是代码

https://gist.github.com/darmawan01/9be266df44594ea59f07032e325ffa3b

也许还有另一种方法,你们想要与任何阅读这篇文章的人分享。我会很感激的。

希望这能对?有所帮助

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/67963713

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档