如何在flutter中显示动画gif?

wmvff8tz  于 2023-05-29  发布在  Flutter
关注(0)|答案(7)|浏览(501)

我正在尝试在flutter中显示gif。
我正在使用代码

Image(image : NetworkImage(message.image_url))

但显示错误:

Another exception was thrown: Exception: HTTP request failed, statusCode: 403, https://media.giphy.com/media/13AXYJh2jDt2IE/giphy.gif%20
sh7euo9m

sh7euo9m1#

将您的gif放在项目的images文件夹中,并在pubspec.yaml文件中提及它,就像您对图像所做的那样。

Image.asset(
  "images/loading.gif",
  height: 125.0,
  width: 125.0,
),
tzdcorbm

tzdcorbm2#

这是Flutter Gallery应用程序中用于显示来自Web的.gif的内容

Image.network('https://example.com/animated-image.gif')
sg2wtvxw

sg2wtvxw3#

我发现了一种方法,可以使用@Nudge answer下载并在应用程序中添加giphy.com的gif。
你可以用这个技巧-
Sample Giphy's.gif URL - https://giphy.com/gifs/congratulations-congrats-xT0xezQGU5xCDJuCPe
1.你必须在-之后分割url的最后一部分。
1.在以下URL中插入最后一部分:https://giphy.com/media/{URL_PART}/200.gif
1.在这种情况下,URL_PART将是xT0xezQGU5xCDJuCPe。只需将其替换为上面的URL。
1.您将获得以下输出URL:https://giphy.com/media/xT0xezQGU5xCDJuCPe/200.gif
你看我希望它能帮助某人。;)

编辑:

最近,Giphy将其URL格式更改为https://i.giphy.com/media/${URL_PART}/200.gif(特别感谢@Rivaan提到它)。
现在,新的url将变为:https://i.giphy.com/media/xT0xezQGU5xCDJuCPe/200.gif

9udxz4iz

9udxz4iz4#

Giphy不允许您加载图像。Flutter对此无能为力:https://en.wikipedia.org/wiki/HTTP_403

xiozqbni

xiozqbni5#

向资产中添加新资源时,请重新启动ide

uajslkp6

uajslkp66#

更新@Chetan Goyal的回答。它现在抛出错误图像数据的异常。
要显示来自Giphy的类似https://giphy.com/gifs/congratulations-congrats-xT0xezQGU5xCDJuCPe的URL,我们需要提取连字符后的部分,即xT 0xezQGU 5xCDJuCPe并将其添加到此URL:https://i.giphy.com/media/${URL_PART}/200.gif
希望它能帮助到某人。

ippsafx7

ippsafx77#

来自资产

将gif放在项目的images文件夹中,并在pubspec.yaml文件中提及它,就像您对图像所做的那样。

Image.asset(
    "images/loading.gif",
    height: 125.0,
    width: 125.0,
),

来自网络

使用网络Image显示url中的gif。

Image.network('https://example.com/animated-image.gif ')

相关问题