草庐IT

dart - 如何在旋转木马 View 中添加 fadeinImage

coder 2023-07-23 原文

我有以下代码在轮播中显示网络图像。当我启动我的应用程序时，我在轮播中看到一个空白的白色屏幕。我想改为显示占位符图像。我试图将占位符图像放在 if 子句下，但 if 子句仅在我导航到另一个屏幕并返回轮播屏幕时才显示占位符。我希望在启动我的应用程序时显示占位符。我怎样才能做到这一点？ 

return Container(
  child: FutureBuilder(
      future: getCarouselWidget(),
      builder: (context, AsyncSnapshot snapshot) {
        List<NetworkImage> list = new List<NetworkImage>();
        if (snapshot.connectionState == ConnectionState.waiting || snapshot.connectionState == ConnectionState.active
        ) {
          debugPrint("connection state is " + snapshot.connectionState.toString() );
          return new FadeInImage(
            height: 200.0, // Change it to your need
            width: 300.0, // Change it to your need
            fit: BoxFit.cover,
            placeholder: new AssetImage("assets/placeholder.jpg"),
            image: new AssetImage("assets/placeholder.jpg"),
          );
        } else if(snapshot.connectionState == ConnectionState.done) {
          debugPrint("connection state is inside else" + snapshot.connectionState.toString() );
          if (snapshot.hasError) {
            return new Text("fetch error");
          } else {
            for (int i = 0; i < snapshot.data.length; i++) {
              //debugPrint("Index is " + idx.toString());
              list.add(NetworkImage(snapshot.data[i].data["image"]));
              //idx++;
            }
            return new Container(
                height: 250.0,
                child: InkWell(
                    child: new Carousel(
                      boxFit: BoxFit.cover,
                      images: list,
                      onImageTap: (imageIndex) {
                        Navigator.of(context).push(
                          new MaterialPageRoute(
                            builder: (context) => new CustomClass(
                                name:
                                    snapshot.data[imageIndex].data["title"],
                                pic: snapshot
                                    .data[imageIndex].data["image"]),
                          ),
                        );
                      },
                      autoplay: false,
                      dotSize: 4.0,
                      indicatorBgPadding: 4.0,
                      animationCurve: Curves.fastOutSlowIn,
                      animationDuration: Duration(milliseconds: 1000),
                    )));
          }
        }
      }),
);

最佳答案

你可以使用cached network image库，它提供了delay、placeholder和fade动画，一个例子:

  child: new CachedNetworkImage(
             imageUrl: "http://via.placeholder.com/350x150",
             placeholder: new Image.asset('assets/placeholder.jpg'),
             errorWidget: new Icon(Icons.error),
             fit: BoxFit.fill,
             fadeInCurve: Curves.easeIn ,
             fadeInDuration: Duration(seconds: 2),
             fadeOutCurve: Curves.easeOut,
             fadeOutDuration: Duration(seconds: 2),
  )

关于dart - 如何在旋转木马 View 中添加 fadeinImage，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54720757/

何在fadeinImagesnapshotplaceholdersectiondartfluttercarouselflutter-layout

有关dart - 如何在旋转木马 View 中添加 fadeinImage的更多相关文章

  1. ruby - 如何在 Ruby 中顺序创建 PI - 2

    出于纯粹的兴趣，我很好奇如何按顺序创建PI，而不是在过程结果之后生成数字，而是让数字在过程本身生成时显示。如果是这种情况，那么数字可以自行产生，我可以对以前看到的数字实现垃圾收集，从而创建一个无限系列。结果只是在Pi系列之后每秒生成一个数字。这是我通过互联网筛选的结果:这是流行的计算机友好算法，类机器算法:defarccot(x,unity)xpow=unity/xn=1sign=1sum=0loopdoterm=xpow/nbreakifterm==0sum+=sign*(xpow/n)xpow/=x*xn+=2sign=-signendsumenddefcalc_pi(digits

  2. ruby - 我需要将 Bundler 本身添加到 Gemfile 中吗？ - 2

    当我使用Bundler时，是否需要在我的Gemfile中将其列为依赖项？毕竟，我的代码中有些地方需要它。例如，当我进行Bundler设置时:require"bundler/setup" 最佳答案 没有。您可以尝试，但首先您必须用鞋带将自己抬离地面。 关于ruby-我需要将Bundler本身添加到Gemfile中吗？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/4758609/

  3. ruby - 如何在 buildr 项目中使用 Ruby 代码？ - 2

    如何在buildr项目中使用Ruby？我在很多不同的项目中使用过Ruby、JRuby、Java和Clojure。我目前正在使用我的标准Ruby开发一个模拟应用程序，我想尝试使用Clojure后端(我确实喜欢功能代码)以及JRubygui和测试套件。我还可以看到在未来的不同项目中使用Scala作为后端。我想我要为我的项目尝试一下buildr(http://buildr.apache.org/)，但我注意到buildr似乎没有设置为在项目中使用JRuby代码本身!这看起来有点傻，因为该工具旨在统一通用的JVM语言并且是在ruby中构建的。除了将输出的jar包含在一个独特的、仅限ruby​​

  4. ruby - 什么是填充的 Base64 编码字符串以及如何在 ruby​​ 中生成它们？ - 2

    我正在使用的第三方API的文档状态:"[O]urAPIonlyacceptspaddedBase64encodedstrings."什么是“填充的Base64编码字符串”以及如何在Ruby中生成它们。下面的代码是我第一次尝试创建转换为Base64的JSON格式数据。xa=Base64.encode64(a.to_json) 最佳答案 他们说的padding其实就是Base64本身的一部分。它是末尾的“=”和“==”。Base64将3个字节的数据包编码为4个编码字符。所以如果你的输入数据有长度n和n%3=1=>"=="末尾用于填充n%

  5. ruby-on-rails - Rails - 一个 View 中的多个模型 - 2

    我需要从一个View访问多个模型。以前，我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它，但这似乎不是“ruby方式”，我将需要在不久的将来访问更多模型。这可能会变得很脏，是否有针对这种情况的任何技术？注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展，本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向，这似乎很麻烦。最终从任何

  6. ruby-on-rails - 渲染另一个 Controller 的 View - 2

    我想要做的是有2个不同的Controller，client和test_client。客户端Controller已经构建，我想创建一个test_clientController，我可以使用它来玩弄客户端的UI并根据需要进行调整。我主要是想绕过我在客户端中内置的验证及其对加载数据的管理Controller的依赖。所以我希望test_clientController加载示例数据集，然后呈现客户端Controller的索引View，以便我可以调整客户端UI。就是这样。我在test_clients索引方法中试过这个:classTestClientdefindexrender:template=>

  7. ruby - 将 Bootstrap Less 添加到 Sinatra - 2

    我有一个ModularSinatra应用程序，我正在尝试将Bootstrap添加到应用程序中。get'/bootstrap/application.css'doless:"bootstrap/bootstrap"end我在views/bootstrap中有所有less文件，包括bootstrap.less。我收到这个错误:Less::ParseErrorat/bootstrap/application.css'reset.less'wasn'tfound.Bootstrap.less的第一行是://CSSReset@import"reset.less";我尝试了所有不同的路径格式，但它

  8. ruby-on-rails - 如何在 ruby​​ 中使用两个参数异步运行 exe？ - 2

    exe应该在我打开页面时运行。异步进程需要运行。有什么方法可以在ruby​​中使用两个参数异步运行exe吗？我已经尝试过ruby​​命令-system()、exec()但它正在等待过程完成。我需要用参数启动exe，无需等待进程完成是否有任何ruby​​gems会支持我的问题？ 最佳答案 您可以使用Process.spawn和Process.wait2:pid=Process.spawn'your.exe','--option'#Later...pid,status=Process.wait2pid您的程序将作为解释器的子进程执行。除

  9. ruby - 如何在续集中重新加载表模式？ - 2

    鉴于我有以下迁移:Sequel.migrationdoupdoalter_table:usersdoadd_column:is_admin,:default=>falseend#SequelrunsaDESCRIBEtablestatement,whenthemodelisloaded.#Atthispoint,itdoesnotknowthatusershaveais_adminflag.#Soitfails.@user=User.find(:email=>"admin@fancy-startup.example")@user.is_admin=true@user.save!ende

  10. ruby - 续集在添加关联时访问many_to_many连接表 - 2

    我正在使用Sequel构建一个愿望list系统。我有一个wishlists和itemstable和一个items_wishlists连接表(该名称是续集选择的名称)。items_wishlists表还有一个用于facebookid的额外列(因此我可以存储opengraph操作)，这是一个NOTNULL列。我还有Wishlist和Item具有续集many_to_many关联的模型已建立。Wishlist类也有:selectmany_to_many关联的选项设置为select:[:items.*,:items_wishlists__facebook_action_id].有没有一种方法可以

随机推荐